开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第31天，点击查看活动详情
上编辑模式下通过点击或者手指滑动时生成元素块。今天我们继续
1. 虽然在编辑模式下可以生成元素块了，但还有个小问题，就是生成的元素块都是有阴影的，我们改一下，只有当元素块被叠在下面的时候才有阴影，当在上面的时候就是高亮的状态
（1）打开block.ts脚本，定义canTouch
canTouch:boolean;
（2）在init函数时让canTouch为true
（3）增加判断元素块是否叠加的函数
setTouch(can_touch){
this.canTouch=can_touch
if(this.canTouch){
this.block_bg.active= false
}else{
this.block_bg.active=true
}
}
（4）增加获取包围盒的函数
//获取包围盒
getBoundingBox_pz(){
let num_pz=8
let node_UITransform_1=this.node.getComponent(UITransform)
let rect_1=node_UITransform_1.getBoundingBox()
let rect_3=new Rect(rect_1.x+num_pz,rect_1.y+num_pz,rect_1.width-num_pz2,rect_1.height-num_pz2)
return rect_3
}
（5）注意，要引入UITransform, Rect
2.打开game.ts脚本
（1）增加判断是否叠加函数
//判断是否叠加
pddj(){
let children=this.parentBlocks.children
for(let i=0;i<children.length;i++){
let ts_block_1=children[i].getComponent(blocks)
let rect_1=ts_block_1.getBoundingBox_pz()
ts_block_1.setTouch(true)
for (let j = i+1; j < children.length; j++) {
let ts_block_2=children[j].getComponent(blocks)
let rect_2=ts_block_2.getBoundingBox_pz()
if(rect_1.intersects(rect_2)){
ts_block_1.setTouch(false)
break
}
}
}
}
（2）在onTouchStart函数里调用叠加函数
this.pddj()
（3）同样在onTouchMove函数里也调用叠加函数
this.pddj()
(4) 效果如下，在最上面的元素块是高亮，在下面的元素块是有阴影的
3.接下来做一个按钮，用来输出元素块的坐标
（1）在preBlockEdit节点下新建一个按钮，并且命名为btn_shuChu
（2）btn_shuChu下的Label的String设置为输出
（3）调整btn_shuChu按钮的位置
（4）按钮的过渡类型设置为SCALE
4. 打开game.ts
(1) 添加按钮事件处理函数
callBackBtn(event:Event,str:string){
}
（2）添加按钮点击事件，并且关联到callBackBtn函数上
（3）为了区分不同的按钮事件，添加标识
（4）通过callBackBtn函数的str 接收之前定义的标识
callBackBtn(event:Event,str:string){
if (str=='btn_shuChu'){
}
}
今天就到这里了，主要完善了元素块的显示效果以及添加了输出的按钮，但还没完善该功能。下次我们继续。可能写的过程中还有很多不好的地方，希望大家能指出来，在此，谢谢大家
