本ドキュメントでは,MiniTIAS アプリの画面設計・画面遷移・各画面の UI と動作・パーミッションを定義する.
| ID | 画面名 | 概要 |
|---|---|---|
| S-01 | 撮影画面 | インカメラのライブプレビューを表示し,撮影を行う |
| S-02 | 一覧画面 | 撮影済み画像のサムネイル一覧を表示し,確認・削除を行う |
※ 初期バージョンでは 2 画面構成とする.
[アプリ起動]
│
▼
┌──────────┐ BottomNavigationBar ┌──────────┐
│ S-01 │ ◄──────────────────────────────► │ S-02 │
│ 撮影画面 │ タブ切り替え │ 一覧画面 │
└──────────┘ └──────────┘
│
│ サムネイルタップ
▼
┌──────────┐
│ 詳細表示 │
│(インライン) │
└──────────┘
home_screen.dart の BottomNavigationBar を使用する(タブ 2 つ: 撮影 / 一覧)Stack オーバーレイで実装し,独立画面・ダイアログとしないアプリ全体を app.dart の MaterialApp ごと Transform.rotate(angle: pi) で 180° 回転する.これにより画面・ダイアログ・スナックバー等すべての UI が自動的に回転されるため,個々のウィジェットで回転を意識する必要がない.以下はコード上の配置順(回転前)を示す.操作者が逆さに置いた端末を見ると,上下が反転して表示される.
操作者の視点(回転後) コード上の配置(回転前) ┌─────────────────────┐ ┌─────────────────────┐ │ (黒い空白) │ │ BottomNavBar │ │ アタッチメントで隠れる │ │ 明るさスライダー │ ├─────────────────────┤ │ │ │ │ │ カメラプレビュー │ │ カメラプレビュー │ │ (中央クロップ) │ │ (中央クロップ) │ │ │ │ │ ├─────────────────────┤ │ 明るさスライダー │ │ (黒い空白) │ │ BottomNavBar │ │ アタッチメントで隠れる │ └─────────────────────┘ └─────────────────────┘
※ アタッチメント(SmTIAS)により画面の約 1/3 が隠れるため,その領域は黒い空白とし,UI 要素は見える領域に配置する.
| 要素 | 仕様 |
|---|---|
| カメラプレビュー | インカメラのライブ映像.鏡像(左右反転)+上下反転で表示.画面いっぱいに拡大し中央をクロップ |
| シャッターボタン | 丸型ボタン(画面下部中央).タップで撮影実行.連続撮影可 |
| タイマーボタン | 画面左下に配置.ON(黄色)/ OFF(グレー)を切り替える.ON 時はシャッター押下後 3 秒のカウントダウン表示の後に撮影 |
| サウンドボタン | 画面右下に配置.シャッター音・保存完了音の ON(黄色)/ OFF(グレー)を切り替える.設定は次回起動時も保持(shared_preferences) |
| 明るさスライダー | ナビバーの直下に配置.画面の輝度を手動で調整する(デフォルト: 0.8.詳細は SPEC_03 非機能要件) |
| BottomNavigationBar | 撮影タブ(アクティブ)/ 一覧タブ.背景色は黒系で統一.保存中はタップ無効 |
startImageStream)から最新フレームを保持し,撮影開始時に Android ネイティブの YuvImage.compressToJpeg() で JPEG 変換して表示する(オーバーレイなし・瞬時)撮影の内部処理(Camera2 マニュアル制御・撮影フロー・保存ファイル)は SPEC_02 カメラ撮影仕様書 を参照.
┌─────────────────────────┐ │ BottomNavBar │ ├─────────────────────────┤ │ ┌─────┐ ┌─────┐ ┌─────┐│ │ │ │ │ │ │ ││ │ │ img │ │ img │ │ img ││ │ │ │ │ │ │ ││ │ └─────┘ └─────┘ └─────┘│ │ ┌─────┐ ┌─────┐ ┌─────┐│ │ │ │ │ │ │ ││ │ │ img │ │ img │ │ img ││ │ │ │ │ │ │ ││ │ └─────┘ └─────┘ └─────┘│ │ ... │ ├─────────────────────────┤ │ [画面上部エリア] │ ← 逆さ配置のため上部が操作側 └─────────────────────────┘
※ 撮影画面と同様に UI 全体を 180° 回転して表示する.
| 要素 | 仕様 |
|---|---|
| サムネイルグリッド | 3 列のグリッド表示.新しい画像が先頭(降順) |
| サムネイル | 正方形クロップ.タップで拡大表示 |
| ファイル名ラベル | 各サムネイル下部にファイル名を表示 |
| BottomNavigationBar | 撮影タブ / 一覧タブ(アクティブ) |
| 要素 | 仕様 |
|---|---|
| 画像 | 一覧画面エリアを全面に覆うオーバーレイで表示.カメラプレビューと同様に上下をクロップして全面表示(BoxFit.cover).ピンチ操作でズーム可能 |
| ファイル名 | オーバーレイ上部に半透明背景とともに表示 |
| 削除ボタン | オーバーレイ下部に半透明背景とともに配置.タップで削除確認ダイアログを表示 |
| 閉じるボタン | ヘッダー右端の × ボタンで閉じる |
Pictures/MiniTIAS/ 内のプレビュー JPEG(.preview.jpg)と旧通常モードの .png を走査し,一覧を構築する(DNG 本体は一覧では直接表示しない)| パーミッション | 用途 | 対象 API レベル |
|---|---|---|
CAMERA | カメラプレビュー・撮影 | 全バージョン |
WRITE_EXTERNAL_STORAGE | 画像保存 | API 28 以下 |
READ_EXTERNAL_STORAGE | 画像一覧取得 | API 28 以下 |
READ_MEDIA_IMAGES | 画像一覧取得 | API 33 以上 |
※ API 29〜32 では Scoped Storage により,アプリが MediaStore 経由で保存したファイルは追加権限なしでアクセス可能.
アプリ起動
│
▼
カメラ権限を確認
│
├── 許可済み → カメラプレビュー開始
│
└── 未許可 → 権限リクエストダイアログ表示
│
├── 許可 → カメラプレビュー開始
│
└── 拒否 → 「カメラの権限が必要です」メッセージ表示
+ 設定画面への誘導ボタン
permission_handler パッケージを使用する