web-dev-qa-db-ja.com

スマートフォンで重いデータテーブルを提示する方法は?

問題:10列で最大100行のテーブルがあります。これらを小さな画面に表示する最良の方法は何ですか?私のアイデア:効果的な検索+行ごとに表示されるデータ。より良い解決策はありますか?

10
Csongor Fabian

私は以前にこの問題を何度か経験しましたが、上記の推奨事項は別として、列の数を属性のみに制限することもできますユーザーが情報に基づいて行間の比較を行うために不可欠です。次に、すべての情報を含むカードなどに各行をリンクします。

ユーザーがすべての属性を表示する必要がある場合は、これを無視してください。

5
colmcq

私が使用した2つのソリューションは カードビュー で、行と列を入れ替えて、iPhoneのようにデフォルトの方向が垂直である場合、2列で10列を表示します。どちらの場合も、各画面には元のテーブルの「行」が1つだけ表示されます。

さらに、効果的な検索や、iPhoneの連絡先リストのようなスマートスクロールバーを使用して、画面から指を離す前にグループを表示して、これを強化できます。もちろん、グループ化が明確で、データがそれをサポートしている場合にのみ可能です。

3

ユーザーがデータをどのように処理する必要があるかを知ることが重要だと思います。行間の比較は最も重要ですか?それとも、レコードごとのビューですか?

小さな画面で表示する場合に重要と思われるもの:

  • データを適切にソートし、カスタマイズを容易にします(そのため、最も関連性の高い行が最初に表示されます)
  • レコードからレコードへの良好なナビゲーション。選択した順序に基づいて「次の」ナビゲーションを許可する
  • 比較ビューでは、重要な列を互いに近づけることができるようにする必要があるため、列をビューでロックするか、列を並べ替えたり非表示にして、水平スクロールを最小限に抑えることができます。
3
Inca

このソリューションは非常に優れています http://jsbin.com/apane6/14/ デスクトップでこれを見てから電話で

1
Jitendra Vyas