一、导语
发光闪烁特效应该在我们的项目中是经常需要去封装的一个特效吧,一般用于点击选择,选中物体,或者一些特效加持于中心物体,物体碰撞检测后的发光特效等等
二、分析
我们可以合理的使用后处理特效,上步骤:
- 首先,我们利用后处理效果
- 然后整合输出于屏幕
- 再加持自定义着色器合成后处理效果
优点是性能更好,FPS不会掉,优化为我们场景可以加载更多特效或者物体做下更多铺垫哦
三、上基础代码
this.composer = new EffectComposer(this.renderer)
const renderPass = new RenderPass(this.scene, this.camera)
this.composer.addPass(renderPass)
// 发光特效后处理器
this.outlinePass = new OutlinePass(
new THREE.Vector2(window.innerWidth, window.innerHeight),
this.scene,
this.camera
)
this.outlinePass.edgeStrength = 10
this.outlinePass.edgeGlow = 1
this.outlinePass.pulsePeriod = 2