cocos Creator 制作列表并添加监听

最新推荐文章于 2024-08-05 18:32:47 发布
最新推荐文章于 2024-08-05 18:32:47 发布
阅读量5.2k 收藏 2
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41783625/article/details/80240170
版权
本文介绍了如何使用Cocos Creator创建Scrollview列表，并添加点击事件监听。通过预制文件、设置Scrollview属性及编写绑定脚本来生成列表。同时讲解了creator中的emit和dispatchEvent两种事件触发方式及其注意事项，以及布局问题的解决方法。
摘要由CSDN通过智能技术生成

  需要的控件就是一个Scrollview,子项做成一个预制文件（在场景中编辑好，然后拖入下方的资源目录就可以生成一个预制文件）。

设置Scrollview的属性，每一个属性鼠标放上去会有对应的中文，根据需要设置就可以了，content这里将我们的一个layout拖进去，就可以实现拖动layout。creator的layout区别于studio，这里的layout功能真的是太强大了，自带列表属性。


然后写layout下的绑定脚本，在properties下添加预制子项的属性，

itemPrefab: {
default: null,
type:cc. Prefab
},

在creator中会看到

最低0.47元/天 解锁文章
eric_gg_m4
关注
CocosCreator | 列表组件ListComponent
一枚小工
09-25 2175
​获取源码 关注微信公众号，发送【列表】获取源码。 使用场景 游戏中经常会做列表类型的功能，例如游戏记录、排行榜，涉及到的数据很多，如果使用自带的ScrollView，会需要创建很多列表项组件，效率会很低，也很影响性能，由于工作中使用到的比较多，就封装了一个组件ListComponent，大致实现原理如下： 在列表可见区域内，创建列表项Unit，列表...
cocos 制作动态生成内容的列表_Creator 迷宫生成: DFS 与 BFS 算法实现
weixin_39523529的博客
11-29 277
前言：我的迷宫代码的实现受到 [liuyubobobo] 的影响。liuyubobobo 迷宫的实现：GUI 部分使用 java Swing，编程语言是 Java。**我的迷宫代码实现: **GUI 部分使用 Cocos Creator 游戏引擎, 编程语言是 TypeScript。Github 源码地址 :https://github.com/zhigang26/maze-generalizat...
Cocos Creator实现滑动到下一页
最新发布
weixin_63883707的博客
08-05 142
【代码】Cocos Creator实现滑动到下一页。
cocos creator 的一些组件监听类型
重启的专栏
07-13 4451
//系统的一些事件 module.exports = { ScrollView_To_Top : 'scroll-to-top',//滚动视图滚动到顶部边界事件 ScrollView_To_Bottom : 'scroll-to-bottom',//滚动视图滚动到底部边界事件 ScrollView_To_Left : 'scroll-to-left',//滚动视图滚动到左边...
cocos 制作动态生成内容的列表_EXCEL这样的动态图表，你会做吗？
weixin_39683598的博客
11-23 441
原创作者： 兰色幻想-赵志东 转自：Excel精英培训前言：今天兰色分享的内容有点多、干货多，同学们要有思想准备哦。动态图表一般有4种制作方法：表单控件 + 公式法ActiveX控件 + 公式法数据透视图+切片器法超级表 + 切片器法对于后两种切片器法，适合选择项较少的动态图表，比如下面只有5个选项。而当选择项比较多时，用控件制作动态图表更适合。如下图所示：(这也是兰色今天要带大家一起做的图表)上...
Cocos Creator 使用ScrollView与Layout 组合实现简单列表
#虾米生活 博客V
02-27 3231
关于 Cocos Creator Q: Cocos Creator 是游戏引擎吗？ A: 它是一个完整的游戏开发解决方案，包括了 cocos2d-x 引擎的 JavaScript 实现（不需要学习一个新的引擎），以及能让你更快速开发游戏所需要的各种图形界面工具 Q: Cocos Creator 的编辑器是什么样的？ A: 完全为引擎定制打造，包含从设计、开发、预览、调试到发布的整个工作流所需...
cocos creator为事件加上监听的两种处理方式
11-28
本篇文章将详细介绍两种在Cocos Creator中为事件添加监听的处理方式：一种是通过`cc.Class.prototype.on`方法，另一种是通过`cc.EventTarget.addListener`方法。 ### 1. `cc.Class.prototype.on` 方法 `cc.Class....
一个基于CocosCreator的List列表组件
08-11
在CocosCreator游戏引擎中，开发游戏界面时经常会用到列表组件(List)来展示大量数据。这个基于CocosCreator的List列表组件是一个高效且功能丰富的解决方案，尤其适用于处理动态加载和大数据量的情况。以下是该组件的...
cocos creator为按钮添加事件的三种骚操作
11-28
Cocos Creator提供了一个全局的`onNodeEvent`方法，允许我们监听所有节点（包括按钮）的事件。首先，我们需要在`cc.Class`的扩展类中注册这个方法： ```javascript cc.Class({ extends: cc.Component, ...
cocoscreator简易框架
03-04
"cocoscreator简易框架"则是基于CocosCreator 2.4.2版本构建的一个简化开发流程的框架，旨在为开发者提供一套包括声音管理、资源管理、事件处理在内的全方位解决方案，并附带了一系列实用工具类，极大地提高了开发...
ScrollView 的滚动事件监听
11-06
ScrollView 的滚动事件监听
cocos creator ScrollView列表优化
01-17
游戏中常见的列表，如：消息列表，商品列表，战绩列表等场景。item资源加载多了就需要考虑到性能优化，本例demo可供参考，适合新手！
cocos creator ListView
u012338130的专栏
02-15 1134
ListView.ts const {ccclass, property} = cc._decorator; /** * 通用 ListView 组件. * 能够显示垂直/横向ListView. 具体用法见Demo */ @ccclass export default class ListView extends cc.Component { @property(cc...
cocos creator FairyGUI虚拟列表的使用
weixin_44235418的博客
03-31 1047
this.ui.m_List.setVirtual();//开启虚拟列表 this.ui.m_List.itemRenderer = this.renderAchListItem.bind(this);//设置列表item的渲染函数 this.ui.m_List.itemProvider = this.getListItemResource.bind(this);//设置这个函数为列表的item提...
cocos creator基础-(二十二)滚动列表高级使用 动态加载数据
Gaos的BLOG
05-07 1502
动态加载列表 1: 每个记录是滚动列表里面的一个项，我们将整个列表分为3页，每页固定的项的数目; 2: 一个PAGE的项最好超过滚动列表的大小; 3: 课程案例, 创建一个滚动列表, 每一个page为一个页,共3个页，每个page有8个项; 3 * 8 = 24个项, 用1-100来模拟数据记录; 4: 编写代码往滚动列表里面加入所需要的项目; 往下加载示意图 auto scroll细...
CocosCreator之事件监听
搬代码的农民 的博客
03-14 4622
事件监听 在cocosCreator中，是以组件的方式开发的，事件也是基于组件来监听和触发 事件处理是在节点（cc.Node）中完成的。对于组件，可以通过访问节点 this.node 来注册和监听事件。监听事件可以 通过 this.node.on() 函数来注册， 早期的版本 中是通过EventManager来实现的。 添加一个事件监听的复合对象，然后绑定到第二个参数上 listenI...
CocosCreator之分层管理的ListView
~生命淡如水~
07-16 955
前言 进入公众号回复listview即可获得demo的git地址。 之前写的一篇文章《Creator之ScrollView那些事》中提到了官方Demo中提供的ListViewCtl,只是实现了纵向滑动，没有实现横向滑动。并且建议官方可以把功能做全然后放入组件库中供开发者使用。 然后有个牛逼大神说这个ListView不ok。要我对自己的公众号内容负责。我还以为有什么严重的bug，其实是打断了合批操作。对于官方提供的ListViewCtr的操作方式肯定会打断合批的 !不过对于一些简单的需求，比如我上次文章中
CocosCreator为ScrollView增加缓存机制实现无尽列表
iningwei的博客
05-27 1410
ScrollView下塞的子物体过多，必然造成卡顿，主流解决方案为采用缓存机制，动态刷新内容。 代码可以从我的github上下载 列表的滑动控制依然要借用CocosCreator自带的ScrollView组件。笔者这里暂时实现了上下方向的无尽列表。 列表的动态刷新和加载机制使用EndlessScrollView.ts 子item的具体显示逻辑放到ScrollItem.ts脚本中。建议新建一个类继承...
cocoscreator 添加按钮监听
09-01
在 Cocos Creator 中，我们可以通过两种方式来添加按钮的监听。一种是通过代码实现，另一种是通过编辑器实现。 如果我们选择通过代码实现，首先需要获取按钮节点的引用，可以使用 `cc.find` 或者 `cc.Node.getChildByName` 等方法获取按钮节点。然后，我们可以使用 `cc.Node.on` 方法来添加按钮的触摸事件监听器。例如，我们可以监听按钮的 `touchstart` 事件，当按钮被触摸时，该事件会被触发。 以下是通过代码实现按钮监听的示例： ``` cc.Class({ extends: cc.Component, properties: { btnNode: cc.Node, }, onLoad() { this.btnNode.on('touchstart', this.onButtonClick, this); }, onButtonClick() { // 在此处编写按钮被点击后的逻辑代码 console.log('按钮被点击了！'); }, onDestroy() { this.btnNode.off('touchstart', this.onButtonClick, this); }, }); ``` 另一种方式是通过编辑器实现。在 Cocos Creator 的编辑器中，我们可以直接选中按钮节点，在 `Properties` 面板中选择 `Button` 组件，然后在 `Events` 面板中添加相应的触摸事件回调函数。当按钮被触摸时，回调函数会被自动调用。 以上就是在 Cocos Creator 中添加按钮监听的两种方式。无论是通过代码实现还是通过编辑器实现，都可以让我们方便地为按钮添加相应的触摸事件监听器。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值