XAMLにコメントを入れる

XAMLもれっきとしたソースファイルなので、コメントを入れて見やすくしましょう。
<!--と-->の範囲内がコメントになります。

コメントを入れてみましょう。
LabelのStyle定義の上で、
<!まで入力すれば候補の!--が選択状態になるので、

TABで確定します。

ラベルの既定スタイルと入力します。

ボタンのスタイルにもコメントを入れてみます。

他のところにもコメントを入れてみます。

#regionコメントを入れてみます。
StackPanelの上で#regionと入力し、

TABを入力します。

コメント内容部分が選択状態になっているので左側と入力します。

Enterを押すと#endregionの行頭にカーソルが移動します。

Altキーを押しながら↓を押すと現在行の内容が1つ下に移動します。

Altキーを押しながら↓を押し続けてStackPanelの閉じタグの下まで#endregionを移動してください。
(下まで行きすぎたらAlt + ↑で上に移動します)

同様に子Gridを#regionで囲って右側とコメントを入れてください。

regionの範囲は行頭付近にある[-]で折りたたむことができます。

通知画面の作成

時間が来た時に表示する画面を作ります。
ソリューションエクスプローラーでプロジェクトを右クリックし、
追加 > ウィンドウ (WPF)を選択します。

NotifyWindowと入力して追加ボタンを押します。

↓↓↓↓↓

NotifyWindowのTitleを時間ですに、TopmostをONにします。

半透明にするため、AllowsTransparencyをONにします。
こちらを先に設定すればWindowStyleは連動してNoneになってくれるようです。

Backgroundのアルファ値を85にします。

デザイナーでGridを右クリックし、レイアウトの種類の変更 > Viewboxを選択します。
ツールボックスからTextBlockをデザイナーのVewboxにドラッグ＆ドロップします。
TextBlockの名前をMessageに、Marginを5に設定します。

TextBlockにd:Text="xx:xx になりました"を追加します。
これはステップ5-1で出てきたd:ItemsSourceと同じく、d:付きのプロパティ設定値はデザイン時のみ有効なダミーデータです。

本物のText設定値は空にしておきましょう。

通知画面の処理

起動時の処理

NotifyWindow.xaml.csを開き、コンストラクタのInitializeComponent呼び出しの後に以下の処理を書きます。

// ウィンドウ位置を左上に設定
Left = 0;
Top = 0;
// ウィンドウサイズをスクリーンサイズに設定
Width = SystemParameters.PrimaryScreenWidth;
Height = SystemParameters.PrimaryScreenHeight;

これでスクリーン全体を覆う半透明の通知画面が表示されるようになります。

画面を閉じる処理

マウスクリックで画面が閉じるようにします。
WindowのMouseDownイベントハンドラを用意し、

以下を記述します。

Close();

キー操作でも画面が閉じるようにします。
KeyDownイベントハンドラを追加し、以下を入力します。

// 「ESC」か「スペース」か「C」を押されたら終了
if (e.Key is
    Key.Escape or
    Key.Space or
    Key.C)
{
    Close();
}

これで通知画面のロジック部分も完成です。
一応ビルドしておきましょう。
メニューのビルド > ソリューションのビルドを実行します。

復習ポイント

• XAMLコメント、#region
• デザイン時のサンプルデータ表示