質問: グリッドで、手動で行を並べ替える方法は? ユーザーがグリッドで要素を並べ替えられるようにしたい-列で自動並べ替えを行わない。最初の要素、次の要素などを選択します。私は考え、ケースに応じて機能するかもしれないいくつかの解決策を見ました: ドラッグアンドドロップ:セクシーですが、スクロールやページングのある長いグリッドでは機能しません。もう1つの欠点は、それが見えないことです。この機能が利用できることさえ知らないかもしれません。最後に、ある程度の器用さが必要です。ただし、一度に複数の要素を移動するために使用できます。 上/下矢印:理解しやすく、小さな移動にも使いやすいですが、最初の要素で最後の要素を移動する必要がある場合は退屈です。また、要素を数ステップ移動するときは、1回移動するたびにその矢印をキャッチする必要があります。一度に1つの要素でのみ機能します。 インデックス列:ユーザーは要素の位置を示す数値を入力します。ユーザーが希望する絶対位置を知っている場合に役立ちます。既存の番号を入力するとどうなるか推測が難しい。一度に1つの要素でのみ機能します。 インデックス列+ドラッグアンドドロップのようなこれら2つの手法を組み合わせたくなりますが、両方の利点を得るのではなく、両方の欠点を累積することを恐れています。動作することが証明されている並べ替え手法は何ですか?
回答: netflixは、キューに3つのメソッドを組み合わせています。ドラッグアンドドロップするだけでなく、特定の行番号を指定するか、クリックして最上部に移動することもできます。彼らのアプローチについて私が興味深いと思うのは、ユーザーが選択してページの上部のどこかをクリックする必要があるのではなく、「行」の上部にある緑色の円のアイコンを各行に配置したことです。ほとんどのwebアプリはそのようなアイコンやボタンを配置します。あなたの場合、私はドラッグアンドドロップを使用しますが、すべての行に歯車のアイコンを配置します。これにより、いくつかのアクションが許可されます。 ユーザーは1つ以上の行をドラッグアンドドロップできます ユーザーは複数の行を選択し、歯車アイコンをクリックしてメニューをドロップダウンし、任意の数のことを実行できます。選択範囲を上または下に移動、指定した行数を上下に移動(この場合、小さなダイアログが表示されます)、コピー、切り取りなど。実質的に制限なし。