ほねぶろぐスマートフォン用の表示で見るほねぶろぐアニメとAndroidが好きなほねっとのブログです。参加させていただきました。qiita.comこの記事の前と、そのさらに前の合計3記事でワンセットになります。blog.aftercider.com前に投稿した2つの記事は他の方も紹介していたり、ライブラリのExampleでだいたい理解できるところではあるのですが、今回のテーマとした「写真の保存」については個人的にも苦戦したため、AdventCalendarのエントリとしてまとめてみました。1.0.0が出て嬉しいかぎりです!想定する読者iOS開発/Android開発がなんとなくわかるFlutterは初心者(なので、クラス分割は行わず、ワンソースで処理を追えるようにします)やりたいこと以前の記事で、カメラプレビューの表示・撮影、そしてアプリケーション領域への撮影画像の保存をまとめました。今回は撮影画像の保存先を他のアプリやPCからアクセスできるようにしていきます。写真領域)に保存していきます。ファイル保存のパーミッション設定アプリケーション領域と異なり、Android・iOSそれぞれアプリケーション管轄外の保存領域に書き込むため、Permissionの取得が必要です。パーミッション管理モジュールは、simple_permissionモジュールを使います。pub.dartlang.org(ちなみに最初、permission_handlerモジュールを最初使ったのですが、iOS環境でビルドするのに難儀したため、使用するのを断念しました。)https://pub.dartlang.org/packages/permission_handlerAndroidの設定まずは設定の簡単なAndroidの方から進めます。触った感想なのですが、Androidではサクッと動くモジュールも、iOSになると何か手を入れないと動かない、みたいなことが多いような気がしています。それもあって、まずはAndroidから作るようなプロセスを今のところやっています。パーミッションを要求する宣言を追加します。method.iOSの設定iOSではPhotoLibraryにアクセスするためには、Info.plistに用途について記述することが必要です。以下のように項目を追加します。詳しくはこちらの記事を。dev.classmethod.jpちなみに私の環境だと、simple_permissionを導入するとpodでエラーが発生するようになったため、ios/podfileの2行目を以下のように変更を入れる必要がありました。Issueにも上がってるみたいです。'10.0'use_frameworks!コードの追加AndroidであればWRITE_EXTERNAL_STORAGE、iOSであればPhotoLibraryへのアクセスについて、パーミッションの確認・要求を行う処理を追加します。準備終わったらbuildし直す。}これで、アプリケーションが起動して、setUpCameraが呼ばれるタイミングでパーミッションの要求が実行されるようになります。次は、許可が取れた領域に撮影した画像を保存する処理を追加していきます。モジュールがほとんどよしなにやってくれます。getApplicationDocumentsDirectoryで取得していたディレクトリを、getExternalStorageDirectoryで取得するように変更すればOKです。この際、WRITE_EXTERNAL_STORAGEのpermissionが取得できていない場合、保存に失敗するのでご注意ください。'$dirPath/${timestamp()}.jpg';iOSでの処理Androidで使用したgetExternalStorageDirectoryの関数は、残念ながらiOSでは使うことができません。モジュールを追加します。pub.dartlang.orgpubspec.yamlにimage_picker_saverを以下のように追加します。^0.1.0image_picker_saverは、保存したいバイト配列を渡すと、PhotoLibrary領域に画像を保存してくれる機能を持っています。いうことで、iOSでは、写真撮影した画像をtemporary領域に一時画像として保存し、image_picker_saverを使って、PhotoLibrary領域にコピーするといった流れで、撮影画像を保存していきます。}動作確認AndroidAndroidEmulatorで動作させるとこんな感じの動作画面です。画面下部に表示された撮影先ファイルパスもちゃんと外部領域になっています。miniで動作させました。Androidと同じく、撮影されたファイルパスがきちんとPhotoLibrary領域になっています。撮影された画像も写真アプリからちゃんと閲覧することができています。iOS動作イメージまとめコード量としては10行ちょっとの追加で、保存先を外部領域/PhotoLibrary領域に保存することができました。1.0.0が出たばっかりとはいえ、ライブラリ群がかなり準備されているおかげです。コードについても、Dartがそこまで癖がある言語ではないこともあり、コード補完で大体出来上がった感じでした。Podfileの変更や、AndroidManufest・Info.plistなど、各プラットフォームの開発経験がないと結構つまづきやすいところもあるので、その辺の知識はFlutter開発するにあたっても必須になるなと感じました。今回コードをワンソースで見れるっていう形で作ったこともありOSでの分岐がどうしても発生してしまいましたが、クラス・モジュール設計をきちんとやるとロジック側ではあまりOS感の違いを意識しない作りにすることも可能だと思います。プロダクションレベルではモジュールとして隠蔽できるようにした作りにするのがいいかと思います。書いたコード作ったプロジェクトについてはGithubにおいておきました。ここには書ききれなかったコードの細かい変更等はそちらでご確認いただけると幸いです。ツイートほねっとリンク開発したAndroidアプリたち検索はてなブログをはじめよう!afterciderさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。