はじめに
とあるアプリのデータ一覧表示において、「ドロップダウンの選択によりデータを動的に並び替える」という機能を実装したので、個人的な備忘録として残しておきます。また、よくある委任警告の回避方法や、効率的なデータ処理についても整理します。
実装
今回は、Qiitaの投稿データを「ページビュー数、いいね数、ストック数」の3つの選択肢から動的に並び替えます。
具体的には、Qiita(Dataverse)のデータを、ドロップダウンで選択された値に応じて page_views_count(ページビュー数)、likes_count(いいね数)、stocks_count(ストック数)で並び替えます。
ドロップダウンの設定
まずは、ドロップダウンを挿入して、Itemプロパティを ["ページビュー数","いいね数","ストック数"]
に設定します。 これにより、「ページビュー数、いいね数、ストック数」の3つをドロップダウンから選択できるようになります。
動的な並び替えギャラリーの設定
次に、ギャラリーを挿入して、Itemsプロパティに以下の式を設定します。この式では、ドロップダウンで選択された値に応じて、特定の列で並び替えたデータを取得します。
※必要に応じてギャラリー内に表示する内容(並び替えの列など)を設定してください。
Switch(
Dropdown1.Selected.Value,
"ページビュー数",
Sort(
Qiita,
page_views_count,
SortOrder.Descending
),
"いいね数",
Sort(
Qiita,
likes_count,
SortOrder.Descending
),
"ストック数",
Sort(
Qiita,
stocks_count,
SortOrder.Descending
)
/* "新たな条件", 新たなソート処理 */
)
委任警告の回避
先ほどの式はソート処理が重複しているためコードが簡潔でなく、また、ドロップダウンの選択肢を増やすときにソート処理全体を追加する必要があるため拡張性に乏しいです。
そこで、以下のようにソート処理の中にスイッチ処理を書くことでコードをすっきりさせることができます。新たな条件を追加する場合もスイッチの条件を書き換えるだけで済みます。
Sort(
Qiita,
Switch(
Dropdown1.Selected.Value,
"ページビュー数", page_views_count,
"いいね数", likes_count,
"ストック数", stocks_count
/* "新たな条件", 新たな列 */
),
SortOrder.Descending
)
しかし、この式をこのまま実装すると委任に関する警告が出ます。
そこで、一度データソースを変数に格納してから使用することでこの警告を回避することができます。
例えば、アプリの初期起動(AppオブジェクトのOnStartプロパティ)や画面の読み込み(ScreenオブジェクトのOnVisibleプロパティ)のタイミングで変数に格納する、またはそれぞれの処理タイミングで以下のようにWith関数を用いる方法などがあります。
With({キータ:Qiita},
Sort(
キータ,
Switch(
Dropdown2.Selected.Value,
"ページビュー数", page_views_count,
"いいね数", likes_count,
"ストック数", stocks_count
/* "新たな条件", 新たな列 */
),
SortOrder.Descending
)
)
効率的なデータ整理
データが時系列で変化せず、一度アプリでデータをロードした後にその内容が更新されない場合は、事前に並び替えしたデータを保持しておく方法が効果的です。これにより、ドロップダウンを切り替えるたびにデータを並び替える必要がなくなり、操作のレスポンスが向上します。
具体的には、AppオブジェクトのOnStartプロパティに以下の式を書くことで、初期起動のタイミングでデータを定義、保持することが可能です。
ClearCollect(
colページビュー数,
Sort(
Qiita,
page_views_count,
SortOrder.Descending
)
);
ClearCollect(
colいいね数,
Sort(
Qiita,
likes_count,
SortOrder.Descending
)
);
ClearCollect(
colストック数,
Sort(
Qiita,
stocks_count,
SortOrder.Descending
)
)
ギャラリーのItemsプロパティでは、スイッチ処理の条件に合わせて保持している並び替えたデータを切り替えるよう設定します。
Switch(
Dropdown1.Selected.Value,
"ページビュー数", colページビュー数,
"いいね数", colいいね数,
"ストック数", colストック数
)
おわりに
今回は、ドロップダウンでデータを動的に並び替える方法と、関連するちょっとしたテクニックについて紹介しました。この記事は並び替えをベースとしたためSort関数を用いた実装となりますが、もちろん動的な絞り込み、Filter関数を用いた実装などにも応用できるので、ぜひ参考にしてみてください。この記事が皆さんの問題解決に繋がればうれしいです。