自这暑假接触Silverlight一来,个人认为自己提高不是很多但我认为还是和我的学习习惯有关系但现在Silverlight的教程少之又少Silverlight的朋友一点帮助.
这个作品本是我为我们的一个大学生团体做的一个产品演示www.yullion.com.当然啦也有截图呵呵~~
首先,第一步当然是新建一个Silverlight项目我就起名叫SLDemo了.好,我们来观察这个程序的特点,每个产品展示都是由边框,一副图片,和产品说明构成,点击它的时候,他会翻转展开,同时若有别的图片已经展开,则会使其收回.鼠标经过图片时,会有相应的交互.
好现在我们先来制作单个图片展板,为了便于说明,下文统称为展板.就是这个东西~~
右击SLDemo项目,添加新建项,选择Silverlight用户控件我们将它命名为ImgBoard,此时会生成一个新的ImgBoard.xaml文件右击它,点击在expression blend中打开.选择对象面板中的usercontrol,将它的宽和高设置为200*190,向面板中添加一个border,将其margin属性设置为0,0 ;ComerRadius属性设置为10;这只background属性为深灰色,borderbrush为白色,设置borderthickness属性为3,3,3这样我们就绘制出了面板的基本框架如上图中图,border只能包含一个子元素,因此我们需要添加一个grid空间,并将其margin设置为0,0接着添加一个image空间,一个textblock空间,分别命名为DImg,DInfo。先随便为image空间选择一张图片,以用来观看效果如上图右图.
好现在,我们来添加动画,选中layoutroot,点击情节面板的”+”号,弹出创建资源对话框,我们将其命名为StoryClose,此时弹出时间线面板,将时间线移到1秒钟的位置,在layoutroot的属性面板里,设置转换->旋转->y为80
单击对象面板layoutroot下面的projection在属性面板中设置easyfunction为quartic out单击播放测试动画.
接着我们添加渐变的动画,同样新建一个storyBord,命名为StoryTurnLight,在一秒处将border的background调亮,同样添加StoryTurnBlack
ImgBord页面设置完毕!
回到visualstudio2008，用expressionblend打开page页面,删除layoutroot添加canvas面板命名为mainCanvas,将其宽高属性设为914*290,回到visualstudio
到此位置,界面设计完毕.下面我们添加操作逻辑,打开page.cs
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。