Power Platform 学習アプリ作成会#7

おはようございます、こんにちは、こんばんは。先日は学習アプリ作成会にご参加いただきありがとうございました。今回もレポートとして記事を投稿いたします。分かりにくかった点は以下の動画#6をご覧ください。

また、記事に誤りがあった場合は、優しくご指摘いただけますと幸いです。なお、この記事は筆者が一方的に書いているものなので、文責はkuro.が負うものです。ご理解いただけますと幸いです。

動画#7

ようさんが泣くぞ!

ようさん、忘れていませんよ。DateAdd関数。DateAdd関数。DateAdd関数。DateAdd関数。DateAdd関数…。はい。チャンネル登録、高評価で応援よろしくお願いします!

例:Count, CountA, CountIf, CountRows関数

学習アプリ作成会で使用した関数は、ようさんのチャンネルで『関数解説シリーズ』としてリリースされています。チャンネル登録、高評価よろしくお願いします!

前回の復習(#6)

復習に関しては動画を視聴していただくか、当ブログの『Power Platform学習アプリ作成会#6』をお読みいただければと思います。Akiraさんのチャンネルは高評価と登録をよろしくお願いします

今回(#7)の目指すところ

今回は、①カレンダーに着色することと、②矢印アイコン(<>)を押した時に前月・次月のカレンダーを表示できるようにすることと、③カレンダーの日付を押した時にデータソースが絞り込まれるようにセットしていきます。主に、条件文と変数について理解を深めました。

カレンダーに着色する

検証用スクリーンでお届けします

条件付きの着色…ということなので、日付が表示されているギャラリー(galCalendar)の中にラベルを新規作成し、Day関数の中身をTextプロパティにコピー・アンド・ペースト。そのままこのコントロールは「非表示」にしておきます。

これによって「非表示ラベルの曜日と表示ラベルの曜日が一致していたら表示ラベルを任意の色で着色」というコーディングができるようになりました。

けっこう簡単

では実際に、表示されているラベルのFillプロパティに、日曜日はピンク、土曜日は青、それ以外は白…という着色を行います。

曜日を数値データに変換するためにはWeekday関数を使えば良いので、非表示ラベルのWeekdayと表示ラベルのWeekdayが=1だったらPink、=7だったらAliceBlue、その他だったらWhiteとします。

If(Weekday(lblCalendarDay)=1,Pink,Weekday(lblCalendarDay)=7,AliceBlue,White)
関数おじさん、今回はVTRでの参戦です

次に、今月以外の日付をGrayに追加で塗ります。ここで必要になってくるのがNot関数となります。つまり、今月ではない日付をGrayにということですね。

今月を取得する方法はとても簡単で、Today関数をMonth関数でくくってあげるだけです。

「今月だったら」Grayで着色
「今月でなければ」Grayで着色

If関数は、数学で言うところの余事象で捉えるとコードを書きやすくなります。今回の場合だと、「今月でない」が真の場合はGrayで着色し、偽の場合は、日曜ならPinkで、土曜ならAliceBlueで、それ以外はWhiteで着色する…というように、コンマで区切って偽の条件を追加していくことができます。

順番(ベン図でいうところの包含)にだけ注意して書くことを心がけます。

前月、次月を表示する

今月のカレンダー以外も表示できるようにします。次月は「今月+1」で先月は「今月-1」という仕組みで考えることができます。この「今月」部分を変数=Month(Today())と定義し、コーディングを行います。

変数の理解を深める

Akiraさんの板書

自分なりの理解で良いのですが、箱の比喩以外で変数について教えていただきました。一次方程式を用いることで「上書きされる」という考え方がより理解しやすくなったように思います。

数ではなく、日付で置き換えると

f(x)=x+1 x=Today ( ) の時
x=x+1というのは、Tomorrow = Today ( ) +1となります。

ここでさらに、x=x+1と宣言すると
The day after tomorrow = Tomorrow +1となります。

人を選ぶかもしれませんが、自分はコチラの方が分かりやすく感じました。ひょっとしたら、箱の比喩で学習していたから今回の論理で理解できたのかもしれません。1

これが理解できたところで、まずはViewScreenのOnVisibleプロパティに以下のコードを書きます。

UpdateContext({locDay:Today()})

その後、Today ( ) を変数 locDay で置き換えます。lblCalendarDayのTextプロパティとlblCalendarのFillプロパティにあります。

WordやExcelと同じように、置換機能があるのでコチラを使って一気に書き換えてしまいましょう。

前月、次月を表示する

アイコンのOnSelectプロパティに、それぞれ以下のコードを書きます。

  • 前月
UpdateContext({locDay:DateAdd(locDay,-1,Months)})
  • 次月
UpdateContext({locDay:DateAdd(locDay,1,Months)})

補足すると、DateAdd関数における第三引数のMonthsは「月」を加算(減算)するためのものです。Monthではなく、複数形のMonthsになっている点に気をつけます。

  • ラベルのTextプロパティ
Text(locDay,"yyyy年m月")

あとはいい感じにコントロールを配置して作業完了です。

日付ごとに絞り込む

画像のように矢印アイコン(<>)とラベルを置き、クリックした日付に合わせてデータソースを抽出して表示できるようにします。

Filter(
    English_Result,
    Text(
        DateValue(galCalendar.Selected.lblCalendarDay.Text),
        "yyyy年m月d日"
    ) = Text(
        登録日時,
        "yyyy年m月d日"
    )
)

さて、今日はここまでです。
一部、DateValue関数を使ってテキストデータを日付データに変えて再びテキストデータに変えるという少々不思議なことになっていまいましたが、このあたりは反省会で聞いてみたいと思っています(ここは編集するかもしれません)

使いやすいセレクターになってきました。次回以降、10件で絞り込みできるようにしていくことになります(?)お楽しみに。

次回(#8)

次回もよろしくお願いします

次回は10月8日(土)14時です。ご登録よろしくお願い申し上げます。

隅田智尋

  1. 上書きに関しては「箱」の比喩では説明できません。とは言うものの、小学5年生くらいまでは「箱」の比喩で学習すると良いと思います。大体10歳くらいから「論理」を理解できるようになるのですが、それまでは「箱」で教えるべきだと思っています。これに関しては、発達心理学と言語習得論の見地より追記しておこうと思います。
PAGE TOP