WPF 画笔概述

来源:互联网 发布:p5.js 弧线 编辑:程序博客网 时间:2024/04/29 20:17
 

屏幕上的所有可见内容之所以可见,是因为它们是由画笔绘制的。例如,可以使用画笔来描述按钮的背景、文本的前景和形状的填充内容。本主题介绍了使用 Windows Presentation Foundation (WPF) 画笔进行绘制的概念并提供了示例。使用画笔,您可以利用任意内容(从简单的纯色到复杂的图案和图像集)绘制user interface (UI) 对象。

使用画笔进行绘制

Brush 使用其输出对区域进行“绘制”。画笔不同,其输出类型也不同。某些画笔使用纯色绘制区域,其他画笔则使用渐变、图案、图像或绘图绘制区域。下图显示了每个不同 Brush 类型的示例。

画笔示例

画笔类型

大多数可见对象允许您指定对其进行绘制的方式。下表列出了一些常见对象和属性,可以对这些对象和属性使用Brush

画笔属性

Border

BorderBrush,Background

Control

Background,Foreground

Panel

Background

Pen

Brush

Shape

Fill,Stroke

TextBlock

Background

下面部分描述了不同的 Brush 类型并提供每个类型的示例。

使用纯色进行绘制

SolidColorBrush 使用纯Color 绘制区域。指定 SolidColorBrushColor 有多种方法:例如,可以指定其 alpha、红色和绿色通道或使用一种由Colors 类提供的预定义颜色之一。

以下示例使用 SolidColorBrush 绘制RectangleFill下面的插图显示绘制好的矩形。

使用 SolidColorBrush 绘制的矩形

使用 SolidColorBrush 绘制的矩形
C#
VB
复制
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;
XAML
复制
<Rectangle Width="75" Height="75">  <Rectangle.Fill>    <SolidColorBrush Color="Red" />  </Rectangle.Fill></Rectangle>

有关 SolidColorBrush 类的更多信息,请参见使用纯色和渐变进行绘制概述

使用线性渐变进行绘制

LinearGradientBrush 使用线性渐变绘制区域。线形渐变横跨一条直线(渐变轴)将两种或更多种色彩进行混合。可以使用 GradientStop 对象指定渐变的颜色及其位置。

以下示例使用 LinearGradientBrush 绘制RectangleFill下面的插图显示绘制好的矩形。

使用 LinearGradientBrush 绘制的图形

使用 LinearGradientBrush 绘制的矩形
C#
VB
复制
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;
XAML
复制
<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 绘制RectangleFill下面的插图显示绘制好的矩形。

使用 RadialGradientBrush 绘制的矩形

使用 RadialGradientBrush 绘制的矩形
C#
VB
复制
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;
XAML
复制
<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 绘制RectangleFill下面的插图显示绘制好的矩形。

使用图像绘制的矩形

使用 ImageBrush 绘制的矩形
C#
VB
复制
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;
XAML
复制
<Rectangle Width="75" Height="75">  <Rectangle.Fill>    <ImageBrush ImageSource="sampleImages\pinkcherries.jpg"  />  </Rectangle.Fill></Rectangle>

有关 ImageBrush 类的更多信息,请参见使用图像、绘图和 Visual 进行绘制

使用绘图进行绘制

DrawingBrush 使用Drawing 绘制一个区域。Drawing 可以包含形状、图像、文本和媒体。

以下示例使用 DrawingBrush 绘制RectangleFill下面的插图显示绘制好的矩形。

使用 DrawingBrush 绘制的矩形

使用 DrawingBrush 绘制的矩形
C#
VB
复制
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;
XAML
复制
<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 对象的示例包括 ButtonPageMediaElement使用 VisualBrush 还可以将内容从应用程序的一个部分提取到另一个区域,在创建反射效果和放大局部屏幕时将会非常有用。

以下示例使用 VisualBrush 绘制RectangleFill下面的插图显示绘制好的矩形。

使用 VisualBrush 绘制的矩形

使用 VisualBrush 绘制的矩形
C#
VB
复制
            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;
XAML
复制
<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% 的不透明度。

XAML
复制
<RectangleWidth="100"Height="100"><Rectangle.Fill><SolidColorBrushColor="Blue"Opacity="0.25"/></Rectangle.Fill></Rectangle>
C#
复制
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。

原创粉丝点击