Blend4资源面板中内置了丰富的形状素材,为我们在构建程序时提供极大的方便。系统默认内置18种常用形状,通过其属性设置可以自定义出更多衍生形状,或者通过Direct Selection工具手动绘制,我们可以获得更自由的形状编辑。当然我们还可以登陆 Expression Gallery 下载别人分享的素材(似乎并不多),来扩充形状资源库。
因为形状的用法比较一致,重点是形状的不同属性设置,在此仅举一例来展示形状的常规用法。
1、 新建项目
2、 项目文件生成后,在Objects and Timeline面板中选中LayoutRoot
3、 然后在资源(Assets)面板中选中Shapes
4、 我们可以通过双击或者拖拽的方式添加一个形状,这里我们使用Star来作演示,Star已添加到LayoutRoot中,如图
5、 选择Selection工具
确认五角星处于被选择状态(如未选择可以通过点击选择)
6、 在属性(Properties)面板中,我们可以对形状进行一系列的属性设置,直到符合我们的需要。下面我们对五角星进行简单的修饰。
把颜色调为红色
去边框
OK,这样一个标准的五角星制作完成
7、 通过组合不同的属性设置,我们可以获得更多的效果:
手绘风格:
更改Fill属性为渐变效果
更改外观属性
如果你愿意,可以做出更多的效果!
以上效果我们也可以通过XAML来实现,以下为完整代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<UserControl
x:Class=
"ShapesDemo.MainPage"
Width=
"640"
Height=
"480"
>
<Grid x:Name=
"LayoutRoot"
Background=
"White"
>
<ed:RegularPolygon InnerRadius=
"0.702"
Margin=
"244,193,296,187"
PointCount=
"20"
Stretch=
"Fill"
Stroke=
"Black"
UseLayoutRounding=
"False"
StrokeThickness=
"0"
RenderTransformOrigin=
"0.5,0.5"
>
<ed:RegularPolygon.Fill>
<RadialGradientBrush>
<GradientStop Color=
"#FFFF0001"
Offset=
"0"
/>
<GradientStop Color=
"White"
Offset=
"1"
/>
</RadialGradientBrush>
</ed:RegularPolygon.Fill>
</ed:RegularPolygon>
</Grid>
</UserControl>
|
1
|
|
在实际项目中,不推荐使用代码的方式来进行大规模的效果设计,Blend的设计功能,VS无可替代;作为程序员将Blend和VS的结合使用才能带来高效的SilverLight应用程序开发。后续章节,将通过实例一步一步展现Blend的强大魅力!