Silverlight学习之路（二）
三、Canvas对象
该开始基础知识了
Canvas是负责silverlight中形状和控件的定位的一个容器，任何XAML中必须至少有一个
canvas
<Canvas
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Ellipse
Canvas.ZIndex="1"
Canvas.Left="95" Canvas.Top="95"
Height="200" Width="200"
Stroke="Black" StrokeThickness="10" Fill="Lime" />
</Canvas>
1、在Canvas中添加形状，只需在Canvas标签内加入形状标签就可以了（好像废话）
2、定位形状，在形状标签里，声明Canvas.Left和Canvas.Top来定位形状在Canvas中的位置。
3、Z-Order，用于设置形状的层的上下，即Canvas.ZIndex，值越大越靠上
4、形状的宽和高，在形状的标签中声明Width和Height；Canvas的宽高须在Canvas标签中设
置，其他相同
5、在Canvas中嵌入子Canvas，和嵌入形状相同
6、设置Canvas背景色，在Canvas标签中设置Background属性
四、设计和喷涂
1、基本形状
Silverlight的基本形状包括：Ellipse、Rectangle、Line
设计Ellipse时，Width代表水平直径，Height代表垂直直径
设计Rectangle时，除了Width和Height之外，还可以使用RadiusX和RadiusY设置其圆角
设计Line时，需要使用X1, X2, Y1, Y2来定义两个端点
2、其他形状
除了上述的3个基本形状外，Silverlight还提供了几个其他的形状
Polygon（多边形），Polyline（与Polygon的区别是不一定闭合），Path
对Polygon和Polyline设置其形状时，须给定Points属性，即
<Polyline Points="150, 150 150, 250 250, 250 250, 150"
Stroke="Black" StrokeThickness="10"/>
<Polygon Points="10,10 10,110 110,110 110,10"
Stroke="Black" StrokeThickness="10" Fill="LightBlue"/>
Path是针对复杂形状，如曲线，弧线等，需要设置其Data属性，具体设置语法，以后再学习
3、用brush进行喷涂
Strock指的是边框
Fill指的是的填充
Silverlight提供了5中brush：
a. SolidColorBrush 用于填充单一色
有4中方法来进行设置：
使用颜色名称
<Ellipse Height="90" Width="90" Canvas.Left="10" Canvas.Top="10"
Fill="black"/> <!-- SolidColorBrush by color name. -->
使用6位颜色代码
<Ellipse Height="90" Width="90" Canvas.Left="110" Canvas.Top="10"
Fill="#000000"/> <!-- SolidColorBrush by 6-digit hexadecimal notation. -->
使用8位颜色代码
<Ellipse Height="90" Width="90" Canvas.Left="10" Canvas.Top="110"
Fill="#ff000000"/> <!-- SolidColorBrush by 8-digit hexadecimal notation. -->
显式创建并设置Color属性
<Ellipse Height="90" Width="90" Canvas.Left="110" Canvas.Top="110">
<Ellipse.Fill>
<!-- SolidColorBrush by object element syntax. -->
<SolidColorBrush Color="Black"/>
</Ellipse.Fill>
</Ellipse>
b. LinearGradientBrush
c. RadialGradientBrush
使用以上两种brush设计渐变色
线性渐变：
<Rectangle Width="140" Height="70" Canvas.Left="155" Canvas.Top="10">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
StartPoint指的是起始点的位置，EndPoint指的是结束点的位置
Offset范围是0.0-1.0，指的是渐变范围
用图解释最清楚了
放射渐变：
<Rectangle Width="140" Height="70" Canvas.Left="155" Canvas.Top="110">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="1,0">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
GradientOrigin指的是放射源的位置，即中心点的位置
d. ImageBrush
用于打印图片的brush
<Rectangle Height="180" Width="90" Canvas.Left="110" Canvas.Top="10"
Stroke="Black" StrokeThickness="1">
<Rectangle.Fill>
<ImageBrush ImageSource="star.png" Stretch="Uniform"/>
</Rectangle.Fill>
</Rectangle>
ImageSource用于设置图片位置，Stretch设置图片方式，Uniform是使用原始图片大小
e. VideoBrush
该开始基础知识了
Canvas是负责silverlight中形状和控件的定位的一个容器，任何XAML中必须至少有一个
canvas
<Canvas
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Ellipse
Canvas.ZIndex="1"
Canvas.Left="95" Canvas.Top="95"
Height="200" Width="200"
Stroke="Black" StrokeThickness="10" Fill="Lime" />
</Canvas>
1、在Canvas中添加形状，只需在Canvas标签内加入形状标签就可以了（好像废话）
2、定位形状，在形状标签里，声明Canvas.Left和Canvas.Top来定位形状在Canvas中的位置。
3、Z-Order，用于设置形状的层的上下，即Canvas.ZIndex，值越大越靠上
4、形状的宽和高，在形状的标签中声明Width和Height；Canvas的宽高须在Canvas标签中设
置，其他相同
5、在Canvas中嵌入子Canvas，和嵌入形状相同
6、设置Canvas背景色，在Canvas标签中设置Background属性
四、设计和喷涂
1、基本形状
Silverlight的基本形状包括：Ellipse、Rectangle、Line
设计Ellipse时，Width代表水平直径，Height代表垂直直径
设计Rectangle时，除了Width和Height之外，还可以使用RadiusX和RadiusY设置其圆角
设计Line时，需要使用X1, X2, Y1, Y2来定义两个端点
2、其他形状
除了上述的3个基本形状外，Silverlight还提供了几个其他的形状
Polygon（多边形），Polyline（与Polygon的区别是不一定闭合），Path
对Polygon和Polyline设置其形状时，须给定Points属性，即
<Polyline Points="150, 150 150, 250 250, 250 250, 150"
Stroke="Black" StrokeThickness="10"/>
<Polygon Points="10,10 10,110 110,110 110,10"
Stroke="Black" StrokeThickness="10" Fill="LightBlue"/>
Path是针对复杂形状，如曲线，弧线等，需要设置其Data属性，具体设置语法，以后再学习
3、用brush进行喷涂
Strock指的是边框
Fill指的是的填充
Silverlight提供了5中brush：
a. SolidColorBrush 用于填充单一色
有4中方法来进行设置：
使用颜色名称
<Ellipse Height="90" Width="90" Canvas.Left="10" Canvas.Top="10"
Fill="black"/> <!-- SolidColorBrush by color name. -->
使用6位颜色代码
<Ellipse Height="90" Width="90" Canvas.Left="110" Canvas.Top="10"
Fill="#000000"/> <!-- SolidColorBrush by 6-digit hexadecimal notation. -->
使用8位颜色代码
<Ellipse Height="90" Width="90" Canvas.Left="10" Canvas.Top="110"
Fill="#ff000000"/> <!-- SolidColorBrush by 8-digit hexadecimal notation. -->
显式创建并设置Color属性
<Ellipse Height="90" Width="90" Canvas.Left="110" Canvas.Top="110">
<Ellipse.Fill>
<!-- SolidColorBrush by object element syntax. -->
<SolidColorBrush Color="Black"/>
</Ellipse.Fill>
</Ellipse>
b. LinearGradientBrush
c. RadialGradientBrush
使用以上两种brush设计渐变色
线性渐变：
<Rectangle Width="140" Height="70" Canvas.Left="155" Canvas.Top="10">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
StartPoint指的是起始点的位置，EndPoint指的是结束点的位置
Offset范围是0.0-1.0，指的是渐变范围
用图解释最清楚了
放射渐变：
<Rectangle Width="140" Height="70" Canvas.Left="155" Canvas.Top="110">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="1,0">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1.0" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
GradientOrigin指的是放射源的位置，即中心点的位置
d. ImageBrush
用于打印图片的brush
<Rectangle Height="180" Width="90" Canvas.Left="110" Canvas.Top="10"
Stroke="Black" StrokeThickness="1">
<Rectangle.Fill>
<ImageBrush ImageSource="star.png" Stretch="Uniform"/>
</Rectangle.Fill>
</Rectangle>
ImageSource用于设置图片位置，Stretch设置图片方式，Uniform是使用原始图片大小
e. VideoBrush
