試してみよう : 四角形でないウィンドウの作成

Microsoft Expression Blend アプリケーションでは、実行時に四角形以外の形状で表示されるウィンドウを作成する場合があります。この一般的な例としては、デスクトップ アプレット、ウィジェット、メディア プレーヤーがあります。四角形以外のウィンドウを作成するには、アプリケーションの [Window] 要素のプロパティをいくつか変更し、タイトル バーを使用せずにウィンドウを移動できるイベント ハンドラー メソッドを作成します。

四角形以外のウィンドウを透明にする

1. [オブジェクトとタイムライン] パネルで [Windows] 要素を選択し、[プロパティ] パネルの [外観] で [WindowStyle] プロパティを [None] に変更して、ウィンドウ シェル (タイトル バー) を削除します。F5 キーを押して、既定のシェルのないウィンドウの外観を確認します。[最小化]、[最大化]、[元に戻す]、[閉じる] の各標準ボタンは表示されません。ウィンドウをドラッグすることもできません。Alt キーを押しながら F4 キーを押して、ウィンドウを閉じます。

   メモ :
   その他の WindowStyle オプションについては、MSDNの「WPF ウィンドウの概要」にある WindowStyle の説明を参照してください。

2. [プロパティ] パネルの [外観] で [AllowsTransparency] チェック ボックスをオンにします。ウィンドウの境界が表示されなくなります。

3. ウィンドウの透明度を高めるには、[プロパティ] パネルの [ブラシ] で Window 要素の [Background] プロパティを [ブラシなし] に設定します。ユーザーがウィンドウの目に見えない領域をクリックできるようにする場合は、[Background] プロパティを [単色ブラシ] に設定し、背景ブラシの [Alpha] プロパティを 1 に設定します。こうすると、ウィンドウのクリック可能な領域を非表示のまま維持できます。

4. 最後に、[オブジェクトとタイムライン] パネルの [LayoutRoot] をクリックしてこの要素を有効にし、[ツール] パネルからアートボードに要素を追加します。要素の OpacityMask ブラシを設定して、さまざまな効果を作成します。

   詳細については、「不透明度マスクの作成」を参照してください。

   [楕円] や [ペン] などの描画ツールを使用して図形やパスを描いたり、要素を他の要素の後ろに移動したりできます (要素を右クリックして [順序] をクリックします)。[LayoutRoot] の内容によって、アプリケーションのおおよその外形が決まることになります。

5. もう一度 F5 キーを押して、ウィンドウの外観を確認します。まだ、ウィンドウをドラッグすることはできません。Alt キーを押しながら F4 キーを押して、ウィンドウを閉じます。

実行時にウィンドウのドラッグを有効にするコードの追加

ウィンドウを透明にすると、タイトル バーのないウィンドウの位置を変更できなくなります。ウィンドウを再び移動できるようにするには、ウィンドウにイベント ハンドラーを追加し、関連する分離コード ファイルに小さなコードを追加する必要があります。

1. [ファイル] メニューで [すべて保存] をクリックして、プロジェクトをハード ディスクに保存します(一度も保存されていないプロジェクトにイベント ハンドラー メソッドを追加することはできません)。

2. [オブジェクトとタイムライン] で [Window] 要素を選択した状態で、[プロパティ] パネルの [イベント] をクリックします。

3. [MouseLeftButtonDown] の横に「OnMouseLeftButtonDown」と入力し、Enter キーを押します。

4. 分離コード ファイルのイベント ハンドラー メソッドを次のように変更します。

   private void OnMouseLeftButtonDown(object sender,
            System.Windows.Input.MouseButtonEventArgs e)
   {
     this.DragMove();
   }
   

   Private Sub OnMouseLeftButtonDown(ByVal sender As System.Object,
            ByVal e As System.Windows.Input.MouseButtonEventArgs)
     Me.DragMove()
   End Sub
   

5. F5 キーを押してアプリケーションを実行します。

6. その他のイベント ハンドラー メソッドも追加できます。たとえば、ボタンの Click イベントが発生したときに分離コード ファイルの Close() メソッドを呼び出すメソッドを作成できます。

   イベント ハンドラー メソッドを作成する方法の詳細については、「イベントに応答するコードを記述」を参照してください。