點擊選中圖片,底部彈窗讓用戶選擇使用相冊仍是相機,用戶選中選項後,跳轉到對應的相冊或者相機功能,結果將圖片顯示出來app
image_picker: ^0.6.1+4
iOS使用image_picker須要在info.plist中添加3個字符串字段async
Privacy - Photo Library Usage Description Privacy - Camera Usage Description Privacy - Microphone Usage Description
相關代碼ide
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, ), ), ); } }