Power Apps 教えてAkiraせんせー！⑥

ちっぴです。
@akira_365🐟さんの講習6回目が終了しましたー！
カレンダーを作成していきます📅✨
まずは、カレンダーのセレクターってなんだろうというところからです。
（聞き慣れないのでググってみました）

Calendar for ASP.NET Web Forms

5回目はこちら

Calendar の Gallery の作成

Akira🐟さん「一番早いのは『新しい画面』の中のカレンダーを選択すること。カスタムしないでも、用意されているものをコピペで作るだけ」

スケジューラーのようなアプリケーションが用意されているのは、
Power Appsの特徴みたいです。

自動的にカレンダーを搭載したアプリケーションのUIが作成される

日本人はこのようなUIが好きみたい

データソースを司るのはドロップダウンコントロールのOnSelect

高度なことをやっているので初学者に解読はムリ・・・

Akira🐟さん「MSさんは『これを参考にカレンダー作ってみて』と言っていますが、何を言っているんだというデータ量が入っています」

簡略化した作り方を学びます。

新しい画面→空を選択

calenderScreenと名前をつけますが、解説のための画面となるので最終的には不要となります。

オーサリングメニュー→挿入→レイアウト→空の垂直ギャラリー
カレンダーの要素を作っていくうえで必要なものを用意します。
名前：galCalender
罫線：1

枠組みはギャラリーで作っていきます

では、中に入る要素は何なのか。

今月すべてを表示するには・・・Windowsのカレンダーを参考にすると
7(日) × 6(行)となっているので、42個表示ができればOK。
42日分表示ができるように、1から42のテーブルを設定する。
Items=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42]
幅：700
高さ：600
テンプレートのパディング：0
テンプレートサイズ：Self.Height/6

パディングとは、項目とギャラリーの淵の境の隙間

続いて、Templateを選択した状態で
折り返しの数：7

カレンダーの数値が入る最初の四角形（ギャラリーの最小領域が定義できた）

さらに、Templateを選択した状態で
オーサリングメニュー→挿入→テキストラベル
左上に数字がくるように調整します。
名前：lblCalendarNum

これ気持ちいい～

捨てラベル

Akira🐟さん「捨てラベルという考え方はとても重要です。関数が入り組んでいる場合、ひとつひとつがどんな表示になっているか、どんな値になっているかを確認するためです」

説明用のラベルもあるとわかりやすい！

捨てラベル① 今日の日付（Today関数）
Text=Today()

元のデータは2022/9/4 0:00:00 → 日付型で返される

捨てラベル② 月初日（DateAdd関数・Day関数）
本日の日付の月初にあたるもの、
月初とは、今日が9月4日だとし、その4日という情報を引き算すると、前月末になる。
その日に1日足すと、9月中であれば何日であろうと『9月1日』になる。

まずは、現在の日付を用意・・・Today関数
日付を足し算引き算する関数・・・DateAdd関数
例）DateAdd(Today(),1)・・・9月5日
　　DateAdd(Today(),-1)・・・9月3日
日数部分だけを抽出する・・・Day関数
例）Day(Today())・・・4を返す
　　DateAdd(Today(),-Day(Today()))・・・8月31日

日付は+-で足し算引き算をするということは基本的にできない

捨てラベル③ 週番号（Weekday関数）
週番号とは、曜日を検出するカレンダーを作成する上で重要な要素となる。
日曜日を1とし7までの数字で返す。
今日が9月4日だとする
例）Weekday(DateAdd(Today())・・・1（日曜日）

月初の週番号を返したいので、Weekday関数の引数に
月初日を返す DateAdd(Today(),1-Day(Today())) を入れると月初の週番号が取れる。

Akira🐟さん「ここから魔法のようにカレンダーを作っていきます」

月初の週番号ラベルをコピーし、GalleryのTemplateを選択した状態で
ペーストし、右上に配置しておく。
名前：lblWeekday

※Galleryの1マスの左上には、定義した1から42までの番号
※Galleryの右上には月初のWeekdayの番号

感の良い方は、そうゆうことね～とわかってくるみたい😚

GalleryのTemplateを選択した状態でオーサリングメニュー→挿入→テキストラベル
名前：lblCalendarValue
左下に配置しておき、左上のラベルから右上のラベルを引き算した値を表示させます。

-4から始まり37で終わる交差数列

ラストです✊
こちらに月初日を足し算してあげるとカレンダー📅になる！！

DateAddの足し算に含める

ここでラベルを2つ非表示にします。
lblWeekday、lblCalendarNum・・・非表示

余計な数字は見えないように

lblCalendarValueはプロパティの設定をいくつか変更していきます。
DAY関数で｢日｣のみ表示させます。

このようになります⭐

Text=Day(DateAdd(Today(),-Day(Today())+1+lblCalendarNum-lblWeekday))
罫線：1
垂直方向の配置：中央
テキストのアライメント：中央揃え
幅：Parent.Width/7
高さ：Parent.TemplateHeight
フォントサイズ：10
Fill：White

lblCalendarValueの親階層はGalleryを指します。
Parent.Width/7とはGalleryの幅を7で割ることです。

Templateのサイズは高さに依存する

こちら Gallery 全体をコピーして、ViewScreen の左側にペーストします。

今回作成した続きということになるのですが、初の宿題が出ました！
解答発表日までに自分なりに考えることができました。

#PowerPlatform塾 宿題③ ⼟曜⽇は「AliceBlue」⽇曜⽇は「Pink」⽉外は「Gray」にラベルのFill を設定してみましょう

先に曜日のColorでいろいろいろいろ試しました笑
それと捨てラベルを活用しまくりました！@akira_365さんの解答はどんな感じなのかとても楽しみです😊 https://t.co/ezMicbMQP7 pic.twitter.com/eB3XohBoyY

— ちっぴ (@c________k) September 6, 2022

ANDやSWITCH関数を使いたかったのですが、断念しました🤧
IF関数と捨てラベルで頑張りました😃💦

Akiraさんと、
早々に完了されていたお仲間さんの数式も見せていただこうと思います✨

次回も楽しみです！

MEMO：

LEFT(文字列, 文字数)　文字列の先頭から指定された数の文字を返す
日曜日から月曜日までを返す関数で曜日部分を消すのに Left関数 で1つとるその Value をこの中のラベルでとってっきて配列で示しているThisItem.Value に変更するだけ