日益努力,而后风生水起|

Flutter图片选择器——image_picker插件的使用

image_picker是flutter官方维护开发的一个本地图片选择的插件。

安装

image_picker获取最新版本,在pubspec.yaml添加如下内容:

image_picker: ^latest_version

Android

打开app/src/main/AndroidManifest.xml文件,添加如下内容

<manifest>
  <application>
    ...
  </application>
  // 写入文件权限
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
  // 读取文件权限
  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
  // 相机权限
  <uses-permission android:name="android.permission.CAMERA" />
</manifest>

IOS

暂无

使用

// ImagePicker获取内容后返回的对象是XFile
XFile? image;
List<XFile>? imageList;
XFile? video;
// 使用ImagePicker前必须先实例化
final ImagePicker _imagePicker = ImagePicker();

ImagePicker类一共有3个实例方法,分别用来读取图片和视频:

pickImage

pickImage用来选择单张图片,可以传递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(() {});
}

GIF

// 设置返回图片的其他参数
selectImage() async {
  XFile? image = await _imagePicker.pickImage(
    source: ImageSource.gallery,
    maxHeight: 250,
    maxWidth: 250,
  );
  if (image != null) this.image = image;
  setState(() {});
}

image

// 设置返回图片的其他参数
selectImage() async {
  XFile? image = await _imagePicker.pickImage(
    source: ImageSource.gallery,
    imageQuality: 0,
  );
  if (image != null) this.image = image;
  setState(() {});
}

image

该属性用来压缩返回的图像,用肉眼很难看出差别。例如微信发图片总是会被压缩,就可以使用该属性实现。仅某些图像类型(例如 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(() {});
  );
}

image

pickMultiImage

pickImage用来选择多张图片,可以传递3个参数:

  • double? maxWidth:用来指定选择图片的最大宽度,若图片超过该宽度,将等比例缩小图片再返回,默认返回原始图片
  • double? maxHeight:用来指定选择图片的最大高度,若图片超过该高度,将等比例缩小图片再返回,默认返回原始图片
  • int? imageQuality:用来修改图片返回的质量,取值再0-100,越大返回图片的质量越高,默认为100,即原始图片
selectMultiImage() async {
  List<XFile>? images = await _imagePicker.pickMultiImage();
  if (images != null) imageList = images;
  setState(() {});
}

image

注意:选择多张图片时,必须长按才能多选,否则只会选择一张

pickVideo

pickVideo用来选择视频,可以传递3个参数:

  • required ImageSource source:该属性和pickImage一样,是从图库选择视频还是拍摄视频

  • CameraDevice preferredCameraDevice :当选择拍摄视频时,时使用前置还是后置摄像头工作

  • Duration? maxDuration:用来指定捕获的视频的最长时间,默认为无限制

ImageSource.galler

selectVideo() 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();
      });
    });
}
}

image

限制视频的最长时长:

XFile? video = await _imagePicker.pickVideo(
  source: ImageSource.gallery, 
  maxDuration: const Duration(milliseconds: 1000),
);

动图就不放了,maxDuration 这个属性当 source 为 ImageSource.galler 时无效,具体可以自己试验一下。

ImageSource.camera

XFile? video = await _imagePicker.pickVideo(
  source: ImageSource.camera, 
  maxDuration: const Duration(milliseconds: 3000),
);

image

可以看到 maxDuration: const Duration(milliseconds: 3000) 控制了拍摄时的最长时间。

同样的,设置前后置摄像头拍摄的参数 preferredCameraDevice 并不一定会起作用。

本文作者:菠萝橙子丶

本文链接:https://www.cnblogs.com/ilgnefz/p/15954507.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   菠萝橙子丶  阅读(13728)  评论(10编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起
  1. 1 Shining For One Thing 赵贝尔
Shining For One Thing - 赵贝尔
00:00 / 00:00
An audio error has occurred.

Shining For One Thing (《一闪一闪亮星星》影视剧歌曲) - 赵贝尔

词:萨吉

曲:金大洲

编曲:金大洲D-Jin

制作人:金大洲D-Jin

吉他/Bass:D-Jin

合声编写/合声:赵贝尔

人声录音/编辑:张德龙@D-Jin Music Studio

混音/母带处理:George Dum

宣传推广:杨慧颖/杨佩

封面设计:HOO

OP/音乐制作出品:D-Jin Music(北京翊辰文化传媒有限公司)

(未经著作权人许可,不得翻唱、翻录或使用)

夏夜的花火

夏夜的花火

因为你在身边而深刻

因为你在身边而深刻

幸运的是我

在宇宙之间听见承诺

在宇宙之间听见承诺

嗨 是我

这一次别再错过

这一次别再错过

喜欢你该由我主动了

喜欢你该由我主动了

星星那么多

星星那么多

有数不尽的浪漫闪烁

注定这一颗

会让你刻在手臂左侧

属于我

星形心率的贴合

幸有你总在守护我

幸有你总在守护我

I fall in love

I fall in love

I see your love

遇见你才发现我在

等你到来

等你到来

Fallen star

The wonder of you

我会永远在你天空

我会永远在你天空

为你闪烁 my love

为你闪烁 my love

Shining for one thing

Shining for one thing

Shining for one thing

Shining for one thing

It's you

It's you

星星那么多

星星那么多

有数不尽的浪漫闪烁

注定这一颗

会让你刻在手臂左侧

属于我

星形心率的贴合

幸有你总在守护我

幸有你总在守护我

I fall in love

I fall in love

I see your love

遇见你才发现我在

等你到来

等你到来

Fallen star

The wonder of you

我会永远在你天空

我会永远在你天空

为你闪烁 my love

为你闪烁 my love

Shining for one thing

Shining for one thing

Shining for one thing

Shining for one thing

It's you

It's you