点击选中图片,底部弹窗让用户选择使用相册还是相机,用户选中选项后,跳转到对应的相册或者相机功能,结果将图片显示出来

image_picker: ^0.6.1+4

iOS使用image_picker需要在info.plist中添加3个字符串字段

   Privacy - Photo Library Usage Description
Privacy - Camera Usage Description
Privacy - Microphone Usage Description

相关代码

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart'; class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
} class _HomePageState extends State<HomePage> {
File _image;
File _image2; Future getImage(ImageSource source, int type) async {
var image = await ImagePicker.pickImage(source: source);
setState(() {
if (type == 0) {
_image = image;
} else {
_image2 = image;
}
});
} @override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('aaaa'),
),
body: Center(
child: Column(
// crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
GestureDetector(
child: Container(
width: 100,
height: 100,
color: Colors.blue,
child: _image == null
? Text('No image selected.')
: Image.file(_image,fit: BoxFit.cover,),
),
onTap: () {
//点击选取图片
// getImage(0);
_showSelectionDialog(context,0);
},
),
GestureDetector(
child: Container(
width: 100,
height: 100,
color: Colors.orange,
child: _image2 == null
? Text('No image selected.')
: Image.file(_image2,fit: BoxFit.cover),
),
onTap: () {
_showSelectionDialog(context,1);
// getImage(1); },
),
],
),
],
)),
);
} void _showSelectionDialog(BuildContext context,int type) {
showModalBottomSheet(
context: context,
isScrollControlled: false,
builder: (ctx) {
return Container(
color: Colors.grey,
height: 130,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
GestureDetector(
child: _itemCreat(context, '相机'),
onTap: (){
print('选中相机');
Navigator.pop(context);
getImage(ImageSource.camera,type);
},
),
GestureDetector(
child: _itemCreat(context, '相册'),
onTap: (){
print('选中相册');
Navigator.pop(context);
getImage(ImageSource.gallery,type);
},
),
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: 40,
width: MediaQuery.of(context).size.width,
child: Center(
child: Text(
title,
style: TextStyle(fontSize: 16, color: Colors.black),
textAlign: TextAlign.center,
),
),
);
}
}

flutter image_picker的更多相关文章

  1. flutter image_picker使用照相机

    dependencies: image_picker: ^0.4.12+1 最新的^0.5+9编译无法通过 import 'dart:io'; import 'dart:async'; import ...

  2. 调用原生硬件 Api 实现照相机 拍照和相册选择 以及拍照上传

    一.Flutter image_picker 实现相机拍照和相册选择   https://pub.dev/packages/image_picker   二.Flutter 上传图片到服务器   ht ...

  3. flutter 上传图片 image_picker 的使用

    Github地址: https://github.com/flutter/plugins/tree/master/packages/image_picker packages地址: https://p ...

  4. 【译】使用 Flutter 实现跨平台移动端开发

    作者: Mike Bluestein   | 原文地址:[https://www.smashingmagazine.com/2018/06/google-flutter-mobile-developm ...

  5. iOS开发者学习Flutter

    Flutter for iOS 开发者 本文档适用那些希望将现有 iOS 经验应用于 Flutter 的开发者.如果你拥有 iOS 开发基础,那么你可以使用这篇文档开始学习 Flutter 的开发. ...

  6. flutter插件汇总2

    作者:知乎用户链接:https://www.zhihu.com/question/307594373/answer/568969429来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...

  7. flutter插件汇总

    audio_recorder: any #录音.播放 flutter_sound: ^#录音 dropdown_menu: ^#下拉菜单 simple_permissions:#权限获取 easy_a ...

  8. flutter 常用插件

    audio_recorder: any #录音.播放 flutter_sound: ^1.1.5#录音 dropdown_menu: ^1.1.0#下拉菜单 simple_permissions:#权 ...

  9. Flutter 相机定制

    Flutter中与硬件相关的部分,一直都挺蛋疼的.方案基本上有两种,自己写,或者等出相关的库. 最近做的一个项目中,需要对相机做定制.有过相关模块开发经验的,就知道这种需求并不简单,况且是这种跨平台解 ...

随机推荐

  1. 无Xwindow的linux系统安装VMware Tools

    首先登陆linux 系统,最好是root用户: 然后挂载cdrom: mkdir -p /mnt/cdrom mount -t iso9660 /dev/cdrom /mnt/cdrom 进入cdro ...

  2. java 文件上传与解析(excel,txt)

    excel上传与解析 https://blog.csdn.net/zsysu_it/article/details/79074067 txt解析 https://blog.csdn.net/CSDNw ...

  3. noi.ac NA529 【神树的矩阵】

    表示今天一发A了这题拿了rk3...是个sb构造... 考虑除了\(n=1/m=1\)的情况,最小次数\(ans\)不会\(>3\). 对于\(n=1/m=1\),暴力即可. 然后考虑\(ans ...

  4. 【CF208E】Blood Cousins

    题目大意:给定一个 N 个点的森林,M 个询问,每次询问对于点 u 来说,有多少个点和 u 有相同的 K 级祖先. 题解:线段树合并适合处理子树贡献的问题. 发现要回答这个询问在点 u 处计算很困难, ...

  5. LINUX笔记之二常用命令(权限管理命令)

    1. +增加权限:-去掉权限:=直接赋权. r(4)w(2)x(1) 重点掌握:通过数字授权,例如rxwr-xr--是754 例题:用root用户创建目录并在此目录新建文件,之后更改新文件的权限为77 ...

  6. HTTP 请求出现 405 not allowed 的一种解决办法

    问题:http post请求网页会出现405 原因: Apache.IIS.Nginx等绝大多数web服务器,都不允许静态文件响应POST请求 解决:将post请求改为get请求

  7. python re.match与re.search的区别

    re.match只匹配字符串的开始,如果字符串开始不符合正则表达式,则匹配失败,函数返回None:而re.search匹配整个字符串,直到找到一个匹配. #!/usr/bin/python impor ...

  8. vue-upload 封装组件-上传组件

    我后端的,刚接触vue个星期,根据需求写了个上传控件,很灵活的.没有看element el-upload源码,样式用的element的.感觉vue确实好用. 先看样子: <!-- 单文件上传组件 ...

  9. Python初记

    ------Python是一个优雅的大姐姐 我是通过<老男孩Python>学习Python,根据我手上的资源学习Python,资料不齐,但是这个是最好的,边学习边寻找有没有相同的类型. 在 ...

  10. Nowcoder Circulant Matrix ( FWT )

    题目链接 题意 : 给你一个a数组和b数组,构造出A[i][j]矩阵(A[i][j] = a[i xor j]) 给出等式 A * x = b ( mod p ) n等于4的时候有: A[0][0]* ...