零元学Expression Blend 4 - Chapter 18 用实例了解互动控制项「CheckBox」II
原文:零元学Expression Blend 4 - Chapter 18 用实例了解互动控制项「CheckBox」II
延续上一章的CheckBox教学，本章将以实作继续延伸更灵活的运用CheckBox。
看Blend如何把CheckBox变成飞碟!
?
延续上一章的CheckBox教学，本章将以实作继续延伸更灵活的运用CheckBox。
看Blend如何把CheckBox变成飞碟!
?
?
?
灵感取自经典动画!「怪兽大战外星人」!!!!!!
?
?
?
本章需要两张图片，一为幽浮、另一个是怪兽毛毛虫
(是的!它就是「怪兽大战外星人」里的毛毛虫怪，实在太可爱了>"<)
如果你手边没有类似的图片，又想跟着一步一步做的话，小猴子已经帮你准备好噜!!
请点此下载
?
01 置入Import Adobe Photoshop File
首先，请把小猴子已经帮你准备好的Photoshop档案置入Blend里面
该怎麽置入，先前已经有教过噜!
?
02 转换成控制项
接着，请把幽浮转换成控制项->CheckBox
右键Make Into Control->CheckBox(上一章有详细教学噜!)
?
转换完成後，请记得删除不需要用到的Content Presenter
?
03 制作幽浮光线
预先做好Checked状态时变化的光线
使用Pen绕着原本的光线，绘出一样的区域，并且调整Fill(忘记Pen吗?点我复习)
范例Fill颜色为：
0%???? #33FFF500?????? Alpha 20%
100% #A5FFFFFF?????? Alpha 65%
?
请记得在Normal时的Opacity调为 0%
?
04 Checked时的状态
Checked时光线亮起，所以在时间轴设定1秒时Opacity100%
?
05 回到一般编辑模式
离开样版编辑模式後，我们来设计怪兽毛虫的动画
这边请发挥您的创造力~
动画设计完成後，请置入ControlStoryboardAction->Trigger
记得这边最重要是EventName别设置错喔!
?
因为是配合CheckBox，触发条件就非MouseLeftButtonDown噜!而是选择Checked，才能配合刚刚我们所设置的CheckBox样版。
?
?
本篇范例的图片仅供教学之用，若有侵权请告知。
?
?
?
本篇的教学就到此。
?
?
?
(若有任何错误的地方，请各位前辈或同好能不吝指教，小女子都会虚心接受；若是你喜欢我的教学，请给我点鼓励，谢谢。)
?
?
一步一步迈向HIE之路
喜欢我文章请推我一下或给我个回应，你的鼓励会给我无限的动力喔!
若是您有其他问题或是特别需要，请在文章回应处留言，我会尽快回覆您
零元学Expression Blend 4 - Chapter 18 用实例了解互动控制项「CheckBox」II的更多相关文章
- 零元学Expression Blend 4 - Chapter 17 用实例了解互动控制项「CheckBox」I
原文:零元学Expression Blend 4 - Chapter 17 用实例了解互动控制项「CheckBox」I 本章将教大家如何运用CheckBox做实作上的变化:教你如何把CheckBox变 ...
- 零元学Expression Blend 4 - Chapter 16 用实例了解互动控制项「Button」II
原文:零元学Expression Blend 4 - Chapter 16 用实例了解互动控制项「Button」II 本章将教大家如何制作自己的Button,并以玻璃质感Button为实作案例. ? ...
- 零元学Expression Blend 4 - Chapter 15 用实例了解互动控制项「Button」I
原文:零元学Expression Blend 4 - Chapter 15 用实例了解互动控制项「Button」I 本章将教大家如何更改Button的预设Template,以及如何在Button内设置 ...
- 零元学Expression Blend 4 - Chapter 14 用实例了解布局容器系列-「Pathlistbox」II
原文:零元学Expression Blend 4 - Chapter 14 用实例了解布局容器系列-「Pathlistbox」II 本章将延续上一章的范例,步骤解析. 本章将延续上一章的范例,步骤解析 ...
- 零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」
原文:零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」 将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend ...
- 零元学Expression Blend 4 - Chapter 8 用实例了解布局容器系列-「Grid」
原文:零元学Expression Blend 4 - Chapter 8 用实例了解布局容器系列-「Grid」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的是Blend 4 里的 ...
- 零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」
原文:零元学Expression Blend 4 - Chapter 12 用实例了解布局容器系列-「Viewbox」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Bl ...
- 零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I
原文:零元学Expression Blend 4 - Chapter 13 用实例了解布局容器系列-「Pathlistbox」I 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局 ...
- 零元学Expression Blend 4 - Chapter 10 用实例了解布局容器系列-「StackPanel」
原文:零元学Expression Blend 4 - Chapter 10 用实例了解布局容器系列-「StackPanel」 本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器 ...
随机推荐
- Android 面试之横竖屏切换的Activity生命周期
public class EngineerJspActivity extends Activity { private static String Tag = "EngineerJspAct ...
- 三步学会用spring开发OSGI——（第一步：环境篇）
Spring-DM是什么 Spring-DM 指的是Spring Dynamic Modules. dm Server 是一个完全模块化部署的,基于OSGi的Java服务器,为运行企业Java应用和S ...
- 虚拟机的ip网络设置的选择
首先看一下vm的这几个设置 通过截图可以基本看到几个网络设置的区别,具体体现在虚拟机装好以后,网络设置会多出两个适配器,不同模式会分配不同区段的ip,需要固定时主要区段要求 所以总结一下 1.桥连,适 ...
- scala 通过apply创建类的对象
package cn.scala_base.oop.scalaobject; class Boy(name: String) { private var age: Int = 0; println(n ...
- 10 个免费的 C/C++ 集成开发环境
集成开发环境(IDE)可以给程序员提供很大的帮助.大多数的IDE包含编译器和解释器.例如微软的 Visual Studio 本身内置的编译器和解释就是很好的例子,Eclipse 是另一个很好的例子.鼓 ...
- wxWidgets初学者导引（2）——下载、安装wxWidgets
wxWidgets初学者导引全目录 PDF版及附件下载 1 前言2 下载.安装wxWidgets3 wxWidgets应用程序初体验4 wxWidgets学习资料及利用方法指导5 用wxSmith ...
- hdu 2037 这个夏天不AC
这个夏天不AC Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Su ...
- jquery即点击改
$(document).on("click",".sp",function(){ var brand_id=$(this).attr("valu ...
- QWidget之Alien与Native小记（果然是DirectUI的方式，QWidget居然提供了nativeParentWidget函数，而且可以动态设置native父窗口）good
在QWidget 之paint部分杂记提到了从Qt4.4开始,Alien Widget被引入.那么...这是什么东西呢,我们在使用中又可能会感受到什么东西? 用例子来说话似乎比用源码来说话来得容易,所 ...
- [Unity3D]Unity3D游戏开发Lua随着游戏的债券(在)
---------------------------------------------------------------------------------------------------- ...