Silverlight 游戏开发小技巧：技能冷却效果1（Cooldown）

到目前为止，大家都非常推崇魔兽的技能冷却效果，就是这样的，我记得群里还对这个效果展开过探讨，其实实现起来并不难，关键是思路是否正确，这部分我得谢谢猪笨无罪，是他先想出的解决方案，他不愿意写博客，也就只好我来代劳了，哈哈，后面提供源代码和预览，不要错过。

那么我们开始制作，第一步建立工程，如果你是在自己的项目中应用，直接进入第二步创建图标，

把一张图标文件放进来，这样看起来更加直观，此时将SkillIcon控件的宽和高都设定成64x64，这里非常重要，我设定为64宽高是为了方便展示，你需要依据自己的ICON尺寸做修改。

然后中间切分LayoutRoot，

添加两个Grid到控件LayoutRoot中，各自为一半，效果如下，为了方便演示，我填充了颜色做区分

设置两个Rectangle分别对齐到两个Grid上，大小位置都是一样，然后分别使用Make Clipping Path对自己对应的Gird裁剪。

此时你会发现，这时所有内部的对象都是被裁剪的效果，然后我们可以利用这个特点制作冷却的动画。

现在可以向两个Grid添加一个Rectangle，将Rectangle的填充颜色设置成为黑色，不透明度为30%，并且将LayoutRoot的背景设置为图像画笔，将图标图像加入。

其实这里有个细节，Rectangle的填充色其实可以直接带上透明效果，只是将ARGB的A修改即可，按照我们的实际测试，不透明度尽量减少，而使用颜色的A值性能消耗更少。

上面的图中就是一个Grid当中加了Rectangle，请注意Rectangle的参数，只需要将边距设置为-32即可，大小是图标本身的2倍，因为我们要利用它的旋转产生冷却效果。

第二个Rectangle的对齐方式和第一个有所不同，都做好了以后，就可以做动画了。

在那之前，需要将旋转的中心点设置的图标控件的中心位置，由于是分别左边和靠右边，就需要分别处理，

先选择右边的Rectangle，将变换中的中心点为之设置为0，0.5，然后旋转一下看看，是否有感觉了呢？

好了，做一个故事板动画，然后在指定的时间上，让这个矩形旋转180度

在左边的矩形上制作一个动画，也是旋转180度，但是需要注意的是，这个动画要在第一个播放完毕之后播放，所以关键帧的位置请留意。

在调动画的时候，我们可能还要做一些细致的工作，比如显示和消失的关系，旋转之后的容错问题，所以最后的时间线可能是这样的：

好了，一个动画出来了，然后我们看看效果，源代码下载地址如下：点击直接下载

Silverlight 游戏开发小技巧：技能冷却效果1（Cooldown）相关推荐

Silverlight 游戏开发小技巧：动感小菜单2
Silverlight 游戏开发小技巧:动感小菜单2 动感小菜单其实是想模仿Apple的菜单按钮设计制作,但是画虎不成反类犬,看起来有点别扭,昨天各位园友提了这方面的建议,感觉太硬如果加入动画可能更好 ...
一起谈.NET技术，Silverlight 游戏开发小技巧：动感小菜单
网页应用受限于自身的浏览器范畴,不能把华丽效果完全展示,正是因为如此,在网页上诞生了无数绚丽的设计,虽然动感程度和桌面应用无法比拟,但是在UI上却下足了功夫,用户体验可以说无以伦比,比如说小小的菜单, ...
Silverlight 游戏开发小技巧：轨迹跟随效果
Silverlight 游戏开发小技巧:轨迹跟随效果我们通常在游戏中有各种各样的粒子效果,其中有一种就是跟随鼠标发生的轨迹动画,在鼠标经过的地方会产生一些特效,这种方式我们在粒子当中经常使用,本篇使 ...
Silverlight 游戏开发小技巧：实现街霸4的选人界面
Silverlight 游戏开发小技巧:实现街霸4的选人界面上一篇只是一个引子,用来说明Projection的基本操作,游戏研发都是用这些小的基本功能慢慢组合出来,其实这一篇仍然是Projectio ...
Silverlight 游戏开发小技巧：扇形排列元素
Silverlight 游戏开发小技巧:扇形排列元素斗地主风靡了大江南北,在春晚都做免费性推广,棋牌游戏平台几乎将其作为标配,但是牌类游戏总是一成不变的样子--横向排列,如果扇形排列应该更加符合真实 ...
Silverlight 游戏开发小技巧：角色升级特效
这次我们将使用Projection完成一些有趣的RPG游戏中常用的特效:升级和传送点特效,我们不需要请特效师制作复杂绚丽的特效,而是只需要他们提供关键的几张图片或者设计样式,如果了您有本领教会他们使用 ...
Silverlight 游戏开发小技巧：星球大战字幕效果
各位科幻迷可能对星球大战的字幕效果印象深刻,这个电影字幕表现手法曾经风靡大小美国影片,甚至超人影片和电视也曾经用此来做开场和结尾字幕,今天我就将这个效果在blend里面制作技巧告诉大家,下面是星球大战 ...
Silverlight 游戏开发小技巧：昼夜交替动画
记得在WP7上玩一个游戏有段动画很有趣,是背景在进行昼夜交替,一会儿白天太阳出来白天了,一会儿月亮蹦出来夜晚了,在以前做C++程序的时候曾经实现过类似的效果,今天早上移植了一下到Silverlight ...
一起谈.NET技术，Silverlight 游戏开发小技巧：实现街霸4的选人界面
上一篇只是一个引子,用来说明Projection的基本操作,游戏研发都是用这些小的基本功能慢慢组合出来,其实这一篇仍然是Projection,但是我们将会做一个比较复杂的应用使用silverlight ...

Silverlight 游戏开发小技巧：技能冷却效果1（Cooldown）

Silverlight 游戏开发小技巧：技能冷却效果1（Cooldown）相关推荐

最新文章

热门文章