#はじめに
データから自動生成したアプリでは、Gallery（一覧表示）に表示するレコードの数は、登録すればするほど増えていきます。
DateAdd などの日付関数を用いて「過去30日分」のようにフィルタリングすることもできますが（弊社の残業申請アプリはそのようにしています）、用途によっては過去に遡って確認をしたいケースもあるかと思います。
そんな時に Gallery を沢山スクロールするのは大変なので、ここでは Gallery の表示を月単位で表示させる簡単な方法についてご紹介します。
#用いるデータ
我が家の家計簿のデータを抜き出してきました（笑）
データは SharePoint リストに置いています。
今回ポイントになるのは、日付列である purchaseday です。
| 用途 | 列名 | 型 |
|---|---|---|
| 購入日 | purchaseday | 日付 |
| カテゴリ | category | 1行テキスト |
| 金額 | price | 数値 |
#月単位で表示させる方法
今回はここからスタートします。
データから自動生成したものについて、Gallery の中身の表示をちょっと変更し、Gallery の上にあった検索ボックスと検索アイコンを非表示にしただけです。
##月表示ラベルと月切り替えアイコンを置く
空いているところ（検索アイコン等があった場所）に、現在の月を表すラベルと、月を切り替えるアイコンを配置します。
ラベルは中央揃えにしておくとよいかもです。
- ラベル：LabelCurrentMonth
- 左アイコン：IconPrevMonth
- 右アイコン：IconNextMonth
##アプリ起動時に「今月の1日」を変数に格納する
App の OnStart で、今月1日の日時情報を変数 "varFirstDayOfMonth" に格納します。
「今月１日」は、「今日の日付から、今日の日の数字分だけ日にちを減算し、1を足す」ことで定義できます。
（例：7/4の場合は、そこから日の部分である4日を減算し（6/30になる）、そこに1日足すと7/1になる）
Set(varFirstDayOfMonth, DateAdd(Today(), -Day(Today())+1, Days))
記載したら、OnStart を実行しておきます。
定義した変数 "varFirstDayOfMonth" は、ラベル "LabelCurrentMonth" で表示しておきしょう。
##"左"、"右" アイコンをクリックしたら変数をそれぞれ前月1日、翌月1日にする
OnStart で利用した方法を応用して、左右のアイコンをクリックした時に変数 "varFirstDayOfMonth" をそれぞれ前月1日、翌月1日になるよう更新します。
"左"アイコン
Set(varFirstDayOfMonth, DateAdd(varFirstDayOfMonth, -1, Months))
※なお、ここでなぜか変数 "varFirstDayOfMonth" が値なし状態になり、ラベルの表示がなくなりますが、気にせず進みます。
"右"アイコン
Set(varFirstDayOfMonth, DateAdd(varFirstDayOfMonth, 1, Months))
ここまで終わったら、再度 App の OnStart を実行しておきます。
左右アイコンをクリックしてラベルの日付が月単位で切り替わることを確認したら、ラベルの表示を年月のみに変えておきましょう。
Text(varFirstDayOfMonth, "yyyy年mm月")
##変数を用いて Gallery をフィルタリングする
最後に、定義した変数 "varFirstDayOfMonth" を用いて、Gallery の表示を月単位にします。
Gallery の Items を以下に書き換えます。
日付列である purchaseday の範囲を、
変数 "varFirstDayOfMonth" 以上（つまり、今月1日以上） かつ
変数 "varFirstDayOfMonth" に1ヶ月加算した日付未満（つまり、来月1日未満）
とすることで、指定した月の分のみを表示させることができます。
SortByColumns(
Filter(
[@'家計簿-メイン'],
purchaseday >= varFirstDayOfMonth,
purchaseday < DateAdd(varFirstDayOfMonth, 1, Months)
),
"purchaseday",
If(
SortDescending1,
Descending,
Ascending
)
)
#完成！
これで、左右アイコンをクリックする度に Gallery の表示範囲を月単位で切り替えることができます。
これを応用すれば、年単位や日単位での実装も可能です。
色々なシーンで利用できる機能かと思いますので、是非お試しください。
欲しいアプリは欲しい人が作り、欲しいデータは欲しい人が集める時代へ。
何かのご参考になれば幸いです。