8天入門wpf—— 第七天 畫刷

     

         這一篇我們聊聊wpf中的畫刷，在wpf中如果想玩各種花哨，那么如何使用畫刷則是我們的基本功，首先看一下類圖

從圖中可以看出，wpf有5種畫刷和1種自定義畫刷，都是繼承自基類Brush，我們看看基類中有哪些好玩的東西。

這里有3個比較感興趣的屬性，分別屬於”透明度“和”圖像轉換“，好，下面我們一一解說。

 

一：SolidColorBrush（實心畫刷）

    實心畫刷是我們用的最多的，也是最簡單的一個，其實也就是填充色的意思，一個很簡單的例子：

其實這里的Background=Red使用的就是SolidColorBrush，xaml進行解析時，發現Background是Brush類型，剛才我也說了

Brush具有圖形轉換的能力，最后xaml就會通過Transform把”Red"字符串解析成SolidColorBrush，更直觀一點的話，我們可以

用C#代碼來描述。

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            button1.Background = new SolidColorBrush(Colors.Red);
        }
    }

 

二：GradientBrush(梯度畫刷)

如果我們使用過ps或者freehand，我們肯定知道在填充色方面有一個叫做“漸變色”的概念，我們使用的最多的漸變色要么是“線性”的，

要么是“圓形”的，剛好這里對應wpf中的“LinearGradientBrush”和“RadialGradientBrush”。

 

1： LinearGradientBrush（線性梯度畫刷）

     線性畫刷也是比較簡單的，一般情況下我們只要設定一個“StartPoint”和“EndPoint”即可。

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Canvas>
        <Rectangle Canvas.Left="51" Canvas.Top="187" Height="101" Name="rectangle2" Stroke="Black" Width="325">
            <Rectangle.Fill>
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Color="Yellow" Offset="0.5"/>
                    <GradientStop Color="Green" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
    </Canvas>
</Window>

這里要注意的就是，我設定的坐標是(0,0),(0,1)，我們知道兩點一條直線，這條直線與X軸平行，我們可以看到顏色的分布是垂直於Y軸的，

如果說我們把坐標改為(0,0)(1,1)，那么顏色分割線還是與(0,0),(1,1)這條斜線垂直嗎？最后發現，嚴格垂直。

 

2：RadialgradientBrush(圓形梯度畫刷)

    在ps中我們玩”圓形漸變“的時候，只需要設定圓心坐標和X坐標和Y坐標的值就可以畫一個圓形漸變，在wpf中同樣需要這三個元素，

分別對應設Center,RadiusX,RadiusY,當然在wpf中還存在一個“梯度原點“：GradientOrigin。

<Window x:Class="WpfApplication3.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Rectangle Height="200" HorizontalAlignment="Left" Margin="128,45,0,0" Name="rectangle1" Stroke="Black" VerticalAlignment="Top" Width="200">
            <Rectangle.Fill>
                <RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
                    <RadialGradientBrush.GradientStops>
                        <GradientStop Color="Yellow" Offset="0"/>
                        <GradientStop Color="Red" Offset="0.25"/>
                        <GradientStop Color="Blue" Offset="0.75"/>
                        <GradientStop Color="LimeGreen" Offset="1"/>
                    </RadialGradientBrush.GradientStops>
                </RadialGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
    </Grid>
</Window>

三：ImageBrush（圖像畫刷）

      這種畫刷也是很有意思的，有時我們在炫時需要用圖片做裝飾，那么此時ImageBrush就可以祝你一臂之力。

<Window x:Class="WpfApplication7.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:my="clr-namespace:WpfApplication7"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.Background>
            <ImageBrush x:Name="landBrush" ImageSource="C:\Users\Administrator\Desktop\weibo\64512.gif"/>
        </Grid.Background>
    </Grid>
</Window>

 

四：VisualBrush（控件畫刷）

     這種畫刷是作用在控件級別上的，也就是說任何控件都可以作為畫刷，很神奇的說。

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <VisualBrush x:Key="test" TileMode="Tile" Opacity="0.8">
            <VisualBrush.Visual>
                <StackPanel>
                    <TextBlock Foreground="Gold">
                        唧唧復唧唧
                    </TextBlock>
                    <TextBlock Foreground="LightBlue">
                       木蘭開飛機
                    </TextBlock>
                    <TextBlock Foreground="LightGray">
                       開的什么機
                    </TextBlock>
                    <TextBlock Foreground="Pink">
                       波音747
                    </TextBlock>
                </StackPanel>
            </VisualBrush.Visual>
        </VisualBrush>
    </Window.Resources>
    <Grid>
        <Button Content="我是超大按鈕" Height="213" HorizontalAlignment="Left" Margin="32,34,0,0" Name="button1" 
                VerticalAlignment="Top" Width="414" Background="{StaticResource ResourceKey=test}"/>
    </Grid>
</Window>

五：DrawingBrush（自定義畫刷）

     最靈活，最復雜的也就是這種自定義畫刷，畢竟wpf不能給我們滿足所有的要求，就必須留一道口子給我們程序員自定義實現。

<Window x:Class="WpfApplication4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <DrawingBrush x:Key="test">
            <DrawingBrush.Drawing>
                <DrawingGroup>
                    <DrawingGroup.Children>
                        <GeometryDrawing>
                            <!-- 繪制矩形 -->
                            <GeometryDrawing.Geometry>
                                <RectangleGeometry RadiusX="0.2" RadiusY="0.5"
                                                       Rect="0.02,0.02,0.96,0.96" />
                            </GeometryDrawing.Geometry>
                            <!-- 矩形填充色 -->
                            <GeometryDrawing.Brush>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStop Color="Green" Offset="0" />
                                    <GradientStop Color="Red" Offset="1" />
                                </LinearGradientBrush>
                            </GeometryDrawing.Brush>
                            <!-- 矩形邊框 -->
                            <GeometryDrawing.Pen>
                                <Pen Thickness="0.02">
                                    <Pen.Brush>
                                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                            <GradientStop Color="AliceBlue" Offset="0" />
                                            <GradientStop Color="Black" Offset="1" />
                                        </LinearGradientBrush>
                                    </Pen.Brush>
                                </Pen>
                            </GeometryDrawing.Pen>
                        </GeometryDrawing>
                    </DrawingGroup.Children>
                </DrawingGroup>
            </DrawingBrush.Drawing>
        </DrawingBrush>
    </Window.Resources>
    <Grid>
        <Button Background="{StaticResource ResourceKey=test}" FontSize="40" Content="Button" Height="113" HorizontalAlignment="Left" Margin="89,80,0,0" Name="button1" VerticalAlignment="Top" Width="292" />
    </Grid>
</Window>