こんにちは、あんこ先生です。
日付の選択コントロール、本日の日付やその前後数日間を選択させるためだけに使っていませんか？
はい、わたしがそのひとりでした。
なぜなら、離れた日付を選択するのがとても面倒なコントロールだからです。
例えば、ドロップダウンコントロールなら①開く、②選ぶの２ステップで完了します。
ところがこの日付の選択コントロール、なんと③ＯＫを押すというとんでも仕様が採択されています。
また、先月末とか前年同日とかポチポチが続いてうんざりしますよね。
そこで、この記事では、日付の選択コントロールの使い方と主要プロパティを解説します。
さらに、すぐ使える活用事例をコード付きで紹介します。
実際にコードをコピペして、動作を確認してみましょう！
日付の選択コントロールについて
日付の選択コントロールとは│DatePicker
カレンダー形式で日付を表示し、ひとつの日付を選択するボックスです。
カレンダーから選択、または数式等で設定した日付から、戻り値としてDate型を返します。
つまり、日付に関する入力に特化したコントロールなのです。
日付の選択コントロールの設置方法
挿入リボンから下記アイコンを選べば日付の選択コントロールが追加できます。
主要プロパティの使い方│日付の選択
日付の選択コントロールの主要プロパティは、次の２点です。
- ユーザーが変更する前の初期値を設定するDefaultDateプロパティ
- コントロールに表示またはユーザーが入力した結果（戻り値）のSelectedDateプロパティ
初期値の設定方法は次の２点があります。
初期値
DefaultDateプロパティ
Today()
- 初期値はToday関数なので、何もしなければローカルで本日時間が表示されます。
数式で指定した日付
DefaultDateプロパティ
//今月の月末日を表示
Date(
Year(DateAdd(Today(),1,TimeUnit.Months)),
Month(DateAdd(Today(),1,TimeUnit.Months)),
1
)-1
- 数式で特定の日付を算出することで指定できます。
- 変数でも同じことができます。
- 日付型かフォーマットが日付のテキスト型（”2022/2/22″）以外は表示できません。
テーブル型やレコード型に含まれる日付を表示させるには、LookUp関数などで単一のフィールドを指定する必要があるよ！
戻り値
日付の選択コントロールの戻り値はSelectedDateプロパティです。
TextInputxx.Textプロパティ
DatePickerxx.SelectedDate //テキスト入力コントロールに表示する場合
Patch関数
Patch(detasauce,LookUp(detasauce,ID=xxx),
{Date:DatePickerxx.SelectedDate}) //データソースに書き込む場合
その他プロパティの使い方
※色やサイズ変更など他コントロールと共通したプロパティの説明は省いています。
日付の書式│Format
- 書式を変えることで、曜日を追加することもできます。
- 見た目だけで戻り値（SelectedDate）は変わりません。
初期値に戻す│Reset
DatePickerxx.Resetプロパティ
True //FalseのままだとReset関数が機能しません
Iconxx.OnSelectプロパティ
Reset(DatePickerxx) //()で囲んだコントロールを初期値に戻します
- Reset関数で入力した内容を初期値に戻します。
- あらかじめ、ResetプロパティをTrueにしておく必要があります。
もともと操作しにくいコントロールなので初期値に戻すボタンは有用です。
初期値をToday関数にしておけば、本日の日付に戻ります。
活用事例とサンプルコード│日付の選択
アイコンを押して日付を増減させる
DatePickerxx.DefaultDateプロパティ
_Date //日付変数、あらかじめボタンなどでToday()を代入しておきます。
IconPlus.OnSelectプロパティ
Set(_Date,DateAdd(_Date,1,TimeUnit.Days)) //押すたびに1日ずつ増える
IconMinus.OnSelectプロパティ
Set(_Date,DateAdd(_Date,-1,TimeUnit.Days)) //押すたびに1日ずつ減る
- 前後数日間を選択する際に便利です。
- DateAdd関数のパラメータを変えることで月や年単位での移動もできます。
- 上限・下限がある場合はIf関数などで制御します。
この機能を使えば、イライラ問題は緩和されますね。
選択した日付から年、月、日をそれぞれ抜き取る
TextInputxx.Textプロパティ
Year(DatePicker1) //年
TextInputxx.Textプロパティ
Month(DatePicker1) //月
TextInputxx.Textプロパティ
Day(DatePicker1) //日
- Year関数等で年月日をそれぞれ抜き取ります。
選択した日付から和暦を求める
TextInputxx.Textプロパティ
Year(DatePicker1)-
If(DatePicker1.SelectedDate>=Date(2019,5,1),2018, //令和
If(DatePicker1.SelectedDate>=Date(1989,1,8),1988,1925)) //平成or昭和
- 地道に計算しただけです。昭和から令和まで対応。
選択した日付が当月何週目の何曜日か抜き取る
TextInputxx.Textプロパティ
RoundUp(Day(DatePicker1)/7,0) //当月何週目
TextInputxx.Textプロパティ
Last(FirstN(Calendar.WeekdaysLong(),Weekday(DatePicker1))).Value //曜日
- 何週目かは、当月の日を７で割ってRoundUp関数で繰り上げて算出しています。
- 曜日は、Weekday関数で曜日番号を取得し、Calendar関数のレコード位置を算出しています。
本日の日付からある期間経過後の日付を求める
DatePickerxx.DefaultDateプロパティ
DateAdd(DatePickerxx.SelectedDate,90,TimeUnit.Days) //３か月ではなく90日後の日付
- DateAdd関数のパラメータを変えることで１か月後や１年後、数値をマイナスに変えれば１５日前などの設定が可能です。
月初、月末日を求める
DatePickerxx.DefaultDateプロパティ
Date(Year(Today()),Month(Today()),1) //月初日
DatePickerxx.DefaultDateプロパティ
Date(Year(DateAdd(Today(),1,TimeUnit.Months)),Month(DateAdd(Today(),1,TimeUnit.Months)),1)-1 //月末日
- 当月の月初日と月末日を設定します。
- 月末日は翌月月初日から１日引いて求めています。
２つの日付の期間を求める
TextInputxx.Textプロパティ
DateDiff(DatePicker1,DatePicker2) //開始から終了日
- DateDiff関数で期間を求めます。初期値は日数ですが、パラメータで月や年も集計できます。
失敗例から学ぶ│日付の選択
SharePointリストに空データを書き込めない
SharePointリストは一度データを書き込むと、空（Blank）に戻せません。
その場合、標準では未実装のテスト機能になりますが、アプリごとに下図の数式レベルのエラー管理をオンにすれば可能になります。
空データで書き込む際は、Blank()をあてがえば空になります。
まとめ
要点をまとめると次の３点です。
- 日付の選択コントロールは、使いにくいけど使い方次第でなんとかなる。
- Reset関数で初期値に戻せる。
- 月末日や何週目なども数式で求めることができる。
これであなたも日付の選択コントロールマスターです。
アイデアを活かして素敵なアプリを作成しましょう！
ご支援よろしくおねがいします
この記事を気に入ってくださった方、寄付してあげてもいいよという方がいらっしゃっいましたら、ご支援いただけると助かります。
下記リンクからAmazonギフト券で、金額は15円からお気持ちを入力してください。
受取人のメールアドレスは amazon@anko7793.com までお願いします。
メッセージもいただけるとたいへん喜びます。
よろしくお願いします。
でもやっぱり操作しづらいし、離れた日付は選択しにくいですね。
でも安心してください！後半でその問題を解決する方法を紹介します。