关卡界面中个人信息随解锁关卡的移动(CocosCreator)

简介: 关卡界面中个人信息随解锁关卡的移动(CocosCreator)
推荐阅读:

1.功能描述

      在关卡很多的游戏里面,我们一般使用滑动来向玩家展示所有的关卡,为了清楚的让用户看到自己当前所在的关卡,通常会在该关卡旁显示用户头像或其他信息。

2.示例

      例如:在开心消消乐中,就采取了这种方式,在屏幕上上下滑动,可查看所有关卡,当玩家解锁的关卡发生变化后,会自动同步头像位置。
在这里插入图片描述
今天,就带大家了解一下该功能如何实现吧。

3.UI搭建

      首先。我们创建一个ScrollView,content下面是滑动可查看的内容,这里我们需要放上背景图片(假设背景图是由三张图片构成的sp1,sp2,sp3),关卡图标(这里假设有11个关卡),头像信息(userInfo)
在这里插入图片描述
注意:一定要保证关卡图标和头像信息的父物体为同一个,不然后面计算位置会出错。

4.代码实现

接下来,代码实现头像位置的同步
思想:头像的x=关卡图标的x;头像的y=关卡图标的y+关卡图标高+10(+10的目的是让头像和关卡图标中间留有一定的空隙)

    let x, y;
    if (index > -1) {
            //当前关卡存在
            x = self.levArr[index].position.x;
            y = self.levArr[index].position.y + self.levArr[index].getContentSize().height / 1.1;
        }
        self.uiRoot.userInfo.setPosition(x, y);

到此位置,我们就实现了关卡的上下滑动查看以及头像位置的同步了,是不是很简单呢~~

相关文章
|
2月前
|
监控 安全 数据安全/隐私保护
|
2月前
|
XML 数据可视化 Android开发
Android应用界面
Android应用界面中的布局和控件使用,包括相对布局、线性布局、表格布局、帧布局、扁平化布局等,以及AdapterView及其子类如ListView的使用方法和Adapter接口的应用。
35 0
Android应用界面
|
7月前
|
存储 数据可视化 索引
如何在游戏中实现一个关卡编辑器
如何在游戏中实现一个关卡编辑器
93 0
|
7月前
|
开发者 索引
如何在微信小游戏制作工具中实现关卡翻页功能?
如何在微信小游戏制作工具中实现关卡翻页功能?
88 0
|
缓存 开发工具 图形学
游戏开发实战教程(14):关卡编辑器的制作以及关卡分享功能的实现
上周在制作完闯关模式后,我有了在游戏中做一个关卡编辑器的想法,让玩家可以在游戏中制作自己的关卡进行挑战,甚至可以将自己制作的关卡与朋友进行分享。 原有的关卡编辑器是使用Unity做的,因为可以方便的进行文件的读取和写入,可以将设计好的关卡数据写入到文件中,然后在将文件中的数据导入到微信小游戏开发工具中。
335 0
|
缓存 小程序 开发工具
微信小游戏开发实战15-关卡编辑器的制作以及关卡分享功能的实现
本节主要内容有游戏中的关卡编辑器的实现思路以及如何利用分享功能将自己制作的关卡与好友分享。 如果你没有任何的游戏开发经验,欢迎阅读我的“人人都能做游戏”系列教程,它会手把手的教你做出自己的第一个小游戏。
189 0
|
存储 数据可视化 索引
聊聊关卡编辑器
关卡编辑器一直都是小蚂蚁游戏中的必备品,在做的所有关卡制的游戏中,我都增加了关卡编辑的功能。关卡编辑功能用的人多吗?说实话,不多。但是为什么要去做呢?因为我总觉得如果一个玩家能够参与到游戏的创作中,那么这个游戏对他来讲就会变得不一样。虽然做游戏跟玩游戏是完全两码事,而且几乎 99.99% 的游戏玩家都不会去做游戏。但是,关卡编辑器仍然能够给所有的玩家一个以极低的门槛体验游戏创作的机会,这大概就是我认为一定要去做这个东西的意义。
87 0
|
前端开发 开发者
网站都变灰了,几行代码可以实现
网站都变灰了,几行代码可以实现
138 0
网站都变灰了,几行代码可以实现
|
Web App开发 iOS开发
必备技能11:网页一键变灰
必备技能11:网页一键变灰
必备技能11:网页一键变灰
|
前端开发 JavaScript
两步实现在网站左下角实现音乐播放器弹窗听歌
两步实现在网站左下角实现音乐播放器弹窗听歌
178 0
两步实现在网站左下角实现音乐播放器弹窗听歌