如何压缩从flutter上传的图像

Question

如何压缩来自flutter的上传图像？

现在，我已经使用了这种方法，但我需要压缩图像文件，然后上传到firestore。

SimpleDialogOption(
padding: const EdgeInsets.all(20),
child: const Text('Take a photo'),
onPressed: () async {
Navigator.of(context).pop();
Uint8List file = await pickImage(ImageSource.camera);
setState(() {
_file = file;
});
},
),

我也见过类似的方法；但不知道如何改变它。

File _image;
Future getImage() async {
var image = await ImagePicker.pickImage(
source: ImageSource.gallery,  
imageQuality: 25,
);
setState(() {
_image = image;
});
}

Answer 1

请参阅以下拾取多个图像并压缩所有拾取图像的代码示例。

我使用了以下这些包

图像选择器：^1.2.4

flaft_image_compress:^0.7.0

class PickMultipleImagesScreen extends StatefulWidget {
const PickMultipleImagesScreen({Key key}) : super(key: key);
@override
_PickMultipleImagesScreenState createState() =>
_PickMultipleImagesScreenState();
}
class _PickMultipleImagesScreenState extends State<PickMultipleImagesScreen> {
final ValueNotifier<bool> attachMultipleImages = ValueNotifier<bool>(false);
List compressedPhotosList = ["place_holder"];
int maxImagesCount = 5;
pickPhotos() async {
List<Media> photosList = [];
photosList = await ImagesPicker.pick(
count: (compressedPhotosList != null &&
(compressedPhotosList.isNotEmpty) &&
(compressedPhotosList.length > 1))
? (maxImagesCount + 1 - compressedPhotosList.length)
: maxImagesCount,
pickType: PickType.all,
language: Language.System,
cropOpt: CropOption(
aspectRatio: CropAspectRatio(600, 400),
),
);
if (photosList != null && photosList.isNotEmpty && photosList.length > 0) {
for (int i = 0; i < photosList.length; i++) {
File photoCompressedFile =
await compressImage(File(photosList[i].path));
print("Images List: $photosList");
print("Path of UnCompressed File: ${photosList[i].path}");
compressedPhotosList.insert(
0,
photoCompressedFile.path.toString(),
);
print("Path of Compressed File: ${photoCompressedFile.path}");
print("Compressed Images List: $compressedPhotosList");
}
attachMultipleImages.value = !attachMultipleImages.value;
}
}
Future<File> compressImage(File file) async {
final filePath = file.absolute.path;
final lastIndex = filePath.lastIndexOf(new RegExp(r'.png|.jp'));
final splitted = filePath.substring(0, (lastIndex));
final outPath = "${splitted}_out${filePath.substring(lastIndex)}";
if (lastIndex == filePath.lastIndexOf(new RegExp(r'.png'))) {
final compressedImage = await FlutterImageCompress.compressAndGetFile(
filePath, outPath,
minWidth: 1000,
minHeight: 1000,
quality: 50,
format: CompressFormat.png);
return compressedImage;
} else {
final compressedImage = await FlutterImageCompress.compressAndGetFile(
filePath,
outPath,
minWidth: 1000,
minHeight: 1000,
quality: 50,
);
return compressedImage;
}
}
@override
Widget build(BuildContext context) {
return SafeArea(
child: ValueListenableBuilder<bool>(
valueListenable: attachMultipleImages,
builder: (context, snapshot, child) {
return Scaffold(
body: (compressedPhotosList != null &&
compressedPhotosList.isNotEmpty &&
compressedPhotosList.length > 1)
? GridView.builder(
itemCount: (compressedPhotosList != null &&
compressedPhotosList.isNotEmpty &&
compressedPhotosList.length > 1 &&
(compressedPhotosList.length - 1 == maxImagesCount))
? compressedPhotosList.length - 1
: compressedPhotosList.length,
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 4.0,
mainAxisSpacing: 4.0),
itemBuilder: (BuildContext context, int index) {
return ((compressedPhotosList[index] == "place_holder") &&
compressedPhotosList.length - 1 != maxImagesCount)
? InkWell(
onTap: () async {
if (compressedPhotosList.length - 1 !=
maxImagesCount) {
pickPhotos();
}
},
child: Container(
margin: EdgeInsets.all(
5.0,
),
width: ScreenUtil().screenWidth,
height: ScreenUtil().setHeight(105.0),
color: Colors.blueAccent,
child: Center(
child: Icon(
Icons.add,
size: ScreenUtil().setSp(24.0),
color: Colors.grey,
),
),
),
)
: Stack(
clipBehavior: Clip.none,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(4.0),
child: Image.file(
File(compressedPhotosList[index]),
fit: BoxFit.fitHeight,
width: ScreenUtil().screenWidth,
height: ScreenUtil().setHeight(105.0),
filterQuality: FilterQuality.low,
errorBuilder: (context, error, stackTrace) {
return Container(
width: ScreenUtil().screenWidth,
height: ScreenUtil().setHeight(105.0),
color: Colors.black,
);
},
),
),
Positioned(
bottom: 10,
right: 8,
child: InkWell(
onTap: () async {
compressedPhotosList.removeAt(index);
attachMultipleImages.value =
!attachMultipleImages.value;
},
child: CircleAvatar(
radius: 15.0,
backgroundColor: Colors.black45,
child: Icon(
Icons.delete_forever,
color: Colors.white,
size: 20,
),
),
),
)
],
);
},
)
: Center(
child: InkWell(
onTap: () {
pickPhotos();
},
child: Text("Attach Images"),
),
),
);
}
),
);
}
}