これからはじめるSilverlight 4 第4回

NotificationWindowに予定表を表示する

今度は、ブラウザ外実行でのみ実行可能な、NotificationWindow を使ったサンプルを紹介します。

NotificationWindowは、システム・エリア内で表示される通知エリアです。このサンプルでは、予定を記録したXMLデータを読み込み、その日の予定を通知エリアに表示しています（図3）。

サンプル・ファイルはこちらからダウンロードできます。

図3: ブラウザ外実行で、通知エリアにその日の予定が表示されている

先のサンプル作成時と同様の手順で、新規Silverlight 4プロジェクト（プロジェクト名は「SL4_Notification」）を作成してください。プロジェクト依存関係を設定し、「Project／Add Reference」からSystem.Xml.Linqを追加しておきます。

また、予定を記録したXML文書ファイル（リスト3）を追加しておきます。

リスト3: 予定を記録したXML文書ファイル（myPlan.xml）

2010/04/29日付> 3 「ThinkIT」原稿の正式版対応、修正プライベート・クラウドへのSilverlight 3 アプリケーションの移設内容> 予定> ～予定>繰り返し、略。予定表>

このサンプルはブラウザ外実行（Out-Of-Browser）で動作します。ブラウザ外実行を設定するには、VS 2010のメニューから「Project／SL4_Notification Properties」を選択し、「Enable running application out of browser（アプリケーションのブラウザ外実行を有効にする）」にチェックを付けます。

[Out-of-Browser Settings]ボタンの使用が可能になりますので、これをクリックします。ブラウザ外実行時に表示されるWindowのサイズを、「Width」と「Height」に入力して設定します（図4）。

図4: ブラウザ外実行時に表示されるWindowのサイズを設定する

MainPageとユーザー・コントロールのレイアウト

ブラウザ外実行の設定ができたら、コントロールをレイアウトしていきます。まず、MainPage.xamlのデザイン画面に、タイトル表示用のTextBlockとButtonコントロールをレイアウトします。ButtonコントロールのContentプロパティには「本日の予定」と指定します（図5）。このレイアウトによって書き出されるXAMLコードは省略します。

図5: MainPage.xamlのレイアウト

次に、通知エリアに表示させるユーザー・コントロールを作成して、レイアウトしていきます。

Solution Explorer内のプロジェクト名を右クリックして表示されるメニューから、「Add／New Item」を選択します。

「Silverlight User Control」を選択し、「Name」を指定します。ここではデフォルトの「SilverlightControl1.xaml」のままで作業を進めます（図6）。

図6: 「Silverlight User Control」を選択する

いま作成したSilverlightControl1.xaml内のレイアウトを行います。

UserContorlのWidthに300、Heightに100を指定しましょう。通知エリアのHeightに100以上の値を設定すると、下側が切れてしまいますから、注意してください。また、プログラム内で、NotificationWindowのHeightに100より大きい値を指定するとエラーになります。

ToolboxからRectangle、Button、RichTextBoxコントロールをレイアウトします。

RectangleコントロールのFillプロパティには目立つ色を指定しておきましょう。ButtonコントロールのContentプロパティには「閉じる」と指定し、Rectangleの右上に重ねます。

RichTextBoxコントロールのIsReadOnlyプロパティにはチェックを付けて編集を不可とします。

すべてレイアウトすると図7のようになります。このレイアウトによって書き出されるXAMLコードはリスト5の通りです。

図7: Rectangle、Button、RichTextAreaコントロールをレイアウトした

リスト5: 通知エリアのXAMLコード（SilverlightControl1.xaml）

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400" Width="300" Height="100">