はじめに
MAUI で大量のデータを表示する場合、どのような方法が良いのかの個人的なメモです。UI フレームワークは Radzen を使っています。
本題
- DB などの多数の列項目がある行を、縦一列に整然と並べたい場合
- 横幅のあるコンポーネントを縦一列に整然と並べたい場合
- カード形式などの小さなコンポーネントを画面に敷き詰めたい場合
DB などの多数の列項目がある行を、縦一列に整然と並べたい場合
DataGrid がオススメです。
DataList よりも圧倒的に多様なカスタマイズができます。
Page にするか Virtualization にするかはお好みですが、Page を DataGrid の下に表示する場合は、最終ページで行が少なくなると Page もそれに応じて縦位置が変わってしまうので、それを避ける場合は Page の位置を Top にすると良いと思います。
ちなみに Page の場合は DataGrid の Height を指定しても適用されませんでした。
横幅のあるコンポーネントを縦一列に整然と並べたい場合
DataGrid or DataList のどちらでも良いと思います。
ただヘッダーがない分、DataList の方が余分なスペースを抑えることができます。
DataList も Page にするか Virtualization はお好みですが、DataGrid 同様に、Page の位置が最終ページで変わってしまうので、回避する場合は Page 位置を Top にする必要があります。
やはり、Page の場合は DataList の Height を指定しても適用されませんでした。
カード形式などの小さなコンポーネントを画面に敷き詰めたい場合
DataList と Pager コンポーネントの両方を使います。
DataList の Page と Virtualization はどちらもオフにして、Pager を利用して、１ページ分のデータのみを注入するようにします。
Radzen の DataGrid や DataList は、おそらく内部的に Razor の Virtualize コンポーネントを使っていると思われるのですが、Virtualize は 縦一列の配置しか対応していないようです。
詳細は下記に。
