WPF 画刷Brush使用整理

一、Brush画刷简介

画刷（Brush）是WPF中用于填充区域的核心工具，能够以多种方式绘制UI界面对象。

1、SolidColorBrush 使用单一的连续颜色绘制区域。

2、LinearGradientBrush 使用简便填充绘制区域，渐变的阴影填充从一种颜色变化到另一种颜色。

3、RadialGradientBrush 使用径向简便填充绘制区域，除了是在圆形模式中从中心点向外部辐射渐变之外，这种画刷和线性检变化刷类似。

4、ImageBrush 使用可以被拉伸、缩放或平铺的图像绘制区域。

5、DrawingBrush 使用一个Drawing对象绘制区域。该对象可以包含已经定义的形状和位图。

6、VisualBrush 使用一个Visual对象绘制区域。因为所有WPF元素都继承自Visual类，所以可以使用该画刷将部分用户几面(如按钮的表面）复制到另外一个区域。当创建特殊效果时，如部分反射效果，该画刷特别有用。

7、BitmapCacheBrush 使用从一个Visual 对象缓存的内容绘制区域。这种画刷和VisualBrush类似，但是如果需要在多个地方重用图形内容或者频繁的重绘图形内容，这种画刷更高效。

 

SolidColorBrush：单一颜色填充

LinearGradientBrush：线性渐变

RadialGradientBrush：径向渐变

1. Center
2. GradientOrigin
3. RadiusX
4. RadiusY
5. GradientStops
6. SpreadMethod
7. MappingMode

ImageBrush图片画刷

1. ImageSource
2. Stretch
3. AlignmentX
4. AlignmentY
5. TileMode
6. Viewport
7. ViewportUnits
8. Viewbox
9. ViewboxUnits

DrawingBrush复杂图形画刷

Visual Brush填充对象画刷

 

二、画刷使用案例

1.SolidColorBrush 纯色画刷

        <Rectangle Width="100" Height="50"  StrokeThickness="5">
            <Rectangle.Fill>
                <SolidColorBrush  Color="Blue" Opacity="0.8"></SolidColorBrush>
            </Rectangle.Fill>
            <Rectangle.Stroke >
                <SolidColorBrush Color="#ff0000" ></SolidColorBrush>
            </Rectangle.Stroke>
        </Rectangle>

2.LinearGradientBrush 线性渐变画刷

 

如果你想要其他方向的渐变，可以相应地调整 StartPoint 和 EndPoint：

从左到右：StartPoint="0,0"，EndPoint="1,0"
从右到左：StartPoint="1,0"，EndPoint="0,0"
从下到上：StartPoint="0,1"，EndPoint="0,0"
对角线：StartPoint="0,0"，EndPoint="1,1"

        <Rectangle Height="100" Width="200">
            <Rectangle.Fill>
                <LinearGradientBrush StartPoint="0 0" EndPoint="1 1">
                    <GradientStop Color="Green" Offset="0" />
                    <GradientStop Color="Red" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

 3.RadialGradientBrush 径向渐变画刷

 

        <Rectangle Width="200" Height="200">
            <Rectangle.Fill>
                <RadialGradientBrush Center="0.5,0.5" GradientOrigin="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
                    <GradientStop Color="Yellow" Offset="0"/>
                    <GradientStop Color="Red" Offset="1"/>
                </RadialGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

 

 

1. Center
类型：Point
默认值：(0.5, 0.5)
解释：定义渐变的中心点。值 (0.5, 0.5) 表示渐变中心位于填充区域的正中心。该点的坐标是相对于填充区域的，范围在 0 到 1 之间。
2. GradientOrigin
类型：Point
默认值：(0.5, 0.5)
解释：定义渐变起始颜色的起点。默认值与 Center 相同，表示渐变从中心开始。如果不同于 Center，会产生一个从 GradientOrigin 到 Center 的渐变效果。
3. RadiusX
类型：double
默认值：0.5
解释：定义渐变椭圆的水平方向半径。值是相对于填充区域的宽度，范围在 0 到 1 之间。0.5 表示半径是填充区域宽度的一半。
4. RadiusY
类型：double
默认值：0.5
解释：定义渐变椭圆的垂直方向半径。值是相对于填充区域的高度，范围在 0 到 1 之间。0.5 表示半径是填充区域高度的一半。
5. GradientStops
类型：GradientStopCollection
解释：包含渐变中使用的颜色和偏移值的集合。每个 GradientStop 定义了一个颜色和一个相对偏移量，偏移量范围在 0 到 1 之间。
6. SpreadMethod
类型：GradientSpreadMethod
默认值：Pad
解释：定义当填充区域超出定义的渐变区域时如何绘制。可能的值有：
Pad：超出部分填充最后一个渐变颜色。
Reflect：超出部分以镜像的方式反射渐变。
Repeat：超出部分重复渐变。
7. MappingMode
类型：BrushMappingMode
默认值：RelativeToBoundingBox
解释：定义如何解释 Center、GradientOrigin、RadiusX 和 RadiusY。可能的值有：
RelativeToBoundingBox：相对于填充区域的边界框，值在 0 到 1 之间。
Absolute：使用绝对值。

 

4. ImageBrush 图片画刷

        <Rectangle Width="200" Height="200" >
            <Rectangle.Fill>
                <ImageBrush ImageSource="/Panel/aeebd7c79497c886a4bdf5ba68f923f.jpg" Stretch="Fill"/>
            </Rectangle.Fill>
        </Rectangle>

 

1. ImageSource
类型：ImageSource
解释：指定用于填充的图像源，可以是图像文件路径、URI 或者图像资源。

2. Stretch
类型：Stretch
默认值：Fill
解释：定义如何拉伸图像以填充目标区域。可能的值有：
None：图像保持其原始大小。
Fill：图像拉伸以完全填充目标区域，不保持宽高比。
Uniform：图像拉伸以适应目标区域，同时保持宽高比。如果目标区域和图像的宽高比不同，会有一部分区域留白。
UniformToFill：图像拉伸以完全填充目标区域，同时保持宽高比。如果目标区域和图像的宽高比不同，图像的一部分会被裁剪。

3. AlignmentX
类型：AlignmentX
默认值：Center
解释：当图像比目标区域小时，定义图像在水平方向上的对齐方式。可能的值有：
Left：图像左对齐。
Center：图像居中对齐。
Right：图像右对齐。

4. AlignmentY
类型：AlignmentY
默认值：Center
解释：当图像比目标区域小时，定义图像在垂直方向上的对齐方式。可能的值有：
Top：图像顶对齐。
Center：图像居中对齐。
Bottom：图像底对齐。

5. TileMode
类型：TileMode
默认值：None
解释：定义如何平铺图像。可能的值有：
None：不平铺图像。
Tile：平铺图像。
FlipX：水平翻转平铺图像。
FlipY：垂直翻转平铺图像。
FlipXY：水平和垂直翻转平铺图像。

6. Viewport
类型：Rect
默认值：(0,0,1,1)
解释：定义图像画刷的基础平铺单元。默认值 (0,0,1,1) 表示使用整个图像。如果需要更改图像的可见部分，可以调整此属性。

7. ViewportUnits
类型：BrushMappingMode
默认值：RelativeToBoundingBox
解释：定义 Viewport 和 Viewbox 的测量单位。可能的值有：
RelativeToBoundingBox：相对于目标区域的边界框。
Absolute：使用绝对像素值。

8. Viewbox
类型：Rect
默认值：(0,0,1,1)
解释：定义要显示的源图像部分。默认值 (0,0,1,1) 表示整个图像。如果只想显示图像的一部分，可以调整此属性。

9. ViewboxUnits
类型：BrushMappingMode
默认值：RelativeToBoundingBox
解释：定义 Viewbox 的测量单位。可能的值有：
RelativeToBoundingBox：相对于图像的边界框。
Absolute：使用绝对像素值。
————————————————

 5. DrawingBrush复杂图形画刷

        <Rectangle Width="300" Height="200" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Rectangle.Fill>
                <DrawingBrush>
                    <DrawingBrush.Drawing>
                        <DrawingGroup>
                            <!-- 背景 -->
                            <GeometryDrawing Brush="LightBlue">
                                <GeometryDrawing.Geometry>
                                    <RectangleGeometry Rect="0,0,1,1"/>
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                            <!-- 圆形 -->
                            <GeometryDrawing Brush="Yellow">
                                <GeometryDrawing.Pen>
                                    <Pen Brush="Black" />
                                </GeometryDrawing.Pen>
                                <GeometryDrawing.Geometry>
                                    <EllipseGeometry Center="0.5,0.5" RadiusX="0.25" RadiusY="0.25"/>
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                            <!-- 线条 -->
                            <GeometryDrawing Brush="Transparent">
                                <GeometryDrawing.Pen>
                                    <Pen Brush="Red" />
                                </GeometryDrawing.Pen>
                                <GeometryDrawing.Geometry>
                                    <LineGeometry StartPoint="0,0" EndPoint="1,1"/>
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                            <!-- 多边形 -->
                            <GeometryDrawing Brush="Green">
                                <GeometryDrawing.Pen>
                                    <Pen Brush="Blue" />
                                </GeometryDrawing.Pen>
                                <GeometryDrawing.Geometry>
                                    <PathGeometry>
                                        <PathFigure StartPoint="0.5,0.1">
                                            <PolyLineSegment Points="0.7,0.3 0.5,0.7 0.3,0.3" IsStroked="True" />
                                        </PathFigure>
                                    </PathGeometry>
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                        </DrawingGroup>
                    </DrawingBrush.Drawing>
                </DrawingBrush>
            </Rectangle.Fill>
        </Rectangle>
View Code

主要属性

DrawingBrush 继承自 TileBrush，因此具有以下主要属性：

Drawing：指定用于填充的 Drawing 对象。
Stretch：定义如何拉伸 Drawing 以填充目标区域。
AlignmentX 和 AlignmentY：定义 Drawing 在目标区域内的对齐方式。
TileMode：定义如何平铺 Drawing。
Viewport：定义 DrawingBrush 的基础平铺单元。
ViewportUnits：定义 Viewport 的测量单位。
Viewbox：定义要显示的 Drawing 部分。
ViewboxUnits：定义 Viewbox 的测量单位。
DrawingGroup：DrawingGroup 对象可以包含多个 Drawing 对象，用于创建复合图形。
GeometryDrawing：定义了几何图形的绘制，可以包括填充（Brush）和轮廓（Pen）。
RectangleGeometry 和 EllipseGeometry：定义矩形和椭圆形的几何图形。
GlyphRunDrawing：用于绘制文本。
————————————————

 

 6. Visual Brush填充对象画刷

        <Rectangle Width="300" Height="300" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Rectangle.Fill>
                <VisualBrush>
                    <VisualBrush.Visual>
                        <StackPanel>
                            <TextBlock Text="Hello, VisualBrush!" FontSize="20" Foreground="Black"/>
                            <Button Content="Click Me" Width="100" Height="50" Background="LightCoral" Foreground="White"/>
                        </StackPanel>
                    </VisualBrush.Visual>
                </VisualBrush>
            </Rectangle.Fill>
        </Rectangle>

 

 

VisualBrush 继承自 TileBrush，因此它也有以下主要属性：

Visual：指定用于填充的 Visual 对象。
Stretch：定义如何拉伸 Visual 以填充目标区域。
AlignmentX 和 AlignmentY：定义 Visual 在目标区域内的对齐方式。
TileMode：定义如何平铺 Visual。
Viewport：定义 VisualBrush 的基础平铺单元。
ViewportUnits：定义 Viewport 的测量单位。
Viewbox：定义要显示的 Visual 部分。
ViewboxUnits：定义 Viewbox 的测量单位。
————————————————

 

 

 

更多：

WPF 布局Viewbox&ScrollViewer使用案例

WPF 布局Canvas使用案例

WPF 布局UniformGrid使用案例

posted @ 2025-07-05 15:56  天马3798  阅读(102)  评论(0)    收藏  举报