##install
dependencies:
image_picker: ^0.6.7+14
$flutter pub get
import 'dart:io';
import 'package:image_picker/image_picker.dart';
##ios
project-root/ios/Runner/Info.plistに以下のキーを追加
-
NSPhotoLibraryUsageDescription
アプリにフォト ライブラリの許可が必要な理由を説明します。これは、ビジュアルエディタでは「プライバシー フォトライブラリ使用説明」と呼ばれています。 -
NSCameraUsageDescription
アプリがカメラへのアクセスを必要とする理由を記述します。これは、ビジュアルエディタの「プライバシー - カメラの使用状況の説明」と呼ばれます。 -
NSMicrophoneUsageDescription
ビデオを録画する場合、アプリがマイクへのアクセスを必要とする理由を説明します。これは、ビジュアル エディタの「プライバシー - マイク使用状況の説明」と呼ばれています。
project-root/ios/Runner/Info.plist
<dict>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app requires to access your photo library</string>
<key>NSCameraUsageDescription</key>
<string>This app requires to add file to your camera</string>
<key>NSMicrophoneUsageDescription</key>
<string>This app requires to add file to your photo library your microphone</string>
</dict>
##Android
- 29 <= API
設定は必要ありません
- API < 29
下記を追加してください
AndroidManifest.xml
<application>android:requestLegacyExternalStorage="true"</application>
##ソースコード
class _ImageUploadPage extends StatefulWidget{
@override
__ImageUploadPageState createState() => __ImageUploadPageState();
}
class __ImageUploadPageState extends State<_ImageUploadPage> {
File _image;
final picker = ImagePicker();
Future chooseImage() async {
final pickedFile = await picker.getImage(source: ImageSource.gallery);
setState(() {
if (pickedFile != null) {
_image = File(pickedFile.path);
} else {
print('No image selected.');
}
});
}
Future getImage() async {
final pickedFile = await picker.getImage(source: ImageSource.camera);
setState(() {
if (pickedFile != null) {
_image = File(pickedFile.path);
} else {
print('No image selected.');
}
});
}
@override
Widget build(BuildContext context){
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white10,
elevation: 0.0,
iconTheme: IconThemeData(
color: Colors.green,//change your color here
),
),
body:Center(
child: _image == null
? Text('画像が選択されていません。')
: Image.file(_image),
),
floatingActionButton: Column(
verticalDirection: VerticalDirection.up, // childrenの先頭を下に配置
mainAxisSize: MainAxisSize.min,
children: <Widget>[
FloatingActionButton(
heroTag: "hero1",
onPressed: getImage,
tooltip: 'Pick Image',
child: Icon(Icons.add_a_photo)
// backgroundColor: Colors.redAccent,
),
Container( // 余白のためContainerでラップ
margin: EdgeInsets.only(bottom: 16.0),
child: FloatingActionButton(
heroTag: "hero2",
onPressed: chooseImage,
tooltip: 'Pick Image',
child: Icon(Icons.photo_album),
// backgroundColor: Colors.amberAccent,
),
),
],
)
);
}
}
##参考文献
pub.devのimage_picker
【Flutter】【Dart】Image Pickerで画像を選択する