Flutter: image_pickerで読み込んだ画像が、撮影した向きどおりに表示されない

結論:RotatedBoxクラスで回転させて回避する
2021/11/20 Flutter エラー・バグ日記
image_pickerでカメラ撮影した画像を、画面に表示する処理を作っているが、横向きで撮影しても縦向きで表示されてしまう状況に遭遇した。
調べてみると、こちらに対処法のスレッドがあった。
readAsBytesメソッドでUint8List型に変換した後、decodeImageメソッドでImage型に変換し、それをbakeOrientationメソッドにかけると、画像が「EXIF:Exchangeable Image File Format」データを持っていれば、その中にある向きのデータを見て、適切な向きに修正したImage型を生成してくれる、という方法らしい。
さっそく試すと、確かにできた。が、、、カメラ撮影してから画面に表示されるまでに異常に時間がかかるようになってしまった。。。
その他にも方法があるようだが、画像データそのものを直しにかかると処理に時間がかかりそうなので、表示するときにユーザーが回転ボタンをタップして調整できるようにする方針に変更。
調べると、こちらの記事にとてもありがたい情報が。
RotatedBoxクラスで表示部分をラップして、quarterTurnsプロパティをセットすればよいらしい。
ただ、quarterTurnsに「90」と入れたら、90度ではなく180度回転してしまった。
F4でソースコードを調べると、どうやらquarterTurnsには、90度ずつ何回回転させるか、の回数(int型)を指定するらしい。
つまり、0、1、2、3の4通りを設定すればよい。
結果、無事、思い通りの実装ができた。
上記情報をアップいただいた皆様、ありがとうございましたm(_ _)m
\一般的なエラー対処法をまとめた記事はこちら/
リリースしたアプリ(全てFlutterで開発)
暗記用マーカー - シンプル穴埋め問題作成
超即ToDo –最短2タップで通知登録できるタスク管理アプリ
かんたんプリント管理:アラート・OCR文字認識・検索機能を搭載
シンプルメモ帳「BasicMemo」 - 文字カウント、ワンタッチ入力、タグ管理等の機能を搭載
Macのデスクトップ版もリリースしました。
個人アプリ開発で役立ったもの
おすすめの学習教材
\超初心者向けでオススメな元Udemyの講座/
\Gitの基礎について無料で学べる/
おすすめの学習書籍
\実用的。image_pickerに関してかなり助けられた/
\Dartの基礎文法を素早くインプットできる/
Dart入門 - Dartの要点をつかむためのクイックツアー
おすすめのソフトウェア
\安くて高機能。アプリの独自ドメイン・紹介サイト構築に最適/
\アイコン作成・画面設計・クラウド保存...何でもできて超必須/
おすすめのハードウェア
\リーズナブルな価格で検証端末を確保できる/
\目線の高さを調節しやすく、疲れにくい/
\キータッチが超静音で心地よい/
おすすめのサポートアイテム
\部屋の中を仕切って、集中できる開発環境を作れる/
\部屋の中でも大き過ぎず、長時間座っても疲れない/
\バグと格闘した後の肩こりを解消してくれる/