(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处.

如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;)


一个内容不错的游戏也要一个好的包装.玩家进入游戏时第一眼看到的是将是游戏的主界面,如何生动的展示一个具有吸引力的界面就是本篇的主题.当然这里无法和商业游戏的主界面相比的,只是展示一下不用写什么代码,也可以把主界面做的比较活泼.

在主界面上添加静态元素

打开SpriteBuilder中的MainScene.ccb文件,将原有控件统统删掉,这时场景变得黑漆漆的一片.不要紧,我们马上给它加一个可爱的背景图案,将bg.png拖入场景中:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

按照以下布局,从控件库中将对应控件拖入场景,效果如下:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

从上到下依次有4个元素,分别是:游戏名,版本号,开始按钮和小标题.下面我们看如何让它们生动起来 ;)

动画效果一:元素归位

首先将默认的Timeline时长设置为5秒,启用自动播放:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

分别设置游戏名标签的Position和Skew(扭曲)动画如下所示:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

然后在对应合适的时间点,分别设置好后面3个元素的动画,依次为:Visible,Position和Opacity:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

我们可以播放并不断调整效果,最终的效果如下:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

动画效果二:元素变色

新建一个动画集名称为Color Loop:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

时长也设置为5秒,我们设置好游戏名和小标题标签的渐变色效果,同时将线性渐变改为非线性渐变:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

完成效果如下:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

现在发布项目,打开Xcode,编译运行app,主界面效果显示如下:

(NO.00004)iOS实现打砖块游戏(二):实现游戏主界面动画

就这样一个简单的主界面动画效果完成了,我们还没有写一行代码哦 ;)

上一篇:springboot配置redis


下一篇:freeRTOS中文实用教程4--资源管理概述