Flutter 账号设置页（2）获取相册中的图片和用相机拍照

666.png

上篇文章主要写了Item的组件，和Visibility 的简单用法

这篇文章主要是图片的选择的使用方法

在原生开发中经常可见图片的选择的需求，这个插件完美实现Ios和Android上的图片选择功能，并且不需要处理权限的问题

首先添加依赖

在pubspec.yaml加入image_picker的依赖，版本号在github上找最新的即可。
我这里用的 如下

dependencies:
  image_picker: ^0.6.1+4

拍照

var image = await ImagePicker.pickImage(source: ImageSource.camera);

拍照

var image = await ImagePicker.pickImage(source: ImageSource.gallery);

下面看我在这里的具体用法，底部弹窗弹出：

/// 底部弹窗
  void _showSelectionDialog(BuildContext context) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      builder: (ctx) {
        return Container(
          color: Colors.white,
          height: 170,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              GestureDetector(
                child: _itemCreat(context, '相机'),
                onTap: () {
                  Navigator.pop(context);
                  getImage(ImageSource.camera);
                },
              ),
              GestureDetector(
                child: _itemCreat(context, '相册'),
                onTap: () {
                  Navigator.pop(context);
                  getImage(ImageSource.gallery);
                },
              ),
              GestureDetector(
                child: Padding(
                  padding: EdgeInsets.only(top: 10),
                  child: _itemCreat(context, '取消'),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              )
            ],
          ),
        );
      },
    );
  }

  Widget _itemCreat(BuildContext context, String title) {
    return Container(
      color: Colors.white,
      height: 50,
      width: MediaQuery.of(context).size.width,
      child: Center(
        child: Text(
          title,
          style: TextStyle(fontSize: 16, color: Colors.black),
          textAlign: TextAlign.center,
        ),
      ),
    );
  }

GIthub 点我点我