テーブルへのページング、並べ替え、およびフィルタリングツールバーの追加

Question

基本的にテーブルであるレポートビューがたくさんあります。これらは、ユーザーがソート、ページング、およびフィルタリング機能を使用できるようにする必要があります。

私の考えは、メニューバーを介してそれらの機能を追加することです。

ページングは​​一番下に行きます：

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

並べ替えとフィルタリングが最優先されます。

ただし、ページングが必要かどうかは開始時に決定されるため、表示は異なりますが、フィルタリングとソートはオプションです。

すべてが必要な場合、それは次のようになります。

^{bmmlソースをダウンロード}

複数の列で並べ替えられており、多数のエキスパートフィルターがあります。

問題は、可視性をどのように処理する必要があるかです。必要のないGUI要素を毎回表示したくないだけでなく、ユーザーに見逃してほしくない。

たぶん、私のメニューバーのアイデアは全然良くないので、外部ダイアログか何かを使うべきです。

Answer 1

私が見た中でこれの最も良い実装はOkCupidからです。一致を検索する場合、（[詳細設定]タブを介して）追加できるフィルターがいくつかあり、これらは選択したときにのみ表示されます。

下の2つは高度なフィルターの例で、「x」を選択すると削除できます。

これは数百万人のユーザーで試され、テストされており、柔軟性があり、使いやすいことが証明されています。彼らのフィルタリングをモデリングすることをお勧めします。ただし、「詳細」タブを「フィルターの追加」などに変更することを検討します。

Answer 2

あなたの解決策は良いです。

ページングが常に表示されていると想定しています（コンテンツが1ページ未満の場合を除く）

他の要素を非表示にする場合：Sorting、Filter必要に応じて、インラインで展開して上記のGUIを表示する2つのクリック可能なボタン/リンクをテーブルの上部に配置します。それだけです。非常にシンプルで、これで完了です。例えば.

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

重要なことは、対応するUI要素を非表示にする場合は、機能が存在することを示す要素を持つことです。

並べ替えについては、混乱を招くため、個別のインターフェイスを提供するのではなく、規則、つまり列のタイトルを使用します。モックアップには、並べ替え指示矢印と並べ替えバーがあります。ただし、ヘッダーの並べ替えができない場合は、メニューバーのアイデアは問題ありません。