WPF画2D图形:
WPF创建和使用2维图形主要集中在3个重要的数据类型之上:Drawing,Visual,Shape。
Drawing:对于填充相关联的路径和形状的简单描述以及轮廓Brush。
Visual:把Drawing画到屏幕的一种方式,提供了完全摆脱Drawing对象的底层轻量级实现。
Shape:预制的Visual,是在屏幕上画自定义工艺图最简单的方法。
一、Drawing:(代表二维图画)
子类1 、GeometryDrawing(设计用于实现WPF版的剪切画,足以表示任何二维插图,同时也能够支持动画,数据绑定,资源引用等)包括:图形的Geometry类,用于填充的Brush类,用于画轮廓的Pen类
2、ImageDrawing:包括ImageSource类以及用来定义边界的Rect类。
3、VideoDrawing:包括MdeiaPlayer类以及定义边界的Rect类。
4、GlyphRunDrawing:包括GlyphRun类,低级别的文本类,以及绘制前景色的Brush类。
5、DrawingGroup:包含一组Drawing对象的集合类,
Drawing本身没有任何绘画的行为,只有让Drawing对象得到恰当的渲染才可以,为此我们可以将它放在3个不同的宿主对象中的其中一个里面:
DrawingImage,DrawingBrush,DrawingVisual。
例子:(Figure 11.1 EllipseGeometry.xaml)
<DrawingImage>
<DrawingImage.Drawing>
<GeometryDrawing Brush="Orange">
<GeometryDrawing.Pen>
<Pen Brush="Black" Thickness="10"/>
</GeometryDrawing.Pen>
<GeometryDrawing.Geometry>
<EllipseGeometry RadiusX="100" RadiusY="50"/>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingImage.Drawing>
</DrawingImage>
1.1、 在Drawing子类GeometryDrawing 中包括的Geometry类是用来画出几何图形的类:
它的子类可以分为:基本几何体和聚合集合体以及CombinedGeometry
基本几何体:RectangleGeometry(包括定义尺寸的Rect属性,定义圆角的XY轴半径RadiusX,RadiusY)
ElipseGeometry(包括RadiusX和RadiusY属性,以及Center中心点属性)
LineGeometry(包括StartPoint和EndPoint属性,这两个属性定义了一个线段)
PathGeometry(在它的Figures轮廓内容属性中包括一组PathFigure对象的集合,是通用的的Geometry对象。
而对于最后一种是最强大的一个,它可以画任何图形:
它的(PathGeometry下的)PathFigure包括以下派生类:
LineSegment-用于表示线段的类
PolyLineSegment用于表示线段连接顺序的快捷方式。
ArcSegment用于假想的椭圆周线上曲线段的类。
BezierSegment用于表示三次贝塞尔曲线段的类
PolyBezierSegment用于表示一组QuadraticBezierSegment的已连接序列的捷径。
例子:(PathFigure.xaml)
<DrawingImage>
<DrawingImage.Drawing>
<GeometryDrawing Brush="Orange">
<GeometryDrawing.Pen>
<Pen Brush="Black" Thickness="5"/>
</GeometryDrawing.Pen>
<GeometryDrawing.Geometry>
<PathGeometry FillRule=”EvenOdd”>
<PathFigure IsClosed=”True”>
<LineSegment Point="0,100"/>
<LineSegment Point="100,100"/>
</PathFigure>
</PathGeometry>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingImage.Drawing>
</DrawingImage>
例子中<LineSegment Point="0,100"/>线默认的起始点是(0,0)
FillRule设置属性”EvenOdd”,和”NonZero”两种方式填充区域。
聚合集合体和CombinedGeometry:
聚合集合体:是一种WPF典型的集合几何体类有一个或多个Geometry组成。
例子:(GeometryGroup.xaml)
CombinedGeometry:不是通用的集合器,用下面的枚举值合并两个几何体。
Union,将两个几何体的整个区域都给合并后的几何体。
Intersect,将两个几何体共享的区域合并。
Xor,将两个几何体不共享的区域给合并后的几何体。
Exclude,将第一个几何体独有区域给合并后的几何体。
例子:(CombinedGeometry.xaml)
1.2、 Pen
Pen实际上是一个带宽度的Brush有更多的一些属性来控制它的外观:
StartLineCap和EndLineCap----用枚举值定义开放段端点的外观有值:Flat(默认)、Square、Round、Triangle(链接两个端的点,可以用LineJoin定义外观)
LineJoin-------枚举类型的值来定义转角的外观 Miter、Round、Bevel
DashStylel-----让画笔画不连续的线。
例子:(Pen.xaml)
用以上知识的综合例子:(Ghost Clip Art - Drawing.xaml)
二、Visual:是UIElement类的抽象基类,包含了画任何东西到屏幕上的下层基本构造。
他最重要的类是:DrawingVisual(他没有Drawing属性来讲Drawing联系起来)必须调用RenderOpen方法来返回一个DrawingContext的实例,然后再这个实例对象上作画,最后调用Close方法关闭这个对象。
图形画完之后,要将DrawingVisual对象登记到Visual里边:这里就要调用AddVisualChild(),和AddLogicalChild()方法。
做完以上之后,我们还要重写VisualChildrenCount属性的值,来返回Window中Visual的数目,然后重写GetVisualChild方法根据索引来找到这个DrawingVisual。
例子:(Hosting and Displaying a Visual文件夹)
public class WindowHostingVisual : Window
{
DrawingVisual ghostVisual = null;
public WindowHostingVisual()
{
Title = "Hosting DrawingVisuals";
Width = 300;
Height = 350;
ghostVisual = new DrawingVisual();
using (DrawingContext dc = ghostVisual.RenderOpen())
{
// The body
dc.DrawGeometry(Brushes.Blue, null, Geometry.Parse(
@"M 240,250
C 200,375 200,250 175,200
C 100,400 100,250 100,200
C 0,350 0,250 30,130
C 75,0 100,0 150,0
C 200,0 250,0 250,150 Z"));
// Left eye
dc.DrawEllipse(Brushes.Black, new Pen(Brushes.White, 10),
new Point(95, 95), 15, 15);
// Right eye
dc.DrawEllipse(Brushes.Black, new Pen(Brushes.White, 10),
new Point(170, 105), 15, 15);
// The mouth
Pen p = new Pen(Brushes.Black, 10);
p.StartLineCap = PenLineCap.Round;
p.EndLineCap = PenLineCap.Round;
dc.DrawLine(p, new Point(75, 160), new Point(175, 150));
}
// Bookkeeping:
AddVisualChild(ghostVisual);
AddLogicalChild(ghostVisual);
}
// The two necessary overrides, implemented for the single Visual:
protected override int VisualChildrenCount
{
get { return 1; }
}
protected override Visual GetVisualChild(int index)
{
if (index != 0)
throw new ArgumentOutOfRangeException("index");
return ghostVisual;
}
}
三、Shape:
主要有以下六个类:
Rectangle:矩形类
Ellipse:椭圆类
Line:线类:
Polyline:有点确定的线类
Polygon:在Polyline基础上链接第一点到最后一点的类
Path:所有几何体都能够表示的类
例子:(Ghost Clip Art - Shapes.xaml)
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<Path Fill="Blue" Data="M 240,250
C 200,375 200,250 175,200
C 100,400 100,250 100,200
C 0,350 0,250 30,130
C 75,0 100,0 150,0
C 200,0 250,0 250,150 Z"/>
<Ellipse Fill="Black" Stroke="White" StrokeThickness="10"
Width="40" Height="40" Canvas.Left="75" Canvas.Top="75"/>
<Ellipse Fill="Black" Stroke="White" StrokeThickness="10"
Width="40" Height="40" Canvas.Left="150" Canvas.Top="85"/>
<Line X1="75" Y1="160" X2="175" Y2="150" StrokeStartLineCap="Round"
StrokeEndLineCap="Round" Stroke="Black" StrokeThickness="10"/>
</Canvas>
附加:一、Brush
WpF的元素几乎从来不和颜色直接交互,而是通过Brush 将颜色进行了封装,然后通过Brush来获取颜色。
在WPF中颜色笔刷分别是:SolidColorBrush,LinearGradientBrush,RadiaGralientBrush
1、 SolidColorBrush(可以隐式引用)就是讲某种颜色填充到目标区域。
2、 LinearGradientBrush在规定的点出插入颜色值:(做渐变色)
属性:StartPoint,EndPoint默认值为(0,0),(1,1)规定了 渐变的开始和结束位置。
3、 RadiaGralientBrush 与LinearGradientBrush公用GradientBrush基类
他是有一个起点成椭圆向外散发。
属性:GradientOrigin规定了渐变起始点,也就是椭圆内的一个点。 默认值为(0.5,0.5)
例子:(Brush.xaml)