前言

Cocos2d-x 中实现加载动画可以提高用户体验和应用程序的交互性。加载动画通常会显示在网络通信或资源加载等操作期间,以告知用户当前操作正在进行中。

可惜的是 Cocos2d 并没有提供这种操作,不像 Android 提供了 ProgressDialog

所以今天就来自己实现一个。

显示

加载动画其实也挺简单的,就是让一张圆形的图片一直做旋转的动画即可。

Cocos2d 中我们通过图片创建一个圆形的精灵,然后使用 Rotate 创建旋转动画,并使用 RepeatForever 对旋转动画进行处理,使得旋转动画不会停下来。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
auto visibleSize = Director::getInstance()->getVisibleSize();
auto origin = Director::getInstance()->getVisibleOrigin();

auto sprite = Sprite::create("loading.png");
auto rotate = RotateBy::create(1.0f, 360.0f);
auto repeat = RepeatForever::create(rotate);
sprite->setPosition(Vec2(origin.x + visibleSize.width / 2, origin.y + visibleSize.height / 2));
sprite->runAction(repeat);

this->addChild(sprite);

隐藏

当数据加载完成后,我们需要将加载动画隐藏起来,让用户可以继续使用游戏或者应用程序。

1
2
sprite->setVisible(false); // 隐藏Sprite
this->removeChild(sprite); // 删除Sprite

总结

通过上面的介绍,我们了解了如何在 Cocos2d 中实现一个简单的加载动画。总体来说,实现加载动画的关键在于使用 SpriteAction 来创建旋转动画,然后使用 RepeatForever 让动画循环播放。同时,我们还需要注意加载动画的展示时间和隐藏方式,避免影响用户体验。