flutter image_picker
点击选中图片,底部弹窗让用户选择使用相册还是相机,用户选中选项后,跳转到对应的相册或者相机功能,结果将图片显示出来
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的更多相关文章
- flutter image_picker使用照相机
dependencies: image_picker: ^0.4.12+1 最新的^0.5+9编译无法通过 import 'dart:io'; import 'dart:async'; import ...
- 调用原生硬件 Api 实现照相机 拍照和相册选择 以及拍照上传
一.Flutter image_picker 实现相机拍照和相册选择 https://pub.dev/packages/image_picker 二.Flutter 上传图片到服务器 ht ...
- flutter 上传图片 image_picker 的使用
Github地址: https://github.com/flutter/plugins/tree/master/packages/image_picker packages地址: https://p ...
- 【译】使用 Flutter 实现跨平台移动端开发
作者: Mike Bluestein | 原文地址:[https://www.smashingmagazine.com/2018/06/google-flutter-mobile-developm ...
- iOS开发者学习Flutter
Flutter for iOS 开发者 本文档适用那些希望将现有 iOS 经验应用于 Flutter 的开发者.如果你拥有 iOS 开发基础,那么你可以使用这篇文档开始学习 Flutter 的开发. ...
- flutter插件汇总2
作者:知乎用户链接:https://www.zhihu.com/question/307594373/answer/568969429来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...
- flutter插件汇总
audio_recorder: any #录音.播放 flutter_sound: ^#录音 dropdown_menu: ^#下拉菜单 simple_permissions:#权限获取 easy_a ...
- flutter 常用插件
audio_recorder: any #录音.播放 flutter_sound: ^1.1.5#录音 dropdown_menu: ^1.1.0#下拉菜单 simple_permissions:#权 ...
- Flutter 相机定制
Flutter中与硬件相关的部分,一直都挺蛋疼的.方案基本上有两种,自己写,或者等出相关的库. 最近做的一个项目中,需要对相机做定制.有过相关模块开发经验的,就知道这种需求并不简单,况且是这种跨平台解 ...
随机推荐
- plsql之导入数据乱码
问题现象: 首先是使用了plsql 8.0版本客户端导入 ANSI as UTF-8 的字符集 格式sql 文件进行数据的导入, 然后检查了所有的系统环境的字符集和plsql 的字符集 都OK 的但 ...
- session共享原理以及PHP 实现多网站共享用户SESSION 数据解决方案
参考自: http://www.cnblogs.com/qulinke/articles/6003049.html https://segmentfault.com/q/101000000578847 ...
- local_time
time_t time(time_t *tloc); 功能:获取纪元1970-01-01 00:00:00以来所经历的秒数 参数: tloc:用来存储返回时间 返回值:成功:返回秒数, 失败:-1 - ...
- 关于ORACLE事务处理的一些笔记
这是2013年在看ORACLE概念手册的时候的一些笔记,现在整理如下(可能跟其他一些文章的内容有重复): 20131012 周六 oracle概念手册中文版 第4章 事务管理 事务具有原子 ...
- Java文档查看
对于Java学习者来说,阅读Java文档是必不可少的步骤,比如我现在想知道List接口的retianAll()方法,该怎么办呢? 当然是百度了!!! 皮一下,当然是查找Java文档了,以JDK1.7版 ...
- NOIP2017提高A组模拟10.6】Biology
题目 trie 暴力就是对于每个询问的T个字符串 第i个和第i+1个直接个从后暴力枚举每位是否相同, 但这个方法TLE 我们考虑是否可以用更快的方法来求出两个字符串的最长公共后缀. 我们把所有的字符串 ...
- sqlite3创建自增主键,以及清空表使自增列归零
1.创建自增主键 CREATE TABLE tb_python (ID INTEGER PRIMARY KEY AUTOINCREMENT,TITLE TEXT,URL TEXT); 2.清空表 SQ ...
- C# => 写法
public static IWebHostBuilder CreateWebHostBuilder(string[] args) => WebHost.CreateDefaultBuilder ...
- CSS的 背景属性
㈠背景色 background-color ⑴background-color 属性设置元素的背景颜色. ⑵元素背景的范围: background-color 属性为元素设置一种纯色.这种颜色会填充 ...
- hdu 3572 仪器与任务 最大流 好题 体会建图思想
Task Schedule Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...