Share via


試試看:製作非矩形視窗

本頁僅適用 WPF 專案

在 Microsoft Expression Blend 應用程式中,您可能會想在執行階段建立一個具有非矩形視覺外觀的視窗。這種視窗的常見範例包括桌面 Applet、Widget 及媒體播放程式。建立非矩形視窗的方法是變更應用程式之 [視窗] 元素的一些屬性,然後建立可讓您不靠標題列就移動視窗的事件處理常式方法。

使非矩形視窗變成透明

  1. 按一下 [檔案] 功能表上的 [新增項目],建立一個名為 Window1.xaml 的新視窗文件。在 [新增項目] 視窗中,確認已選取 [包含程式碼檔案] 核取方塊,才能為 Window1.xaml 產生相符的程式碼後置檔案。

  2. 在 [互動] 面板的 [物件與時間軸] 下,選取 [Window] 元素,然後在 [屬性] 面板的 [外觀] 下,將 [WindowStyle] 屬性變更為 [無],來移除視窗殼層 (標題列)。按 F5 查看視窗在沒有預設殼層時的外觀。請注意,標準的 [最小化]、[最大化]、[還原] 或 [關閉] 按鈕再也不會顯示。也請注意您無法再拖曳視窗。按 ALT+F4 關閉視窗。

    Cc295119.alert_note(zh-tw,Expression.10).gif注意事項:

    如需有關其他 [WindowStyle] 選項的詳細資訊,請參閱 MSDN 文件庫Windows Presentation Foundation Windows 概觀 (英文) 主題中的 WindowStyle。

  3. 在 [屬性] 面板的 [外觀] 下,選取 [AllowsTransparency] 核取方塊。請注意,視窗框線現已不再顯示。

  4. 若要在視窗中增加透明區域,可以在 [屬性] 面板的 [筆刷] 下將 Window 元素的 [Background] 屬性設為 [沒有筆刷] Cc295119.706bbd5c-c0e0-43a1-9604-297f019d0275(zh-tw,Expression.10).png。或者,如果您想讓使用者能夠按一下視窗的可視區域,則可以將 [Background] 屬性設為 [單色筆刷] Cc295119.3a66ec96-47bb-47fc-8876-6b9456feec3a(zh-tw,Expression.10).png,然後將背景筆刷的 [Alpha] 屬性設為 1。這樣視窗就具有能讓使用者按一下的不可視區域。

  5. 最後,在 [物件與時間軸] 下,按兩下 [LayoutRoot] 來啟用該元素,然後將元素從 [工具箱] 新增至畫板。您也可以對元素設定 [OpacityMask] 筆刷 (如需有關如何進行此動作的詳細資訊,請參閱建立不透明度遮罩),來建立不同的效果。您也可以使用繪圖工具 (例如 [橢圓形] Cc295119.8938cfdf-9b75-4a33-bc88-b0636e114a0d(zh-tw,Expression.10).png 和 [畫筆] Cc295119.894f8612-e0ed-4e00-84cf-a9bc8f38fc54(zh-tw,Expression.10).png) 來新增圖形與繪製的路徑,然後將元素移至其他元素後 (以滑鼠右鍵按一下元素,然後按一下 [順序])。[LayoutRoot] 的內容會有效定義應用程式的外框。

  6. 再按一次 F5 查看視窗現在的外觀。請注意,您仍無法拖曳視窗。按 ALT+F4 關閉視窗。

新增能讓人在執行階段拖曳視窗的程式碼

在視窗變成透明後,實際上會因沒有標題列而無法移動視窗。若要使視窗能再移動,您必須在視窗中新增一個事件處理常式,然後在相關的程式碼後置檔案中新增一些程式碼。

  1. 按一下 [檔案] 功能表上的 [全部儲存],將專案儲存至硬碟。這是因為您無法在從未儲存過的專案中新增事件處理常式方法。

  2. 選取 [物件與時間軸] 下方的 Window 元素,按一下 [屬性] 面板的 [事件] Cc295119.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(zh-tw,Expression.10).png 按鈕。

  3. 在 [MouseLeftButtonDown] 旁鍵入 OnMouseLeftButtonDown,然後按 ENTER 鍵。

    • 如果已安裝 Microsoft Visual Studio 2008 Standard Edition 或更新版本,則按 ENTER 鍵後產生的事件處理常式程式碼會自動新增程式碼後置檔案 (Window1.xaml.cs),並在 Visual Studio 中開啟程式碼後置檔案供您編輯。

    • 如果未安裝 Visual Studio,則會將事件處理常式方法的程式碼複製到剪貼簿,以便讓您貼入程式碼後置檔案中。在 [專案] 面板中按兩下程式碼後置檔案來開啟該檔案。將產生的事件處理常式方法程式碼,貼到程式碼後置檔案中最後一個結尾大括弧的正前方 (如果您的程式碼後置檔案使用 C#);或 End Class 陳述式正前方 (如果您的程式碼後置檔案使用 VB.NET)。

      Cc295119.alert_note(zh-tw,Expression.10).gif注意事項:

      如果在 Expression Blend 的 [專案] 面板按兩下無法開啟程式碼後置檔案,可能是沒有應用程式與程式碼後置檔案副檔名 (.cs 或 .vb) 關聯,因此 Windows 不知道如何開啟檔案。如需有關如何利用編輯器 (例如 [記事本]) 關聯 .cs 與 .vb 檔案的詳細資訊,請參閱編輯程式碼後置檔案

  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() 方法。如需有關如何建立事件處理常式方法的詳細資訊,請參閱事件處理概觀