[Flutter/dart]画像をローカルディレクトリに保存する


概要


スマホアプリにおいて、アプリ終了後もデータを保持したい場合は、sharedpreferenceなどに変数の値を取得しておく。では、画像を保存したい場合はどうすればいいのか。

結論は、スマホのローカルディレクトリに画像を保存し、ファイルのパスをStringとしてsharedpereferenceなどに保存しておけばよい。



手法


必要なモジュールをimport しておく

import 'dart:io' as io;
import 'package:path/path.dart' as path;

まずはスマホのギャラリーから画像を取得する(ここはカメラで撮影でもネットからダウンロードでもなんでも、とにかく画像ファイルを取得する作業)

final picker=ImagePicker();
final pickedFile = await picker.getImage(source: ImageSource.gallery);
String filePath=pickedFile.path;


次に、ローカルディレクトリに取得した画像を保存する。

io.File _target_file = io.File(filePath);  //型変換
String _base_name = path.basename(file);   //パスからファイル名を取得
String loacl_dir = await getLocalDir();    //ローカルディレクトリを取得
String _image_path_str = "${loacl_dir}/${_base_name}"; 
//ローカルディレクトリへのパス
io.File _image_path_save = io.File(_image_path_str); //型変換

io.File savedFile =
  await _image_path_save.writeAsBytes(await_target_file.readAsBytes());
//ファイルを書き込み

3行目でローカルディレクトリのフォルダまでのパスを取得し、4行目でファイル名とディレクトリ名を結合してローカルディレクトリへのファイルパスを作成している。


ローカルディレクトリのフォルダパスを取得する関数は以下の通り。

static Future<String> getLocalDir() async {
  final directory = await getApplicationDocumentsDirectory();
  return directory.path;
}

後は、_image_path_strをsharedpreferenceなどに保存すればよい。


画像を読み出す手法は以下の通り。

_image_file_name=path.basename(_image_path_str);
final String _local_dir= await getLocalDir();
io.File _image_path = io.File("${_local_dir}/${_image_file_name}");


ここで注意しなければいけないのは、_image_path_strを読み出してそのまま

io.File _image_path = io.File(_image_path_str);

としても上手くいかない。その都度ローカルディレクトリを取得しなければならない。(理由はよく分からない)



最後に


リモートサーバと接続するようなアプリならサーバに保存してしまえばいいのであんまり需要ないかも、、、

ただ、これだけのためにサーバ用意したり、ユーザアカウント作ったりしたくないという場合には使ってみてね。

最新記事

すべて表示

現象 flutter_local_notificationを使って通知を作成。通知タップ時の動作も登録。 通知が来た時にアプリが立ち上がっている(foregroundでもbackgroundでも)と、期待通りの動作となる。 しかし、通知が来た時にアプリが終了していると、通知をタップしても登録した動作とならない。 原因と解決策 アプリが終了すると登録した動作は消えてしまうらしい(参考)。 Note:

概要 Firebase Messagingでメッセージを送信し、通知がタップされたら何らかの動作を実行する(例:特定のページに移動する)という場合は多いかと思います。 通知タップ時にアプリがforeground状態(つまりアプリを開いている)ならば簡単なのですが、アプリがbackground状態にある場合は少し工夫が必要です。 方法 FirebaseMessaging.onBackgroundMe

現象 FirebaseMessaging.onBackgroundMessage()でタイトルのエラーが発生。 原因と解決策 上記メソッドの引数に渡すデリゲートはトップレベル関数でなければならない。自分の場合はインスタンスメソッドを渡していたのでエラーとなった。 渡すメソッドをトップレベル関数にするとエラーは解消した。 @main.dart void main() async{ //略 F

靴を大切にしよう!靴管理アプリ SHOES_KEEP

納品:iPhone6.5①.png

靴の履いた回数、お手入れ回数を管理するアプリです。

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png

テーマ日記:テーマを決めてジャンルごとに記録

訂正①2040×1152.jpg

ジャンルごとにテーマ、サブテーマをつけて投稿、記録できる日記アプリです。

google-play-badge.png