4.5 KiB
特效和UI之间，也可以通过layer层级控制，前后遮罩效果； 有两个Canvas画布，第一个的layer是0；
!
第二个的是10
!
这个是包含Particle System 粒子系统的，特效预制体，展开Renderer渲染器，设置layer是5，介于俩画布之间
!
运行游戏，可以看到，遮罩也是正常的，根据层级来
!
特效还可以被Mask遮罩，例如这个Mask包含一个small特效
!
特效渲染器的masking选项，如果选择了inside，就会在mask内部显示
!
outside就是反着来了，显示在外部
!
运行游戏，点击，会出现照片墙的波纹特效
!
这是最外层，管理照片墙的逻辑类，其中声明的Prefab变量，是用来批量初始化的预制体； 单一照片都会挂载PhotoWallItem这个脚本，这里弄一个队列容器items统一管理； centerIds这个队列容器，是用来存储，点击照片的中心点集合； offset就是照片之间，间距偏移数值； Start初始化函数中，先实例化各个，数据队列容器，还会在当前实体上，新增挂载一个Reenter组件，是用来处理，照片墙整体的初始化移动，相关逻辑； 最后调用的SpawnItems函数，是用来批量创建，各个照片实体的逻辑；
!
对应挂载在画布Canvas上
!
单个照片实体，都会挂载的，对应逻辑脚本文件； 有唯一标识ID，中心点布尔判断，设定缩放showScale，是否为左右边界Border的布尔判断，当前照片实体邻居合集，记录的是唯一ID，数据容器NeighborIds； 还会声明FadeEffect特效逻辑类，是用来处理，邻近周边照片墙点的透明化，也是用了Dotween插件的DoFade透明动画插件，后续会解析； CircleXMin和CircleXMax两个字典，都是用来配合照片墙，整体移动的数据容器； Radius是设定的半径，主要用来配合，透明特效的显示范围； TargetPos就是照片实体的，目标位置信息，用于配合移动即可； 声明的FluctuateEffect变量，是用来处理，周边照片点的缩放处理特效，后续会解析；
!
透明特效，对应逻辑； 也是声明了唯一标识id，半径，对应的，单个照片实体，影响半径radius，获取图片组件，用来设置Image组件的raycastTarget射线检测，是否开启； Func委托，是用来从，总的照片墙队列容器，通过index索引，拿到特定的PhotoWallItem照片实体； 还有画布组CanvasGroup组件等； Init初始化函数，就是对各个声明变量，进行赋值初始化即可；
!
可以看到，对应的Image子物体，是有包含CanvasGroup组件的
!
播放透明特效的逻辑，在Play函数中； 一连串布尔判断之后，对包含中心ID centerId的照片实体，通过GetDistance，在影响半径，距离内的实体，通过Dotween动画插件的接口，如果目标阿尔法数值为0，也就是最终要变成透明的话，就取消该实体的点击射线检测raycastTarget，同时CanMove设置为false，不能移动； 反之，就是上述逻辑相反即可；
!
!
函数内，透明化处理的核心逻辑，在0.2秒内完成DOFade操作，然后调用协程WaitFade，等待0.15秒后，调用临近照片点的，透明特效播放Play函数逻辑即可
!
!
控制缩放特效的相关逻辑，声明的变量，和透明特效的，基本类似，有一个不一样，是_defaultScale，默认缩放参数值； Init中，完成各个变量的初始化赋值即可，其中默认缩放，设置是组件的localScale自身缩放即可；
!
表现上，缩放特效，是以中心点为中心，向周边所有节点，扩展的，所以是没有，透明特效那种，作用半径范围； 也是Play函数，触发特效的缩放动画播放，在一系列布尔判断处理之后，通过DOScale函数，完成缩放特效，然后调用WaitFade协程，播放桌边的缩放特效即可；
!
!