画刷
画刷(Brush)用于为图形元素填充颜色。在XAML中,画刷有许多属性,其中较常使用的是Fill属性和Stroke属性,Fill用于填充图形的背景色,而Stroke用于设置图形的线条颜色。
在实际应用中,可以采用不同的填充方式填充背景色或设置线条颜色,以达到不同的视觉效果。这里我们简单介绍一下纯色画刷(SolidColorBrush)和线性渐变画刷(LinearGradientBrush),有关画刷的详细内容和图形绘制在后面章节中会单独介绍。
(1)纯色画刷
纯色画刷(SolidColorBrush)是画刷中最基本的填充方式,用来给元素填充某种单一纯色。在XAML语法中,SolidColorBrush元素的定义格式如下所示:
<SolidColorBrush Color="ColorName"/>
-or-
<SolidColorBrush Color="#RGB"/>
-or-
<SolidColorBrush Color="#RRGGBB"/>
其中,ColorName指的是颜色名称;RGB表示长度为3个字符的十六进制值,第一个字符指定颜色的R值,第二个字符指定G值,第三个字符指定B值,如#00F;RRGGBB表示长度为6个字符的十六进制值,用前两个字符指定颜色的R值,中间两个字符指定G值,最后两个字符指定B值,如#0000FF。
例如,在向一个页面中添加一个矩形时,在Rectangle.Fill属性元素中定义SolidColorBrush元素并通过Color属性设置矩形的填充色为红色,相应的XAML代码片段如下所示:
<Rectangle>
<Rectangle.Fill>
<SolidColorBrush Color="Red"/>
</Rectangle.Fill>
</Rectangle>
-或-
<Rectangle>
<Rectangle.Fill>
<SolidColorBrush Color="#F00"/>
</Rectangle.Fill>
</Rectangle>
-或-
<Rectangle>
<Rectangle.Fill>
<SolidColorBrush Color="#FF0000"/>
</Rectangle.Fill>
</Rectangle>
(2)线性渐变画刷
线性渐变就是沿着一条直线定义不同颜色之间的渐变,该直线的起点和终点分别由画刷的StartPoint属性和EndPoint属性设置。之后,线性渐变画刷就沿着这条直线来对图形元素填充颜色,展现颜色渐变的效果。
在XAML语法中,LinearGradientBrush元素的定义格式如下所示:
<LinearGradientBrush StartPoint="X,Y" EndPoint="X,Y">
<!--define GradientStops-->
<GradientStop Color="ColorValue" Offset="OffsetValue"/>
……
</LinearGradientBrush>
其中,StartPoint属性用于设置渐变线的起始点坐标,EndPoint属性用于设置终点坐标;X是二维坐标轴中的横坐标值,Y是纵坐标值;GradientStop是渐变画刷的渐变点对象,Color属性用于设置渐变点的颜色,Offset属性用于设置渐变点的开始位置,是一个数值类型。
在默认情况下,线性渐变是沿主对角线方向进行的,起点是被绘制区域的左上角点,终点是被绘制区域的右下角点。
3.3.4 动画
快速而流畅的动画能够为应用程序注入活力,在Windows 8中可以发现,动画已与用户体验完美融合,成为用户体验中不可或缺的一部分。例如,对于开始屏中的项目,当把鼠标放到某个应用程序的图标上时,相应的图标会凸显;当鼠标离开时,应用程序的图标又会还原成原状。当启动开始屏中的某个项目时,也会产生翻转的动画效果。因此,合理的使用动画效果能够让用户更直观地了解某一特定操作的结果,这种视觉反馈将使用户对应用程序的响应程度充满信心。
在XAML中,StoryBoard(演示图板)是动画的核心内容,通过StoryBoard可以定义各种动画效果,如插值动画、关键帧动画等。使用StoryBoard定义动画的语法格式如下所示:
<Storyboard ...>
<AnimationTypeName Storyboard.TargetName="objectName" Storyboard.TargetProperty="PropertyName" ...>
</AnimationTypeName>
</Storyboard>
其中,AnimationTypeName表示动画类型,如插值动画中的DoubleAnimation和ColorAnimation,DoubleAnimation动画可以作用于界面元素的Double类型的属性,而ColorAnimation动画可以作用于元素的Color类型的属性。无论是定义哪种类型的动画,都需要通过Storyboard的TargetName属性指定要使用动画的元素,通过TargetProperty属性设置在元素的哪个属性上使用动画,除了这两个属性之外,针对不同类型的动画还需要设置其他的属性。
有关各种动画类型的详细内容,将在第10章具体介绍,在此就不多细讲了。