画像系のアプリを作ろうと思ったら、端末の画像を読み取ったり保存したい。
出来たらExpoで完結したいので色々方法を調べてみた。
制限に沿わない場合はワークフロー見つつBareに切り替えることも考える。
React Native 0.60 Expo v34
Expo SDK
Expo SDKを使って画像取得、保存ができます。
カメラロール、カメラから画像を取得
🔗https://docs.expo.io/versions/v34.0.0/sdk/imagepicker/
読み込みやカメラ起動から画像取得はこれでサクッと出来ます。
ファイルシステム（ファイル読み込み、保存、ダウンロード）
🔗https://docs.expo.io/versions/v34.0.0/sdk/filesystem/
ディレクトリ参照はFileSystem.documentDirectory、FileSystem.cacheDirectoryがあります。
これをAndroidで見たところ、file:///data/user/0/host.exp.exponent/[files,cache]/ExperienceData/@account/projectnameでした。そこに保存してもなぁ。
メディアライブラリ
🔗https://docs.expo.io/versions/v34.0.0/sdk/media-library/
画像、動画、音楽、その他の取得、保存、削除などができる。
Androidで試したところcreateAssetAsync()でDCIM直下、createAlbumAsync()でストレージ直下の指定フォルダに保存できた。
React Native
🔗https://facebook.github.io/react-native/docs/cameraroll
saveToCameraRoll()で画像、動画の保存ができる。
これもAndroidでDCIM直下に保存された。
React Native Plugin
色々あるプラグインを探して使ったり自分で作ったりもできます。
🔗https://github.com/itinance/react-native-fs
このプラグインはCordovaで出来たことは大体できそう。
こんな感じで使い方にリンクを張る手順があるのものはExpoでは管理されないため素のReact Nativeに変換してから使わなくてはいけません。
|
1 2 |
yarn add react-native-xxxx react-native link react-native-xxxx |
ただExpo managedでなくなるので、そこからは自分で管理する部分が増えます。
expo ejectでExpoKit(Expo API込みReact Native)かBare(React Native)にします。
調べてるとdetachというのも出てきますが同じもののようです。
所感
取得はimagepiker、保存はmedia-libraryで事足りそう。
自分で処理作ってscanしたりしないでいいのは本当に楽です。
保存場所は限られるのでこだわりたい場合にはejectも必要か。
特に外付けメディアへの入出力なんかはリクエストにもあるけど望み薄そう。
リクエスト：外部ストレージAPI、メディアライブラリのSDカードアクセス
camerarollは機能一覧になかったから見つけにくかった。なんでだ。
他にもこういうのがあるなら見逃しがあるかもしれません。