【Flutter之打开系统相册,拍照,剪裁】

准备工作

(1)添加依赖

 image_picker: ^0.6.4
 image_cropper: ^1.2.1

Android

建议添加上这些权限在清单文件下:

 
 
  
  

在application标签下添加:

 

PS:测试发现,我们是不需要动态申请权限的,image_picker 插件都给封装进去了,使用的时候,它会自动去申请权限。

ios

需要在 Info.plist 下添加:

   NSPhotoLibraryUsageDescription
    Example usage description
    NSCameraUsageDescription
    Example usage description
	CFBundleDevelopmentRegion

如何使用:

这里直接上代码,关键处已做说明:

//弹出底部菜单
void _showBottomMenu(BuildContext context) {
    showModalBottomSheet(
        context: context,
        //isScrollControlled: true,//设为true,此时为全屏展示

        builder: (BuildContext context) {
          return Container(
            color: Colors.white,
            height: 180,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                ListTile(
                  title: Text('拍照',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16,
                          color: KColors.colorAccent)),
                  onTap: () {
                    _takePhoto();
                    Navigator.pop(context);
                  },
                ),
                Divider(
                  height: 1,
                ),
                ListTile(
                  title: Text('相册',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16,
                          color: KColors.colorAccent)),
                  onTap: () {
                    _openPhotoAlbum();
                    Navigator.pop(context);
                  },
                ),
                Container(
                  color: KColors.divider,
                  height: 10,
                ),
                ListTile(
                  title: Text('取消',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16, color: KColors.gray_33)),
                  onTap: () {
                    Navigator.pop(context);
                  },
                ),
              ],
            ),
          );
        });
  }

  File _image;

  ///拍照
  Future _takePhoto() async {
    var image = await ImagePicker.pickImage(source: ImageSource.camera);

    setState(() {
      _cropImage(image);
    });
  }

  ///打开相册
  Future _openPhotoAlbum() async {
    var image = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      _cropImage(image);
    });
  }

//剪裁
  _cropImage(File imageFile) async {
    File croppedFile = await ImageCropper.cropImage(
      sourcePath: imageFile.path,
      aspectRatioPresets: [
        CropAspectRatioPreset.square,
        CropAspectRatioPreset.ratio3x2,
        CropAspectRatioPreset.original,
        CropAspectRatioPreset.ratio4x3,
        CropAspectRatioPreset.ratio16x9
      ],
      androidUiSettings: AndroidUiSettings(
          toolbarTitle: '剪裁图片',
          toolbarColor: Colors.white,
          toolbarWidgetColor: Colors.black,
          initAspectRatio: CropAspectRatioPreset.original,
          lockAspectRatio: false),
      iosUiSettings: IOSUiSettings(
        minimumAspectRatio: 1.0,
      ),
    );

    if (croppedFile != null) {
      setState(() {
        _image = croppedFile;
      });
    }
  }

依赖地址:

image_picker

image_cropper

你可能感兴趣的:(flutter)