用 Cocos Creator 做跑马灯效果！

● 效果预览

● 使用说明

简单的实现了功能，没有封装，如果有需要，可以参考代码，实现更多的功能，或者增加更多颜色文字内容的显示。

● UI布局

显示消息内容的节点，主要由：暗色背景、消息内容父节点、消息内容节点组成。暗色背景就是为了显示效果；消息内容父节点需要添加一个以子节点内容大小自动调节大小的 Layout 组件；消息内容节点，就使用 Label 组件，根据自己的需要，设置字体大小和颜色，可以根据需要，使用代码设置。

消息显示节点父节点，Layout 设置如下：

● 实现逻辑

1. 设置 Label 组件内容，可以根据需要设置字体大小和颜色；

2. 更新 Label 显示的实际宽度，更新 Layout 的大小，更新 Label 实际宽度，demo 使用的是2.3.3 版本，API 是 _forceUpdateRenderData，以往老版本是 _updateRenderData(true)，具体使用哪个 API，可以进对应版本的 Label 组件源码查看；

3. 判断 Layout 的宽度，如果小于屏幕宽度，直接显示，延迟后消失；

4. 如果Layout的宽度，超过屏幕宽度，启动定时器，修改 Layout 的位置，使 Layout 实现不断往左边移动的效果，当移动到最大值时消失。

● 获取代码

关注公众号，发送【跑马灯】获取完整代码下载地址，扫码关注公众号，获取更多技术分享和游戏源码！

往期小工推荐  

点击标题即可阅读

抽奖实现丨类似王者荣耀积分夺宝怎么实现 ？

资源压缩丨除了图片压缩，还有哪些方式 ？

美术工具丨谁说不会美术的程序员不能做UI了 ？