リストUI
あるある出てくる気にするポイント
リストの内容物の幅の指定
例えば、注文一覧リストのリスト内に
顧客名
ステータス名
合計金額
担当者
といったものを表示する際に、
例えば、顧客名が長かったり短かったりしたときに、
その範囲が可変になっていると、
ガタつく
整列が終わる
幅を固定するのが良い？
max widthなどを指定しても同じ問題は起きるので
固定した幅を超えたときの表示も考えないといけなくなる
省略するのか、改行するのか、何なのか
https://gyazo.com/fbeaa4cd4b197883fd83b145595aa68f
Gyazoの画像ロック.icon
パターンの例 ref
表(テーブル)形式のUI
柔軟なソートや絞り込みが可能
その場での編集が得意
https://baigie.me/officialblog/2020/06/16/ui_design_for_admin_screen/#:~:text=と考えます%E3%80%82-,17%EF%BC%9Aテーブル内の情報を見やすくする,-管理画面の
グリッド
ビジュアル要素がメインな場合
リスト
順番が重要な場合
ビジュアル要素もテキスト要素もまとめやすい
Card
/mrsekut-book-4297113511/115 (コレクションビューの表示形式のパターン)
1項目1行の1次元リスト
1項目複数行の1次元リスト
1項目複数行の1次元リスト(高さ可変)
サムネールのグリッド
マッピング
/mrsekut-book-4297113511/123 (コレクションフィルタリングのパターン)
キーワード検索
グループ
AND条件
クエリビルダー
複数個のセレクトボックスがある感じのやつ
ソート
ものを並べて表示するUIを作る
https://developer.apple.com/jp/design/human-interface-guidelines/lists-and-tables
https://gyazo.com/074d3787d50f88d60f3cf01e38e3fd2f
HIG
#??
リストの中のコンテンツの配置方法がわからない
ref ものを並べて表示するUIを作る
#UIのカタログ