WPF学习笔记4 | 易学教程

4.画笔

如何使用 WpF提供的画笔绘制背景和前景。它显示了在 Button
元素的一条 Path和 Backgromd属性上使用各种画笔的效果。

soldColorBrush
soldColorBrush,顾名思义,这支画笔使用纯色。全部区域用同一种颜色绘制。把 Backgromd属性设置为定义纯色的字符串,就可以定义纯色。使用BrushValueSerializer 把该字符串转换为一个 solidColorBrush元素。

        <Button Height="30" Background="PapayaWhip">
            Solid Color
        </Button>

当然,设置 Backgound子元素,把 solidColorBrush元素添加为它的内容,也可以得到同样效
果。应用程序中的第一个按钮把 PapayaWhip 用作纯背景色 :

        <Button Content="Solid Color" Margin="40">
            <Button.Background>
                <SolidColorBrush Color="PapayaWhip"/>
            </Button.Background>
        </Button>

LinearGradientBrush
对于平滑的颜色变化,可以使用 LinearGradientBrush,如第二个按钮所示。这个画笔定义了StartPoint 和EndPoint 属性。使用这些属性可以为线性渐变指定二维坐标。默认的渐变方向是从(0,0)到(1,1)的对角线。定义其他值可以给渐变指定不同的方向。例如,StartPoint 指定为(0,0) EndPoint 指定为(0,1),就得到了一个垂直渐变。 StartPoint 不变,EndPoint 值指定为(1,0) ,就得到了一个水平渐变。
通过该画笔的内容,可以用 GradienStop元素定义指定偏移位置的颜色值。在各个偏移位置之间,颜色是平滑过渡的。

        <Button Content="Linear Gradient Brush" Margin="10">
            <Button.Background>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                    <GradientStop Offset="0" Color="LightGreen"/>
                    <GradientStop Offset="0.4" Color="Green"/>
                    <GradientStop Offset="1" Color="DarkGreen"/>
                </LinearGradientBrush>
            </Button.Background>
        </Button>

效果图：

RadialGradientBrush

使用RadialGradientBrush 可以以放射方式产生平滑的颜色渐变。使用了RadialGradientBrush 。该画笔定义了从GradientOrigin点开始的颜色。

        <Canvas Width="200" Height="150">
            <Path Canvas.Top="0" Canvas.Left="20" Stroke="Black">
                <Path.Fill>
                    <RadialGradientBrush GradientOrigin="0.2,0.2">
                       <GradientStop Offset="0" Color="LightBlue"/>
                        <GradientStop Offset="0.6" Color="Blue"/>
                        <GradientStop Offset="1.0" Color="DarkBlue"/>
                    </RadialGradientBrush>
                </Path.Fill>
                <Path.Data>
                    <CombinedGeometry GeometryCombineMode="Union">
                        <CombinedGeometry.Geometry1>
                            <EllipseGeometry Center="80,60" RadiusX="80"
                                              RadiusY="40" />
                        </CombinedGeometry.Geometry1>
                        <CombinedGeometry.Geometry2>
                            <RectangleGeometry Rect="30,60 105 50"/>
                        </CombinedGeometry.Geometry2>
                    </CombinedGeometry>
                </Path.Data>
            </Path>
        </Canvas>

效果图：

DrawingBrush

DrawingBrush可以定义用画笔绘制的图形，用画笔回执的图形在GeometryDrawing元素中定义Gemetry属性中的GeometryGroup元素包含本章前面讨论的Geometry元素。

        <Button Content="Drawing Brush" Margin="10" Padding="10">
            <Button.Background>
                <DrawingBrush>
                    <DrawingBrush.Drawing>
                        <GeometryDrawing Brush="Red">
                            <GeometryDrawing.Pen>
                                <Pen>
                                    <Pen.Brush>
                                        <SolidColorBrush>Blue</SolidColorBrush>
                                    </Pen.Brush>
                                </Pen>
                            </GeometryDrawing.Pen>
                            <GeometryDrawing.Geometry>
                                <PathGeometry>
                                    <PathGeometry.Figures>
                                        <PathFigure StartPoint="70,40">
                                            <PathFigure.Segments>
                                                <BezierSegment Point1="90,37" Point2="130,46"
                                                               Point3="150,63" />
                                                <LineSegment Point="120,110" />
                                                <BezierSegment Point1="100,95"
                                                               Point2="70,90" Point3="45,91"/>
                                                <LineSegment Point="70,40"/>
                                            </PathFigure.Segments>
                                        </PathFigure>
                                    </PathGeometry.Figures>
                                </PathGeometry>
                            </GeometryDrawing.Geometry>
                        </GeometryDrawing>
                    </DrawingBrush.Drawing>
                </DrawingBrush>
            </Button.Background>
        </Button>

ImageBrush

要把图像加载到画笔中,可以使用 ImgeBmsh元素。通过这个元素,显示 ImageSource属性定义的图像。图像可以从文件系统中访问,或者在程序集的资源中访问。在本例中,图像添加为程序
集的一个资源,并通过程序集和资源名来引用 :

        <Button Content="Image Brush" Width="100" Height="80" Margin="5"
                Foreground="White">
            <Button.Background>
                <ImageBrush ImageSource="C:\Users\Administrator\Pictures\ooopic_1520921385.ico"/>
            </Button.Background>
        </Button>

效果图：

来源：CSDN

作者：youandme520

链接：https://blog.csdn.net/youandme520/article/details/104183633

标签

按钮

wpf