web-dev-qa-db-ja.com

アルファベット順にグループ化されたアイテムにページ番号を付ける方法は?

CRMで連絡先を参照するためのインターフェイスを作成中です。連絡先をアルファベット順に表示しています。そのようです:

A ------------------------------

アンドリューブログ

エイミー・ジョンソン

B ------------------------------

ボブ・マーリー

ビリー・ボブ

私の質問は次のとおりです。アルファベット順にグループ化されたリストにページネーションを追加する最良の方法は何ですか?誰もがこれで経験がありますか?

6
DaveE

複数の本を含む辞書で使用される手法は、単一の本の最初と最後のエントリーの文字をリストすることです。あなたの場合、それは限られた数のエントリーを持つ本ではなくページに翻訳されます。 enter image description here

名前リストに変換すると、次のようになります。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

l-tのボタンをもっと想像してみてください。1日の描画に費やしたくなかっただけです。

このモックアップでは、各文字の下に名前のリストがあり、1つのページから次のページに伸びる文字の特定のビューを選択しました(ページごとの文字ではなく、ページごとに特定の数のエントリを持つことを選択した場合)。文字ボタンに加えて、左側にfirstpreviousボタンをa-dnextlastの前に置くことができます。 t-z-の直後のボタン。

さらに良いのは、ページごとのエントリを番号ではなく完成したレターで制限することです。そのため、1つのレターが次のページに続くケースに対処する必要はありません。

ページはめ込みセクションでは、@ Kit Groseが明確なソリューションを提供します。

3
kontur

物理ディレクトリが行うのと同じ方法:

アンドリューブログ

エイミー・ジョンソン

B

ボブ・マーリー

ビリー・ボブ

改ページ

B (continued)

ブライアン・マギー

4
Kit Grose

無限スクロールを使用してページネーションを回避を試してみます。

リストがかなり長くなる可能性がある場合は、右側のクリック可能またはタップ可能なインデックスを使用して、目的のアイテムにアクセスするのが簡単になります。

grouped list with index

優れた検索バーは、非常に長いリストに役立ちます。 iOSまたはAndroidデバイスの連絡先はこれをうまく処理し、それらの概念はPCインターフェイスでも使用できます。

2
JohnGB

デフォルトでユーザー設定に保存される最初の名前と2番目の名前で最初の名前と最初の名前で2番目に並べ替える可能性があることを忘れないでください。デフォルトの並べ替えを変更したり、表示中に並べ替えのタイプを変更したりできます。

1
pierre lebailly