web-dev-qa-db-ja.com

スマートフォンアプリで行列の行と列に追加/削除機能を提供する最良の方法

Android=の行列計算機を構築しています。スマートフォンの画面のスペースが限られているため、直感的なグラフィカルユーザーインターフェースの設計が困難です。

画面の上部30%はプレビューバーで占められ、下部10%はコントロールパネル(元に戻す、やり直し、エクスポートなど)で占められており、画面の中央60%がデータ入力用になっています。領域をスワイプ可能にしました。ユーザーは一度に1つのマトリックスグリッドを操作するだけで済みます。その後、左にスワイプしてデータを次のデータに追加できます(いつでも戻って変更を加えることができます)。

General GUI framework

私が直面している問題は、現在の行列の行と列を追加/削除するエレガントな方法を提供することです。スコープ内の行列は長方形であり、各行と列の制御を必要としません。

  • マトリックスの上部(行の追加)、下部(行の削除)、左(列の追加)、右(列の削除)にあるボタンシステムを検討しました。
  • ユーザーがボタンシステムと同様の方法で行と列を追加/削除するために、ユーザーが上、下、左、または右にスワイプするスワイプ可能な領域。しかし、私はすでにマトリックス間を移動するためにスワイプに依存しています(ただし、スワイプリスナーを分離できます)
  • そして、すべての追加/削除ボタンが含まれているマトリックスの左、右、または下へのコントロールパネル。これの問題は「自然な」ものではなく、偶発的なタップを引き起こす可能性があるようです。

コントロールの要件の1つは、すべてのマトリックスに固有である必要があることです。したがって、ナビゲーションドロワーなどのコンポーネントは問題外です。

特に、次のような他のコンポーネントもマトリックスの周囲に存在するため、コンポーネントを合わせるスペースは非常に限られています。

  • マトリックスの記号-タップすると+と-が交互に表示されるボタン
  • スカラー乗数-シンプルなテキストボックス
  • 行列間の演算子-+、-、*、/記号を交互に切り替えるボタン
  • ワンタップ機能(逆、転置など)を提供するドロップダウンリスト
  • そして、方程式にさらに行列を追加するためのボタン

これがこの質問に適切な場所かどうかはわかりませんが、私が見つけることができる最高の場所です。どんな助け/アドバイスでも大歓迎です。

EDIT-コンテキストを追加するためのサンプルユーザーストーリー

ユーザーは方程式の結果を見つけたい Sample Matrix Equation]

  • ユーザーは必要に応じてグリッドに行/列を追加し、マトリックスに必要なサイズを取得します
  • ユーザーは最初の行列を入力し、スカラー乗数3を追加します
  • ユーザーは左にスワイプして2番目のマトリックスを追加します
  • ユーザーはsignボタンをタップしてマトリックスを負にします
  • ユーザーがドロップダウンリストをタップし、Transposeを選択して、行列を直ちに転置します。
  • 最後に、Calculateボタンをタップして結果を受け取ります
4
Paras

enter image description here

あなたにぴったりのアイコン...

これは私が使用している表計算プログラムからのものです...
enter image description hereenter image description here
左は実際のサイズです。
それらを1つに結合すると、次のようなものになります... enter image description here

ここは青色です
enter image description here

そうすれば、フローティング「アクション」ボタンとトレイボタンに使用できるアイデアです。
幸運を。

1

あなたが達成/提供しようとしているすべての機能を完全に理解しているわけではありませんが、すべてのオプションが常に表示されます。アプリにコンポーネント/機能を追加する方法はいくつかありますが、wherehowを追加する方法は、 :

  • 各コンポーネントの使用頻度
  • 常に表示される必要があるコンテキスト/情報を提供するかどうか
  • 論理的にグループ化する意味のあるコンポーネント
  • 機能するために複数の入力ポイントを必要とするアクション

コンポーネントごとにこれらの点を考慮しながら、画面にコンポーネントを追加するための次のオプションがあります。

ペインをスライドアウト

スライドアウトペインはかなり一般的です。ほとんどのユーザーは、アプリケーションをナビゲートする方法としてそれらに精通していますが、コンポーネント/設定にも役立ちます。

UIが現在の「状態」に変換されるさまざまな「状態」

たとえば、ユーザーが[行を追加]をタップすると、残りのコンポーネントを覆うモーダルオーバーレイでグリッドが呼び出されます。呼び出されたグリッドでタップされた次の行には、その上に行が追加されています。その後、状態が解除され、モーダルオーバーレイが消えます。 (これは、コントロールバーのグループ化されたコントロールを切り替えるためにも使用できます)

スクロール可能なコントロールパネル

画面の下部10%の「コントロールパネル」部分。収まらないコンポーネントがfew多い場合は、水平方向にスクロール可能にします。 Androidはすでにオン/オフ設定でこれをネイティブに行っています。

スライドペインの例

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

あなたの質問に正確に答えていなかったと思いますが、これで麺をかき混ぜるのに十分な情報が得られることを願っています。何かを拡張する必要がある場合、または追加の説明が必要な場合は、お知らせください。

「状態」の例

mockup

bmmlソースをダウンロード

1
Daniel Brown