【Flutter】image_picker バージョン0.6.7以降を使って画像を選択する

Flutterで画像を選択するといえばimage_pickerと言うパッケージを使いますよね。

しかしバージョンが0.6.7以降からクラスが変更になり、Webでの実装が可能になったそうです。

よって、image_picker 0.6.7以降の使い方をサンプルをもとに説明します。

サンプル

FloatingActionButtonをタップして画像を選択すると、表示されるようなサンプルを作成しました。

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';

class SampleImagePicker extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _SampleImagePicker();
}

class _SampleImagePicker extends State<SampleImagePicker> {
  File _image;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('image_picker'),
      ),
      body: Center(
        child: _image == null ? Text('画像を選択してください') : Image.file(_image),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.photo_album),
        onPressed: () {
          getImage();
        },
      ),
    );
  }

//画像を取得する
  getImage() async {
    PickedFile pickedFile = await ImagePicker().getImage(
      source: ImageSource.gallery,
    );
    if (pickedFile != null) {
      setState(() {
        _image = File(pickedFile.path);
      });
    }
  }
}

説明

0.6.7以前は
File image = await ImagePicker.pickImage(source: ImageSource.gallery);
というコードで、画像をデバイスの画像ライブラリから取得することができました。

しかし0.6.7以降は

PickedFile pickedFile = await ImagePicker().getImage(source: ImageSource.gallery);

となります。FileからPickedFileというクラスに変更しています。

_image = File(pickedFile.path)

このように、PickedFileのpathでFileに変換できます。

また
getImageのなかで

• imageQuality：画像のサイズ
• maxWidth：横の最大値
• maxHeight：縦の最大値
  も指定できます(これは0.6.2 + 2以降）

最後に

• ビデオ取得

PickedFile video = await ImagePicker().getVideo(source: ImageSource.gallery);