原文:Blend4精选案例图解教程(一):丰富的形状(Shape)资源

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来实现,以下为完整代码:

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
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>

在实际项目中,不推荐使用代码的方式来进行大规模的效果设计,Blend的设计功能,VS无可替代;作为程序员将Blend和VS的结合使用才能带来高效的SilverLight应用程序开发。后续章节,将通过实例一步一步展现Blend的强大魅力!

Blend4精选案例图解教程(一):丰富的形状(Shape)资源的更多相关文章

  1. Blend4精选案例图解教程(三):一键拖拽

    原文:Blend4精选案例图解教程(三):一键拖拽 拖拽效果,常规实现方法是定义MoveLeftDwon.MoveLeftUp.MouseMove事件,在Blend的世界里,实现对象的拖拽,可以不写一 ...

  2. Blend4精选案例图解教程(四):请给我路径指引

    原文:Blend4精选案例图解教程(四):请给我路径指引 路径在界面设计中,可以起到很好的辅助作用,我常常使用它来对元素进行规则排列和非规则排列控制. 本次教程将演示,Blend中路径的常规用法. 1 ...

  3. Blend4精选案例图解教程(五):可视数据管理

    原文:Blend4精选案例图解教程(五):可视数据管理 应用程序中我们会经常需要操作数据,在程序设计之初示例数据一般都是手工添加,Blend4提供了非常方便的数据管理能力,包括丰富的数据类型和内置示例 ...

  4. Blend4精选案例图解教程(二):找张图片玩特效

    原文:Blend4精选案例图解教程(二):找张图片玩特效 Blend中的特效给了我们在处理资源时更多的想象空间,合理地运用特效往往会得到梦幻般效果,本次教程展示对图片应用特效的常规操作,当然特效不仅限 ...

  5. C#温故知新:《C#图解教程》读书笔记系列

    一.此书到底何方神圣? 本书是广受赞誉C#图解教程的最新版本.作者在本书中创造了一种全新的可视化叙述方式,以图文并茂的形式.朴实简洁的文字,并辅之以大量表格和代码示例,全面.直观地阐述了C#语言的各种 ...

  6. win8.1系统的安装方法详细图解教程

    win8.1系统的安装方法详细图解教程 关于win8.1系统的安装其实很简单 但是有的童鞋还不回 所以今天就抽空做了个详细的图解教程, 安装win8.1系统最好用U盘安装,这样最方便简单 而且系统安装 ...

  7. Zabbix3.x安装图解教程

    准备知识: Zabbix3.x比较之前的2.0界面有了很大的变化,但是安装部署过程与2.x基本完全一样. 1.Zabbix2.x安装图解教程 http://www.osyunwei.com/archi ...

  8. 《C#图解教程》读书笔记之一:C#和.NET框架

    本篇已收录至<C#图解教程>读书笔记目录贴,点击访问该目录可获取更多内容. 一.在.NET之前的编程世界 C#语言是在微软公司的.NET框架上开发程序而设计的,首先作者给大家纠正了一下C# ...

  9. 《C#图解教程》读书笔记之二:存储、类型和变量

    本篇已收录至<C#图解教程>读书笔记目录贴,点击访问该目录可获取更多内容. 一.类型初窥:掀起你的盖头来 (1)C程序是一组函数和数据类型,C++程序是一组函数和类,而C#程序是一组类型声 ...

随机推荐

  1. Android本地视频播放器开发--简易播放器原型

    在以前的基础上,将音视频进行合并,音频播放采用OpenSL ES,视频播放采用OpenGL ES2.0进行显示,这次的版本其中音频和视频是在同一个线程,会造成音频断断续续,后续会采用音频使用SDL,视 ...

  2. eclipse中我要同时看两个console

    eclipse中我要同时看两个console 有一个按钮“New Console View”,可以让你再建一个Console,还有一个按钮“Display Selected Console”,可以在两 ...

  3. 各种oracle10g下载地址(官网网页上好像找不到了)

    Oracle Database 10g Release 2 (10.2.0.1.0) Enterprise/Standard Edition for Microsoft Windows (32-bit ...

  4. Android开发之模板模式初探

    模板模式我认为在Android的开发中是最长用到的,基本是随处可见的,认识该模式,有助于我们对Android的源代码及框架有一个更深层次的认识.那什么是模板模式呢,模板模式就是定义一个基本框架,将当中 ...

  5. 佳文分享:CAP定理

    1976年6月4号,周5,在远离音乐会大厅的一个楼上的房间内,在位于Manchester的Lesser Free Trade Hall ,Sex Pistols 乐队(注:Sex Pistols的经理 ...

  6. A亚马逊WS网上系列讲座——怎么样AWS云平台上千万用户的应用建设

    用户选择云计算平台构建应用程序的一个重要原因是高弹性的云平台和可扩展性. 面向Internet应用程序通常需要支持用户使用大量,但要建立一个高度可扩展.具有一定的挑战,高度可用的应用程序,只有立足AW ...

  7. CF 518D(概率dp)

    传送门:Ilya and Escalator 题意:有n个人排队进车厢,每秒只能进一个人,而且第1个人进了后面的人才能进,第一个人每秒进入车厢的概率为p,不进的概率为1-p,求t秒后进入车厢总人数的数 ...

  8. 鸟哥Linux私房菜知识点总结6到7章

    近期翻看了一本<鸟哥的Linux私房菜>.这是一本基础的书,万丈高楼平地起.会的不多但能够学.这是我整理的一些知识点.尽管非常基础.希望和大家共同交流. 第6章主机规划与磁盘分区 1.在进 ...

  9. ZOJ 3635 Cinema in Akiba(线段树)

    Cinema in Akiba (CIA) is a small but very popular cinema in Akihabara. Every night the cinema is ful ...

  10. android 屏幕适配 课程笔记

    1 横竖屏切换:   文件名同样.  目录不同.   layout-port/ 代表竖屏   layout-land/ 代表横屏   layout/ 代表不论什么没有修饰符的layout目录.   终 ...