前言:
相较于前一版https://blog.csdn.net/m0_73231884/article/details/143768951?spm=1001.2014.3001.5501
在这个版本中我将三个参数的按钮整合在了一起,并使用底部弹框的方式展现
其中,我修改了Slider组件的值,最小值为-40,最大值为40 。
源码如下:
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: ImageUploadScreen(),
);
}
}
class ImageUploadScreen extends StatefulWidget {
@override
_ImageUploadScreenState createState() => _ImageUploadScreenState();
}
class _ImageUploadScreenState extends State<ImageUploadScreen> {
File? _image;
double _exposure = 0.0; // 初始曝光度
double _contrast = 0.0; // 初始对比度
double _saturation = 0.0; // 初始饱和度
String _currentAdjustment = '曝光度'; // 当前选择的调整类型
Future<void> _pickImage() async {
final picker = ImagePicker();
final pickedFile = await picker.pickImage(source: ImageSource.gallery);
if (pickedFile != null) {
setState(() {
_image = File(pickedFile.path);
_exposure = 0.0;
_contrast = 0.0;
_saturation = 0.0;
_currentAdjustment = '曝光度';
});
}
}
List<double> _calculateColorMatrix() {
double invSat = 1 - (_saturation / 40 + 1);
double R = 0.213 * invSat;
double G = 0.715 * invSat;
double B = 0.072 * invSat;
double contrast = _contrast / 40 + 1;
double exposure = _exposure / 40 + 1;
return <double>[
contrast * (R + (_saturation / 40 + 1)) * exposure,
contrast * G * exposure,
contrast * B * exposure, 0, 0, // Red
contrast * R * exposure,
contrast * (G + (_saturation / 40 + 1)) * exposure,
contrast * B * exposure, 0, 0, // Green
contrast * R * exposure, contrast * G * exposure,
contrast * (B + (_saturation / 40 + 1)) * exposure, 0, 0, // Blue
0, 0, 0, 1, 0, // Alpha
];
}
void _showAdjustmentModal() {
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setModalState) {
return Container(
padding: EdgeInsets.all(16),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
_buildAdjustmentIcon(
'曝光度', Icons.wb_sunny, setModalState),
_buildAdjustmentIcon(
'对比度', Icons.tonality, setModalState),
_buildAdjustmentIcon(
'饱和度', Icons.color_lens, setModalState),
],
),
Slider(
value: _getCurrentValue(),
min: -40.0,
max: 40.0,
divisions: 80,
label: _getCurrentValue().toStringAsFixed(1),
onChanged: (value) {
setModalState(() {
_setCurrentValue(value);
});
setState(() {});
},
),
],
),
);
},
);
},
);
}
Widget _buildAdjustmentIcon(
String adjustmentType, IconData icon, StateSetter setModalState) {
final isSelected = _currentAdjustment == adjustmentType;
return Column(
children: [
IconButton(
icon: Icon(icon, color: isSelected ? Colors.blue : Colors.grey),
onPressed: () {
setModalState(() {
_currentAdjustment = adjustmentType;
});
setState(() {});
},
),
Text(adjustmentType),
],
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('主程序窗口'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_image == null
? Text('没有选择图片。')
: AspectRatio(
aspectRatio: 1, // 你可以根据需要调整这个比例
child: ColorFiltered(
colorFilter: ColorFilter.matrix(_calculateColorMatrix()),
child: Image.file(
_image!,
fit: BoxFit.contain, // 适应容器
),
),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: _pickImage,
child: Text('上传图片'),
),
],
),
),
bottomNavigationBar: BottomAppBar(
child: IconButton(
icon: Icon(Icons.tune), // 调节图标
onPressed: _image != null ? _showAdjustmentModal : null,
),
),
);
}
double _getCurrentValue() {
switch (_currentAdjustment) {
case '曝光度':
return _exposure;
case '对比度':
return _contrast;
case '饱和度':
return _saturation;
default:
return 0.0;
}
}
void _setCurrentValue(double value) {
switch (_currentAdjustment) {
case '曝光度':
_exposure = value;
break;
case '对比度':
_contrast = value;
break;
case '饱和度':
_saturation = value;
break;
}
}
}
喜欢的朋友欢迎使用,小萌新勿喷,上述源码复制粘贴即可使用。
最后,点赞关注支持一下吧(~ ̄▽ ̄)~
标签:saturation,return,double,40,UI,对比度,Flutter,contrast,exposure From: https://blog.csdn.net/m0_73231884/article/details/143775382