image_picker是flutter官方维护开发的一个本地图片选择的插件。
安装点image_picker获取最新版本,在pubspec.yaml添加如下内容:
image_picker: ^latest_versionAndroid打开app/src/main/AndroidManifest.xml文件,添加如下内容
...// 写入文件权限// 读取文件权限// 相机权限 IOS暂无
使用// ImagePicker获取内容后返回的对象是XFileXFile? image;List? imageList;XFile? video;// 使用ImagePicker前必须先实例化final ImagePicker _imagePicker = ImagePicker();ImagePicker类一共有3个实例方法,分别用来读取图片和视频:
pickImagepickImage用来选择单张图片,可以传递5个参数:
required ImageSource source:该属性需要传递一个ImageSource类的枚举值:ImageSource.gallery:获取手机图库的所有图片进行选择ImageSource.camera:调用摄像头拍摄一张图片并选择double? maxWidth:用来指定选择图片的最大宽度,若图片超过该宽度,将等比例缩小图片再返回,默认返回原始图片double? maxHeight:用来指定选择图片的最大高度,若图片超过该高度,将等比例缩小图片再返回,默认返回原始图片int? imageQuality:用来修改图片返回的质量(压缩),取值在0-100,越大返回图片的质量越高,默认为100,即原始图片CameraDevice preferredCameraDevice:当使用ImageSource.camera时,调用前置摄像头还是后置摄像头(注意,Android 没有记录参数来指定是否应打开前置或后置摄像头,此功能不能保证在 Android 设备上工作)。该属性也是传递一个枚举值:CameraDevice.rear:调用前置摄像头(默认)CameraDevice.front:调用后置摄像头ImageSource.gallery从图库选择单张图片
selectImage() async { XFile? image = await _imagePicker.pickImage(source: ImageSource.gallery, ); if (image != null) this.image = image; setState(() {});}// 设置返回图片的其他参数selectImage() async { XFile? image = await _imagePicker.pickImage(source: ImageSource.gallery,maxHeight: 250,maxWidth: 250, ); if (image != null) this.image = image; setState(() {});}// 设置返回图片的其他参数selectImage() async { XFile? image = await _imagePicker.pickImage(source: ImageSource.gallery,imageQuality: 0, ); if (image != null) this.image = image; setState(() {});}该属性用来压缩返回的图像,用肉眼很难看出差别。例如微信发图片总是会被压缩,就可以使用该属性实现。仅某些图像类型(例如 JPEG)以及 Android PNG 和 WebP 支持压缩。
ImageSource.camera打开相机拍摄选择相片
selectCamera() async { XFile? photo = await _imagePicker.pickImage(source: ImageSource.camera,preferredCameraDevice: CameraDevice.rear,if (photo != null) image = photo;setState(() {}); );}pickMultiImagepickImage用来选择多张图片,可以传递3个参数:
double? maxWidth:用来指定选择图片的最大宽度,若图片超过该宽度,将等比例缩小图片再返回,默认返回原始图片double? maxHeight:用来指定选择图片的最大高度,若图片超过该高度,将等比例缩小图片再返回,默认返回原始图片int? imageQuality:用来修改图片返回的质量,取值再0-100,越大返回图片的质量越高,默认为100,即原始图片selectMultiImage() async { List? images = await _imagePicker.pickMultiImage(); if (images != null) imageList = images; setState(() {});}注意:选择多张图片时,必须长按才能多选,否则只会选择一张
pickVideopickVideo用来选择视频,可以传递3个参数:
required ImageSource source:该属性和pickImage一样,是从图库选择视频还是拍摄视频
CameraDevice preferredCameraDevice :当选择拍摄视频时,时使用前置还是后置摄像头工作
Duration? maxDuration:用来指定捕获的视频的最长时间,默认为无限制
ImageSource.gallerselectVideo() async {XFile? video = await _imagePicker.pickVideo(source: ImageSource.gallery);if (video != null) { this.video = video; _playerController = VideoPlayerController.file(File(video.path))..initialize().then((_) { setState(() {_playerController.play(); });});}}限制视频的最长时长:
XFile? video = await _imagePicker.pickVideo( source: ImageSource.gallery,maxDuration: const Duration(milliseconds: 1000),);动图就不放了,maxDuration 这个属性当 source 为 ImageSource.galler 时无效,具体可以自己试验一下。
ImageSource.cameraXFile? video = await _imagePicker.pickVideo( source: ImageSource.camera,maxDuration: const Duration(milliseconds: 3000),);可以看到 maxDuration: const Duration(milliseconds: 3000) 控制了拍摄时的最长时间。
同样的,设置前后置摄像头拍摄的参数 preferredCameraDevice 并不一定会起作用。