2008-04-22-03-【Scrooge】UI 設計 - 3
>> Site top >> weblog >> 月別アーカイブ >> 2008年04月のlog >> 2008-04-22-03-【Scrooge】UI 設計 - 3
最終更新日付：2013/12/31 07:36:58
【Scrooge】UI 設計 - 3
2008 年 04 月 22 日
さて、UI 設計の続き。
ひとまずのところ、テーブルを使ってみることにしよう。テーブルのインプレは非常に面倒なのだが、やらないわけにもいかない。以前の画面イメージとテーブル部分の要件をもう一度見直してみよう。
- 価格が安い順に表示される。価格が入力されていないものは最後に表示される。
- 価格部分をタップすると価格を編集できる。価格の変更により順位付けが変わると、リストは再描画される。
- 左端の店舗名または商品名をタップすると、ビューが切り換わってタップしたものが選択状態となる。
- 画面右端の列は割引イベントなどを含む詳細情報の有無や状態を示すアイコンである。タップすると詳細画面（モーダルフォーム）が表示される。これによっても表示順が変更される場合がある。
テーブルでできるような気がしてきた。唯一心配なのは３カラム目をタップしても何もすべきことがない点だが、そこはそういうものということにしておこう。
ちなみに、価格や割引きイベントの編集は、全て別途用意するモーダルフォームを使用する。というのは、例えば価格をインプレイスで編集させてしまうと、入力が完了した瞬間に再ソートが発生するため、混乱の元になりそうだからだ。
もうひとつ気付いたこととして、価格タップ時の編集対象と割引イベントの関係が問題になりそうだ。例えば 200円の商品が割引きイベント設定によって 180円になっている時、価格部分をタップしたら編集すべき値はどちらなのだろう？ 編集前の値を表示せずに入力ボックスを表示したとしても、入力させる金額は割引き前の金額だろうか、それとも割引きが適用された後の金額だろうか？
ひとつの解決法は、割引きイベントが設定されているレコードに関しては、価格部分のタップと右端のアイコンのタップを同じものとして扱うというものだ。そして表示するモーダルダイアログでは明確に「割引き前の価格」を入力させる。この場合は割引きの条件や率なども同時に編集できるような画面になっているから、混乱させることはないだろう。
．．．続きは明日以降。
コメント
このページのタグ
Page tag : Palm
Copyright(C) 2005-2018 project-enigma.
Generated by CL-PREFAB.
