WPF Rectangle控制項

WPF（Windows Presentation Foundation）是一個強大的用戶界面技術，它無需懂得大量的 Win32 API 或底層的 Windows 消息，並提供了更加靈活的界面構建，其中的 Rectangle 控制項是 WPF 中的基礎控制項之一。這篇文章將從多個方面對 WPF Rectangle 控制項進行詳細闡述。

一、矩形的創建

WPF 中的 Rectangle 控制項是用於創建矩形區域的基礎控制項。可以通過 XAML 代碼或 C# 代碼創建矩形。下面是 XAML 代碼示例：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" Stroke="Black" />

上述代碼將創建一個寬為50個邏輯單位，高為50個邏輯單位，填充顏色為黃色，邊框厚度為3個邏輯單位，邊框顏色為黑色的矩形。

接下來是 C# 代碼示例：

Rectangle rect = new Rectangle();
rect.Width = 50;
rect.Height = 50;
rect.Fill = Brushes.Yellow;
rect.StrokeThickness = 3;
rect.Stroke = Brushes.Black;

上述代碼通過創建 Rectangle 類型的實例 rect，然後設置相關屬性來創建矩形。

二、矩形的屬性

除了上面提到的 Width、Height、Fill 和 Stroke 等屬性，Rectangle 控制項還有其他很多屬性可以用於設置矩形的外觀和行為。下面列出最常用的屬性：

1. RadiusX 和 RadiusY

這兩個屬性用於設置矩形的圓角半徑，可以用來創建圓角矩形。下面是示例代碼：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black" RadiusX="10" RadiusY="10"/>

上述代碼將創建一個圓角半徑為10的矩形。

2. Opacity

該屬性用於設置矩形的不透明度，取值範圍為 0.0 到 1.0。下面是示例代碼：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black" Opacity="0.5"/>

上述代碼將創建一個半透明的矩形。

3. Margin

該屬性用於設置矩形與其父控制項之間的邊距。下面是示例代碼：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black" Margin="10"/>

上述代碼將創建一個距離其父控制項邊緣10個邏輯單位的矩形。

4. Name

該屬性用於為矩形命名，以便在後面對其進行引用。下面是示例代碼：

<Rectangle x:Name="myRect" Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black"/>

上述代碼將創建一個命名為「myRect」的矩形，可以通過其名稱在代碼中對其進行引用。

三、矩形的嵌套和層疊

可以將多個 Rectangle 控制項嵌套或者層疊在一起，以創建出不同形狀的圖形。下面是一個使用嵌套和層疊創建出的複雜圖形：

<Rectangle Width="200" Height="80" Fill="LightGray" StrokeThickness="1">
    <Rectangle.Width>180</Rectangle.Width>
    <Rectangle.Height>60</Rectangle.Height>
    <Rectangle.Fill>White</Rectangle.Fill>
    <Rectangle.Stroke>Black</Rectangle.Stroke>
    <Rectangle Margin="10,10,0,0">
        <Rectangle.Width>140</Rectangle.Width>
        <Rectangle.Height>40</Rectangle.Height>
        <Rectangle.Fill>Yellow</Rectangle.Fill>
        <Rectangle.Stroke>Black</Rectangle.Stroke>
        <Rectangle Margin="10,10,0,0">
            <Rectangle.Width>100</Rectangle.Width>
            <Rectangle.Height>20</Rectangle.Height>
            <Rectangle.Fill>LightGreen</Rectangle.Fill>
            <Rectangle.Stroke>Black</Rectangle.Stroke>
        </Rectangle>
    </Rectangle>
</Rectangle>

上述代碼將創建一個由三個嵌套矩形組成的複雜圖形，其中最外層的矩形為灰色，中間一層為白色，最內層為淺綠色，且每層矩形被偏移一定的距離以形成層疊效果。

四、矩形的交互

1. 滑鼠事件

WPF Rectangle 控制項可以像任何其他 WPF 控制項一樣響應滑鼠事件。下面是一個簡單的示例：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black" MouseLeftButtonDown="Rect_MouseLeftButtonDown"/>

上述代碼將創建一個黃色矩形，同時在滑鼠左鍵按下時調用 Rect_MouseLeftButtonDown 方法。

2. 動畫效果

WPF 中的 Rectangle 控制項可以使用動畫效果來增強其視覺效果。下面是一個簡單的示例：

<Rectangle Width="50" Height="50" Fill="Yellow" StrokeThickness="3" 
           Stroke="Black">
    <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="Opacity" 
                                     To="0.1" Duration="0:0:3" AutoReverse="True" 
                                     RepeatBehavior="Forever"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Rectangle.Triggers>
</Rectangle>

上述代碼將創建一個黃色矩形，並在該矩形載入時啟動一個不斷重複播放的動畫，使其呈現出閃爍的效果。

總結

Rectangle 控制項是 WPF 中的基礎控制項之一，用於創建矩形區域。它可以設置多個屬性來控制其外觀和行為，可以通過嵌套和層疊多個控制項來創建出複雜的圖形。同時，該控制項也可以像任何其他 WPF 控制項一樣響應滑鼠事件並使用動畫效果來增強其視覺效果。