web-dev-qa-db-ja.com

コンテナの端近くをドラッグするとパン

ドラッグ可能なオブジェクトがあり、パンもできるネイティブモバイルアプリのコンテナービューを実装しています。オブジェクトをドラッグするには、ユーザーがアクティブになるまで押し続け(強調表示してサイズを大きくする)、オブジェクトを移動します。ただし、タッチがビューのエッジに近づくと、コンテナーはドラッグ中にパンする必要があります。 3つの質問があります。

  1. ドラッグ中にパンニングコンテナのエッジにどれだけ近いところからパンが開始されますか?
  2. エッジからの距離はパン速度にどのように影響しますか(つまり、エッジに近づくとパンが速くなります)
  3. これらのしきい値は、ピクセルの観点から絶対的なものにするべきですか、それとも画面/コンテナのサイズに対して相対的なものにするべきですか?

私はいくつかのアドホックパラメータを考え出しましたが、それらは理想からかけ離れていると思います。

  • Edgeからコンテナサイズの10%でパンを開始します(たとえば、200ピクセル幅のコンテナの場合、左:20ピクセル/右:180ピクセル)。
  • 速度= 最大速度定数×(10%-距離)/ 10%

この問題のパラメータに関する調査はありましたか?

1
Kevin Borders

1.ユーザーに確認する

ユーザーがナビゲートしてドラッグする必要があるデータの大きさによっては、正しいと感じるものと不格好に感じるものとの間にすべての違いが生じる可能性があります。あなたが思いついたオフセットをテストする必要があります。私にとって速すぎるものはあなたにとって遅すぎるかもしれないので、おそらくユーザーに高度な設定の下でそれらをどこかに微調整させることもできます。

2.を使用 固定ピクセル 割合ではなく金額

カーソルがEdgeの近くにある場合のみ、自動スクロールを検討してください。

研究データは見つかりませんでしたが、さまざまなフレームワークを使用した経験から、20ピクセルが通常、パン前にチェックするデフォルトのサイズであることがわかります(別名自動スクロール)。 10%は使用しないでください。これは1ピクセルまたは100ピクセルを意味する可能性があり、ほとんどの場合、パンせずにすべてを移動して現在のビューに収めることができます。

また、2つの速度のみを検討します。カーソルがエッジの周囲20ピクセルのマージン内にあるときに発生する遅いものと、カーソルがページの外側にあるときの速いものです。 Microsoft Excelはこのように動作するようで、タイマーを使用して、ページの外にドラッグしている時間が長いほど、すべてが特定のポイントまで速くスクロールします。

3.可能な場合は自動スクロールを避けます

完全に表示されているコンテナにドラッグ可能なコンテンツを保持できない場合がありますが、これが本当に目標です。目に見える画面の外に不可避に表示されるコンテンツの処理は、提供する視覚的な手がかりに関係なく、一部のユーザーが見つけられない場合があります。

言い換えれば、

「切り捨てはコンテンツ戦略ではありません...」- Karen McGrane

1
DaveAlger