图形与变换:Silverlight几何图形全解析
立即解锁
发布时间: 2025-08-26 01:38:32 阅读量: 2 订阅数: 14 


Silverlight 5编程与应用实例解析
### 图形与变换:Silverlight 几何图形全解析
#### 1. 几何图形基础
在图形绘制中,有两个重要概念:几何图形(Geometry)和路径(Path)。几何图形定义形状,而路径用于绘制该形状。Geometry 对象定义形状的坐标和大小等细节,Path 对象则提供用于绘制的 Stroke 和 Fill 画笔,同时还继承了 UIElement 基础设施的特性,如鼠标和键盘处理。
常见的几何图形类有 GeometryGroup 和 PathGeometry:
- **GeometryGroup**:可将任意数量的 Geometry 对象添加到单个路径中,使用 EvenOdd 或 Nonzero 填充规则来确定要填充的区域。
- **PathGeometry**:表示由弧、曲线和直线组成的更复杂图形,可以是开放或封闭的。
需要注意的是,有些在 WPF 中支持的几何图形类,在 Silverlight 中并不包含,例如 CombinedGeometry 和 StreamGeometry。
#### 2. 简单几何图形转换
LineGeometry、RectangleGeometry 和 EllipseGeometry 类分别对应 Line、Rectangle 和 Ellipse 形状。以下是具体的转换示例:
- **Rectangle 转换为 RectangleGeometry**:
```xml
<Rectangle Fill="Yellow" Stroke="Blue" Width="100" Height="50"></Rectangle>
```
转换为:
```xml
<Path Fill="Yellow" Stroke="Blue">
<Path.Data>
<RectangleGeometry Rect="0,0 100,50"></RectangleGeometry>
</Path.Data>
</Path>
```
区别在于 Rectangle 形状使用 Height 和 Width 值,而 RectangleGeometry 使用四个数字描述矩形的大小和位置,前两个数字是左上角的 X 和 Y 坐标,后两个数字是矩形的宽度和高度。此外,RectangleGeometry 类还包括 RadiusX 和 RadiusY 属性,可用于圆角处理。
- **Line 转换为 LineGeometry**:
```xml
<Line Stroke="Blue" X1="0" Y1="0" X2="10" Y2="100"></Line>
```
转换为:
```xml
<Path Stroke="Blue">
<Path.Data>
<LineGeometry StartPoint="0,0" EndPoint="10,100"></LineGeometry>
</Path.Data>
</Path>
```
- **Ellipse 转换为 EllipseGeometry**:
```xml
<Ellipse Fill="Yellow" Stroke="Blue" Width="100" Height="50"></Ellipse>
```
转换为:
```xml
<Path Fill="Yellow" Stroke="Blue">
<Path.Data>
<EllipseGeometry RadiusX="50" RadiusY="25" Center="50,25"></EllipseGeometry>
</Path.Data>
</Path>
```
这里两个半径值是宽度和高度值的一半,还可以使用 Center 属性偏移椭圆的位置。
#### 3. 使用 GeometryGroup 组合形状
组合几何图形的最简单方法是使用 GeometryGroup,并将其他 Geometry 派生对象嵌套在其中。例如,将椭圆放在正方形旁边:
```xml
<Path Fill="Yellow" Stroke="Blue" Margin="5" Canvas.Top="10" Canvas.Left="10">
<Path.Data>
<GeometryGroup>
<RectangleGeometry Rect="0,0 100,100"></RectangleGeometry>
<EllipseGeometry Center="150,50" RadiusX="35" RadiusY="25"></EllipseGeometry>
</GeometryGroup>
</Path.Data>
</Path>
```
这种方法的效果与提供两个 Path 元素(一个使用 RectangleGeometry,一个使用 EllipseGeometry)相同,但优点是减少了用户界面的开销。一般来说,使用较少元素和更复杂几何图形的页面比使用大量简单几何图形元素的页面性能更快。
不过,将几何图形组合在单个 Path 元素中也有缺点,即无法分别对不同形状进行事件处理,Path 元素会触发所有鼠标事件。而且,Silverlight 没有提供对几何图形进行命中测试的方法。
当形状相交时,GeometryGroup 的 FillRule 属性(EvenOdd 或 Nonzero)会决定填充哪些形状。例如,将椭圆放在正方形上:
```xml
<Path Fill="Yellow" Stroke="Blue" Margin="5" Canvas.Top="10" Canvas.Left="10">
<Path.Data>
<GeometryGroup>
<RectangleGeometry Rect="0,0 100,100"></RectangleGeometry>
<EllipseGeometry Center="50,5
```
0
0
复制全文
相关推荐









