上一次我们说到了两个节点之间的切换,但还没有做完,今天我们继续来做完它。
1. 打开game.ts脚本,添加一个函数用来处理按钮的点击事件。
onclick(event:Event,str:string){
console.log('点击按钮了')
}
2. 接下来,我们在按钮上绑定点击事件。
(1)选择btn_return节点,找到Click Events
(2) 在Click Events处,填写1,按下回车键。
(3)拖动Canvas到node处
(4)选择game下面的onclick。也就是我们之前在脚本game.ts上创建的函数onclick。传过去的字符串填写”return”。
(5)运行下,点击“返回”按钮,可以看到了我们之前在onclick 函数行的打印。说明我们在这个返回按钮上绑定的事件是成功的。
3. 同样btn_jigsaw这个按钮跟btn_return按钮的处理方式也是一样的,也是绑定到onclick这个函数上。不同的是传递的字符串不一样,这个传递的字符串是jigsaw
4. 接下来增加一个初始化函数。让jigsaw节点一开始隐藏。
(1)控制节点的激活或者隐藏,通过设置节点的 active 属性,当active为true时,该节点为激活状态,为false时为隐藏状态。
init(){
this.jigsaw.active=false
}
(2)还要在start函数里进行调用init函数。
start() {
this.init()
}
(3)运行游戏时,没有显示其他节点了。
5. (1)在onclick函数上对不同的按钮进行处理,我们可以通过传递过来不同的参数来区别是哪个按钮点击了。
onclick(event:Event,str:string){
if(str=='return'){
this.jigsaw.active=false
this.nodeRedy.active=true
}else if(str=='jigsaw'){
this.jigsaw.active=true
this.nodeRedy.active=false
}
}
(2)点击“拼图”按钮,调到了返回所在的节点上了
(3)点击“返回”按钮,回到了拼图所在的节点。
今天就到这里了,把 jigsaw节点和nodeRedy节点的切换功能实现了。下次我们继续。可能写的过程中还有很多不好的地方,希望大家能指出来,在此,谢谢大家