【Cocos新手入门】 cocos creator 制作 select下拉框且可以选择获取选中参数数值的方法_cocos 下拉列表-程序员宅基地

技术标签： cocos2d 游戏游戏开发 javascript

本篇文章主要讲解使用cocos creator 制作 select下拉框且可以选择获取选中参数数值的方法。
作者：任聪聪
日期：2023年2月7日
cocos 引擎版本：2.4.3

在我们实现select框的时候，我们可以通过按钮+显示隐藏某个元素来达成这个目标，如下是整体的select框自定义及传参获取的方法教程。

效果展示

可以看到这是一个非常简单流畅的select下拉框。
在这里插入图片描述

实现方式

步骤一、使用creator 在按钮下面制作一个select box的空节点，然后刻画出一个下拉框。
在这里插入图片描述

tips：要使用layout布局进行刻画，设置如下（box层级）。
在这里插入图片描述
tips: 不要忘记了在box中填充label类型的item文本，用它来模拟select中的option对象。

整体结构说明：

-box
	--- item
	--- item
	--- item
	--- item
	--- item
	--- item
	--- item

步骤二、item的设置参数，给每个item设置不同的值
在这里插入图片描述
tips：这里需要绑定button，才可以实现点击传值的效果。

说明：这里绑定的事件传递的是字符串，代码层次是通过转换成数组来实现获取参数的。

步骤三、绑定指定的box及label，并默认隐藏box（将opacity设置为0）

在代码中声明：

    @property(cc.Label)
    color_select_box_lab: cc.Label = null;

    @property(cc.Node)
    color_select_box : cc.Node=null ;

隐藏box。
在这里插入图片描述
步骤三、拖拽绑定组件对象：

步骤四、给下拉框按钮绑定显示事件

通过事件显示box：

	showSelect(){
    
				if(that.color_select_box.opacity==0){
    
                    that.color_select_box.zIndex = 100;
                    that.color_select_box.opacity = 255;
                }else{
    
                    that.color_select_box.zIndex = 0;
                    that.color_select_box.opacity = 0;
                }
      }

步骤五、给item绑定按钮
在这里插入图片描述
获取参数代码：

itemClicked(e,v){
    
		//v为传递的参数
        cc.log(e,v)
        let t_arr = v.split(',');
        //修改按钮的label文本
           that.color_select_box_lab.string = t_arr[1].toString();
        //隐藏select
                that.color_select_box.zIndex = 0;
                that.color_select_box.opacity = 0;
        }

【Cocos新手入门】 cocos creator 制作 scrollview 实现子节点自适应增加content高度的方法
 【Cocos新手入门】使用 cocos creator 创建单行文本输入框及多行文本输入框
 【Cocos新手入门】cocos creator操作 canvas绑定脚本及通过代码操作label组件变化的方法

本文链接：https://blog.csdn.net/hj960511/article/details/128916776

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

css多列布局划分为4列,CSS3 column多列布局介绍-程序员宅基地

文章浏览阅读1.1k次。CSS3提供了个新属性columns用于多列布局。在这之前，有些大家习以为常的排版，要用CSS动态实现其实是比较困难的。如竖版报纸在我不知columns这属性之前，第一反应是：这有何难，多弄几个并列的div不就行了？但仔细想想确实很难实现，因为内容是动态的。搞几个div容易，但每个div内放多少文字呢？一篇文章该在哪行哪段剪切进不同的div内呢？你肯定不愿意为每一段文字，都在特定的地方插入div标..._css 四列

蓝桥杯凑算式（第七届第三题）_(如果显示有问题,可以参见【图1.jpg】) 这个算式中a~i代表1~9的数字,不同的字-程序员宅基地

文章浏览阅读135次。凑算式 B DEFA + --- + ------- = 10 C GHI （如果显示有问题，可以参见【图1.jpg】）这个算式中A~I代表1~9的数字，不同的字母代表不同的数字。比如：6+8/3+952/714 就是一种解法，5+3/1+972/486 是另一种解法。这个算式一共有多少种解法？注..._(如果显示有问题,可以参见【图1.jpg】) 这个算式中a~i代表1~9的数字,不同的字

浅析缓冲区溢出漏洞的利用与Shellcode编写_可利用该漏洞使缓冲区溢出并在系统上执行任意代码-程序员宅基地

文章浏览阅读5.4k次，点赞27次，收藏88次。文章目录前言前言缓冲区是内存中存放数据的地方。在程序试图将数据放到及其内存中的某一个位置的时候，因为没有足够的空间就会发生缓冲区溢出。缓冲区溢出就好比是将十升水放进只有五升容量的桶里。很显然，一旦容器满了，余下的部分就会溢出在地板上，弄得一团糟。缓冲区溢出漏洞是指在程序试图将数据放到及其内存中的某一个位置的时候，因为没有足够的空间就会发生缓冲区溢出的现象。..._可利用该漏洞使缓冲区溢出并在系统上执行任意代码

ts中常用的几个工具类_ts 工具类-程序员宅基地

文章浏览阅读3.8k次，点赞3次，收藏19次。TypeScript常用的几个工具类_ts 工具类

c语言编辑数学公式,用C语言编个公式数学公式求助-程序员宅基地

文章浏览阅读258次。满意答案zsao11252018.11.08采纳率：54%等级：12已帮助：17631人函数名及解释：int abs(int i) 返回整型参数i的绝对值double cabs(struct complex znum) 返回复数znum的绝对值double fabs(double x) 返回双精度参数x的绝对值long labs(long n) 返回长整型参数n的绝对值 double ex..._c语言用一行语句替代一个公式的函数

Centos8窗口没有最大化最小化按钮怎么办_centos窗口没有关闭,最小化怎么办-程序员宅基地

文章浏览阅读4.6k次，点赞6次，收藏12次。如下图所示，安装centos8系统后，发现所有的窗口程序没有最大化和最小化按钮，只有一个关闭按钮。解决此问题，先点【活动】-【终端】，单击运行终端。输入并执行如下命令安装gnome-tweakssudo yum install gnome-tweaks -y安装完成，在终端中输入：gnome-tweaks，打开【优化】对话框。左侧点【窗口】，右侧找到【最大化】和【最小化】选项。将【最大化】和【最小化】的开关按钮打开，退出设置即可。之后所有的窗口就不只有关闭按钮了。转载自：ht_centos窗口没有关闭,最小化怎么办

随便推点

StarCCM+引入第三方库，找不到的错误_starccm库朗数在哪里-程序员宅基地

文章浏览阅读187次。StarCCM+里自定义的宏文件是在Star里编译运行的，第三方库需要单独引用。工具->options->环境->用户宏类路径。点进去以后，一定要注意多个jar包是写在一行的，不要主动换行。_starccm库朗数在哪里

pandas操作Excel-数据部分_pandas处理excel数据-程序员宅基地

文章浏览阅读268次。通过Series.str.split()方法分割读取的dataframe，调用参数expand展开，生成两个Series存到fn里，n表示保留的Series个数，默认为-1全部保留。temp = df[['Test_1', 'Test_2', 'Test_3']]，用列表做索引值，可以截取原dataframe形成新的dataframe。都是用的pd.read_csv()方法，读取TXT要设置分隔符sep=‘|’，读取tsv要设置分隔符sep='\t'_pandas处理excel数据