web-dev-qa-db-ja.com

タイムラインを移動する

タッチスクリーンアプリケーションでタイムラインバーの一連のコントロールを表示する必要があります。ユーザーは、タイムフレームの開始時と終了時にコントロールを移動することにより、タイムライン上の特定のタイムフレームを選択します。

これらのコントロールを使用する方法は2つあります。

  • ユーザーは固定位置を選​​択します-時間枠は移動しません。
  • ユーザーはフローティング位置を選択します-時間フレームが前進するため、「今」からの時間間隔は固定されたままになります。

現在、固定時間を示すために右向きの矢印と、「現在」または「現在」に相対的な時間を示すために下向きの矢印があります。

enter image description hereenter image description hereenter image description here

わかりやすいですか?それとももっと良い方法がありますか?

6
InnaS

ユーザーが必要とする情報ユーザーが制御したいものの一覧を見てみましょう。

彼らが知っておくべきこと:

  1. 今何時ですか
  2. ユーザーが選択できる時間範囲とその間隔
  3. 選択されている時間枠の長さ
  4. 選択したタイムフレームの開始と終了はいつですか

彼らが制御できるもの:

  1. 選択される時間
  2. 時間枠はいつ終了し、いつ始まりますか
  3. これらの時間の1つが「今」でなければならない場合

本当に必要なのは、1つのオプションを持つ1つのコントロールだけです。 mutli-range input を見て、1つの選択を「今」にスナップするオプションを使用しています。何らかの理由がない限り、選択についての同じ3ビットの情報(開始、終了、期間)をいつでも表示できます。

"This is oversimplified. You'd likely include that 4:45pm is "now" and include ticks on the range input with times."

これは単純化しすぎです。おそらく、午後4時45分が「現在」であり、時間とともに入力される範囲のティックを含めることになります。

1
invot

これはクライアントに受け入れられた私の解決策でした

  • 緑色の点は、測定を開始したときを示し、ユーザーはこの点から左に移動できません。
  • 赤い点でドロップし、下を見ると位置が固定されていることを示します
  • 青い矢印の付いたドロップは、位置が変動し、右に移動することを示します
  • 赤い三角形は現在の時間を示し、ユーザーはこのポイントから右に移動できません。
  • 2つのドロップ間の濃い灰色は、選択された時間枠を示します。 enter image description here

また、個別のビューを表示する次の画面にも同じデザインを使用しました。
このように見え、この質問の一部ではないプレーヤーが含まれています。

enter image description here

1
InnaS