入力コントロールを備えたレンジスライダーのモバイルフレンドリーなソリューションは何でしょうか？
2つの入力コントロールを備えたレンジスライダーがあり、それぞれに高低ボタンがあります。ユーザーは、スライド（高速だが正確ではない）、入力への入力（平均速度、非常に正確）、および高い/低いボタンでのステップ（非常に正確だが遅い）によって、入力を行うことができるはずです。現在の範囲を示すラベルも必要です。
したがって、このための私のデザインは次の画像のようになります。
これに関する私の問題は、レスポンシブ（タッチ対応）のWebレイアウトを考慮する必要があることです。私は、モバイルデバイスでユーザーに要素を提示するための最良の方法が何であるかわかりません。スライダーの上の入力コントロールの幅はそれぞれ約150pxであるため、同じ行に配置すると見栄えがよくありません。また、ここで何を変更するのかをユーザーに知らせるためのラベルも必要です。そしておそらく将来的にはsthがあるでしょう。値の単位を選択するドロップダウンのように。
私はコントロールを互いに積み重ねることを考えましたが、結果はあまり楽しいものではありません。私はあなたがいくつかのより良いアイデアを持っていると思います;）
2つの入力コントロールを非表示にして、ユーザーtapsが極端な場合にのみ表示できます。
ユーザーはドラッグ極値を実行できる必要があります。これには現在の値も含まれる場合があります。
複雑さを下限と上限に分割し、必要に応じて2つの間の差を有効にできます。
下限を上限より大きくすると、上限が自動的に切り替わり、上限を下限より小さくすると、下限が自動的に切り下げられます。
ユーザーが手動で「差異」を入力した場合、値のシャントにより、可能な場合はその差異を維持できます。
最後に下限を調整した場合、差を入力すると上限が優先順位として調整されます。
最後に上限を調整した場合、差を入力すると下限が優先的に調整されます。
あるいは、より対称的なレイアウト...しかし、手/指が価値の邪魔になると、あまり良くありません！
