WPF 画笔概述
屏幕上的所有可见内容之所以可见,是因为它们是由画笔绘制的。 例如,可以使用画笔来描述按钮的背景、文本的前景和形状的填充内容。 本主题介绍了使用 Windows Presentation Foundation (WPF) 画笔进行绘制的概念并提供了示例。 使用画笔,您可以利用任意内容(从简单的纯色到复杂的图案和图像集)绘制user interface (UI) 对象。
使用画笔进行绘制
Brush 使用其输出对区域进行“绘制”。 画笔不同,其输出类型也不同。 某些画笔使用纯色绘制区域,其他画笔则使用渐变、图案、图像或绘图绘制区域。 下图显示了每个不同 Brush 类型的示例。
画笔示例
大多数可见对象允许您指定对其进行绘制的方式。 下表列出了一些常见对象和属性,可以对这些对象和属性使用 Brush。
类 |
画笔属性 |
---|---|
下面部分描述了不同的 Brush 类型并提供每个类型的示例。
使用纯色进行绘制
SolidColorBrush 使用纯 Color 绘制区域。 指定 SolidColorBrush 的 Color 有多种方法:例如,可以指定其 alpha、红色和绿色通道或使用一种由 Colors 类提供的预定义颜色之一。
以下示例使用 SolidColorBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用 SolidColorBrush 绘制的矩形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a SolidColorBrush and use it to
' paint the rectangle.
Dim myBrush As New SolidColorBrush(Colors.Red)
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a SolidColorBrush and use it to
// paint the rectangle.
SolidColorBrush myBrush = new SolidColorBrush(Colors.Red);
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<SolidColorBrush Color="Red" />
</Rectangle.Fill>
</Rectangle>
有关 SolidColorBrush 类的更多信息,请参见使用纯色和渐变进行绘制概述。
使用线性渐变进行绘制
LinearGradientBrush 使用线性渐变绘制区域。 线形渐变横跨一条直线(渐变轴)将两种或更多种色彩进行混合。 可以使用 GradientStop 对象指定渐变的颜色及其位置。
以下示例使用 LinearGradientBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用 LinearGradientBrush 绘制的图形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a LinearGradientBrush and use it to
' paint the rectangle.
Dim myBrush As New LinearGradientBrush()
myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a LinearGradientBrush and use it to
// paint the rectangle.
LinearGradientBrush myBrush = new LinearGradientBrush();
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<LinearGradientBrush>
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Orange" Offset="0.5" />
<GradientStop Color="Red" Offset="1.0" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
有关 LinearGradientBrush 类的更多信息,请参见使用纯色和渐变进行绘制概述。
使用径向渐变进行绘制
RadialGradientBrush 使用径向渐变绘制区域。 径向渐变跨一个圆将两种或更多种色彩进行混合。 与 LinearGradientBrush 类一样,可以使用 GradientStop 对象来指定渐变的色彩及其位置。
以下示例使用 RadialGradientBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用 RadialGradientBrush 绘制的矩形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a RadialGradientBrush and use it to
' paint the rectangle.
Dim myBrush As New RadialGradientBrush()
myBrush.GradientOrigin = New Point(0.75, 0.25)
myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a RadialGradientBrush and use it to
// paint the rectangle.
RadialGradientBrush myBrush = new RadialGradientBrush();
myBrush.GradientOrigin = new Point(0.75, 0.25);
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="0.75,0.25">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Orange" Offset="0.5" />
<GradientStop Color="Red" Offset="1.0" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
有关 RadialGradientBrush 类的更多信息,请参见使用纯色和渐变进行绘制概述。
使用图像进行绘制
ImageBrush 使用 ImageSource 绘制一个区域。
以下示例使用 ImageBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用图像绘制的矩形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create an ImageBrush and use it to
' paint the rectangle.
Dim myBrush As New ImageBrush()
myBrush.ImageSource = New BitmapImage(New Uri("sampleImages\pinkcherries.jpg", UriKind.Relative))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create an ImageBrush and use it to
// paint the rectangle.
ImageBrush myBrush = new ImageBrush();
myBrush.ImageSource =
new BitmapImage(new Uri(@"sampleImages\pinkcherries.jpg", UriKind.Relative));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\pinkcherries.jpg" />
</Rectangle.Fill>
</Rectangle>
有关 ImageBrush 类的更多信息,请参见使用图像、绘图和 Visual 进行绘制。
使用绘图进行绘制
DrawingBrush 使用 Drawing 绘制一个区域。 Drawing 可以包含形状、图像、文本和媒体。
以下示例使用 DrawingBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用 DrawingBrush 绘制的矩形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a DrawingBrush and use it to
' paint the rectangle.
Dim myBrush As New DrawingBrush()
Dim backgroundSquare As New GeometryDrawing(Brushes.White, Nothing, New RectangleGeometry(New Rect(0, 0, 100, 100)))
Dim aGeometryGroup As New GeometryGroup()
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))
Dim checkerBrush As New LinearGradientBrush()
checkerBrush.GradientStops.Add(New GradientStop(Colors.Black, 0.0))
checkerBrush.GradientStops.Add(New GradientStop(Colors.Gray, 1.0))
Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)
Dim checkersDrawingGroup As New DrawingGroup()
checkersDrawingGroup.Children.Add(backgroundSquare)
checkersDrawingGroup.Children.Add(checkers)
myBrush.Drawing = checkersDrawingGroup
myBrush.Viewport = New Rect(0, 0, 0.25, 0.25)
myBrush.TileMode = TileMode.Tile
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a DrawingBrush and use it to
// paint the rectangle.
DrawingBrush myBrush = new DrawingBrush();
GeometryDrawing backgroundSquare =
new GeometryDrawing(
Brushes.White,
null,
new RectangleGeometry(new Rect(0, 0, 100, 100)));
GeometryGroup aGeometryGroup = new GeometryGroup();
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));
LinearGradientBrush checkerBrush = new LinearGradientBrush();
checkerBrush.GradientStops.Add(new GradientStop(Colors.Black, 0.0));
checkerBrush.GradientStops.Add(new GradientStop(Colors.Gray, 1.0));
GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);
DrawingGroup checkersDrawingGroup = new DrawingGroup();
checkersDrawingGroup.Children.Add(backgroundSquare);
checkersDrawingGroup.Children.Add(checkers);
myBrush.Drawing = checkersDrawingGroup;
myBrush.Viewport = new Rect(0, 0, 0.25, 0.25);
myBrush.TileMode = TileMode.Tile;
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<DrawingBrush Viewport="0,0,0.25,0.25" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="White">
<GeometryDrawing.Geometry>
<RectangleGeometry Rect="0,0,100,100" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing>
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50" />
<RectangleGeometry Rect="50,50,50,50" />
</GeometryGroup>
</GeometryDrawing.Geometry>
<GeometryDrawing.Brush>
<LinearGradientBrush>
<GradientStop Offset="0.0" Color="Black" />
<GradientStop Offset="1.0" Color="Gray" />
</LinearGradientBrush>
</GeometryDrawing.Brush>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
有关 DrawingBrush 类的更多信息,请参见使用图像、绘图和 Visual 进行绘制。
使用 Visual 进行绘制
VisualBrush 使用 Visual 对象绘制区域。 Visual 对象的示例包括 Button、Page 和 MediaElement。 使用 VisualBrush 还可以将内容从应用程序的一个部分提取到另一个区域,在创建反射效果和放大局部屏幕时将会非常有用。
以下示例使用 VisualBrush 绘制 Rectangle 的 Fill。 下面的插图显示绘制好的矩形。
使用 VisualBrush 绘制的矩形
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a VisualBrush and use it
' to paint the rectangle.
Dim myBrush As New VisualBrush()
'
' Create the brush's contents.
'
Dim aPanel As New StackPanel()
' Create a DrawingBrush and use it to
' paint the panel.
Dim myDrawingBrushBrush As New DrawingBrush()
Dim aGeometryGroup As New GeometryGroup()
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))
Dim checkerBrush As New RadialGradientBrush()
checkerBrush.GradientStops.Add(New GradientStop(Colors.MediumBlue, 0.0))
checkerBrush.GradientStops.Add(New GradientStop(Colors.White, 1.0))
Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)
myDrawingBrushBrush.Drawing = checkers
aPanel.Background = myDrawingBrushBrush
' Create some text.
Dim someText As New TextBlock()
someText.Text = "Hello, World"
Dim fSizeConverter As New FontSizeConverter()
someText.FontSize = CDbl(fSizeConverter.ConvertFromString("10pt"))
someText.Margin = New Thickness(10)
aPanel.Children.Add(someText)
myBrush.Visual = aPanel
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a VisualBrush and use it
// to paint the rectangle.
VisualBrush myBrush = new VisualBrush();
//
// Create the brush's contents.
//
StackPanel aPanel = new StackPanel();
// Create a DrawingBrush and use it to
// paint the panel.
DrawingBrush myDrawingBrushBrush = new DrawingBrush();
GeometryGroup aGeometryGroup = new GeometryGroup();
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));
RadialGradientBrush checkerBrush = new RadialGradientBrush();
checkerBrush.GradientStops.Add(new GradientStop(Colors.MediumBlue, 0.0));
checkerBrush.GradientStops.Add(new GradientStop(Colors.White, 1.0));
GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);
myDrawingBrushBrush.Drawing = checkers;
aPanel.Background = myDrawingBrushBrush;
// Create some text.
TextBlock someText = new TextBlock();
someText.Text = "Hello, World";
FontSizeConverter fSizeConverter = new FontSizeConverter();
someText.FontSize = (double)fSizeConverter.ConvertFromString("10pt");
someText.Margin = new Thickness(10);
aPanel.Children.Add(someText);
myBrush.Visual = aPanel;
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<VisualBrush TileMode="Tile">
<VisualBrush.Visual>
<StackPanel>
<StackPanel.Background>
<DrawingBrush>
<DrawingBrush.Drawing>
<GeometryDrawing>
<GeometryDrawing.Brush>
<RadialGradientBrush>
<GradientStop Color="MediumBlue" Offset="0.0" />
<GradientStop Color="White" Offset="1.0" />
</RadialGradientBrush>
</GeometryDrawing.Brush>
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50" />
<RectangleGeometry Rect="50,50,50,50" />
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingBrush.Drawing>
</DrawingBrush>
</StackPanel.Background>
<TextBlock FontSize="10pt" Margin="10">Hello, World!</TextBlock>
</StackPanel>
</VisualBrush.Visual>
</VisualBrush>
</Rectangle.Fill>
</Rectangle>
有关 VisualBrush 类的更多信息,请参见使用图像、绘图和 Visual 进行绘制。
使用预定义画笔和系统画笔进行绘制
为了方便起见,Windows Presentation Foundation (WPF) 提供了一组预定义画笔和系统画笔,您可以使用这些画笔来绘制对象。
有关可用预定义画笔的列表,请参见 Brushes 类。 有关演示如何使用预定义画笔的示例,请参见如何:使用纯色绘制区域。
有关可用系统画笔的列表,请参见 SystemColors 类。 有关示例,请参见如何:使用系统画笔绘制区域。
常见画笔功能
Brush 对象提供了 Opacity 属性,可以通过该属性使画笔显示为透明或半透明。 如果 Opacity 的值为 0,则画笔显示完全透明;如果 Opacity 的值为 1,则画笔显示为完全不透明。 下面的示例使用 Opacity 属性使 SolidColorBrush 具有 25% 的不透明度。
<Rectangle Width="100" Height="100">
<Rectangle.Fill>
<SolidColorBrush Color="Blue" Opacity="0.25" />
</Rectangle.Fill>
</Rectangle>
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 100;
myRectangle.Height = 100;
SolidColorBrush partiallyTransparentSolidColorBrush
= new SolidColorBrush(Colors.Blue);
partiallyTransparentSolidColorBrush.Opacity = 0.25;
myRectangle.Fill = partiallyTransparentSolidColorBrush;
如果画笔包含部分透明的颜色,则通过相乘将该颜色的不透明度的值与画笔的不透明度值进行结合。 例如,如果画笔的不透明度值为 0.5,画笔中使用颜色的不透明度值也是 0.5,则输出颜色的不透明度值为 0.25。
注意 |
---|
与使用元素的 UIElement.Opacity 属性来更改整个元素的不透明度相比,更改画笔的不透明度值将会更有效。 |
您可以使用画笔的 Transform 或 RelativeTransform 属性对画笔的内容进行旋转、缩放、扭曲和平移。 有关更多信息,请参见Brush 变换概述。
由于它们是 Animatable 的对象,因此也可以对 Brush 进行动画处理。 有关更多信息,请参见动画概述。
Freezable 功能
由于它继承自 Freezable 类,因此 Brush 类提供了一些特殊功能:Brush 对象可声明为资源、在多个对象之间共享以及进行克隆。 另外,除 VisualBrush 外,所有的 Brush 类型都可以设为只读以提高性能和成为线程安全的类型。
有关 Freezable 对象提供的不同功能的更多信息,请参见 Freezable 对象概述。
有关无法冻结 VisualBrush 对象的原因的更多信息,请参见 VisualBrush 类型页。