Cocos Creator 系统学习笔记(九)cc.Button的使用

 1 //cc.Button组件使用详解
 2 /*1:添加按钮的方法
 3     (1)直接创建带Button组件的节点,可以;
 4     (2) 先创建节点,再添加组件;
 5     2:按钮组件, 按钮是游戏中最常用的组件, 点击然后响应事件;
 6     3: 按钮的过渡效果:
 7     过渡Transition: 普通状态, 鼠标滑动到物体上, 按下状态, 禁用状态
 8     (1)没有过渡,只有响应事件;
 9     (2)颜色过渡, 过渡效果中使用颜色;
10     (3)精灵过渡,使用图片过渡;
11     (4)缩放过渡, 选项,在disable的时候是否置灰;
12     4: 按钮禁用;
13     5: 按钮添加响应事件 --> 节点-->组件 --> 代码的函数;
14     6: 按钮传递自定义参数; ---> 字符串对象;
15     7: Button响应这个触摸点击,所以Button所挂的这个节点,一定要有大小,如果你向大小(0, 0)的节点上,挂一个Button,这个是无法响应点击事件;
16 
17 */
18   //例子
19   //evt 本次触摸的触摸事件
20   //customData 是String类型 若要是需要调用的是int类型,那么需要int时要进行转换
21   on_button_click(evt,customData){ 
22     customData=parseInt(customData);
23     console.log("on_button_click",customData);
24   },
25   /*代码使用cc.Button
26   1: 代码添加/获取cc.Button组件;
27   
28     2: 代码里面添加按钮的响应事件;
29     3: 代码触发按钮指定的回掉函数;
30     4: Component.EventHandler
31       var eventHandler = new cc.Component.EventHandler();
32       eventHandler.target = newTarget;
33       eventHandler.component = "MainMenu";
34       eventHandler.handler = "OnClick";     
35       eventHandler.customEventData = "my data";
36       eventHandler.emit(["param1", "param2", ....]);
37 
38   */
39     properities:{
40     //在编辑器内绑定
41     button_sym:{
42         type:cc.Button,
43         default:null,
44     },
45     },
46     onLoad(){
47     //获取节点获取组件
48     this.start_button=this.node.getChildByName("aaa_button").getComponent(cc.Button);
49     //不建议使用getChildByName,可以在脚本properities内声明节点,在调用的时候设置对应的节点
50     //使用节点名字进行查找消耗性能之外,一旦节点名字改变还需要进行从新配置
51     
52      //代码内添加响应函数
53      // 添加响应事件 --> 节点-->组件 --> 代码的函数 三个部分
54      var click_event=new cc.Component.EventHandler();
55      click_event.target= this.node;
56      click_event.component = "game_scene";//组件
57      click_event.handler = "on_button_click_test";//字符串对象
58      click_event.customData = "test button";
59      
60      //以上两种方法都是可行的
61      //1
62      this.test_button.clickEvents=[click_event];//可添加多个事件
63      //2
64      this.test_button.clickEvents.push(click_event);
65     },
66     on_button_click_test(evt,customData){
67       console.log("on_button_click_test",customData);
68     },
69     //代码出发按钮的响应事件
70     this.scheduleOnce(function(){
71         //....
72         //在代码里触发按钮的响应函数
73         clickEvents[x].emit("","参数");
74         }.bind(this),3);

猜你喜欢

转载自www.cnblogs.com/allyh/p/10016858.html