orillusion icon indicating copy to clipboard operation
orillusion copied to clipboard

[FR]: 如何使得模型有一个半透明的状态?

Open Temurayl opened this issue 1 year ago • 3 comments

Is your feature request related to a problem? Please describe

我想做一个楼房分层的效果,点击模型使得各个楼层进行分层,各层之间留有间距,且点击的那个楼层的透明度为1,其他的透明度为0.5,目前可以满足这个需求吗?

aae40cf7dda141461c89e1a5f0de392

Temurayl avatar Sep 16 '23 06:09 Temurayl

你这个需求是具体的业务层面逻辑了,核心是动态修改 material 的 alpha 值,并配合 blendMode 来渲染半透明状态

let mesh = obj.getComponent(MeshRenderer);
let mat = mesh.material;
mat.alphaCutoff = 0.1;
mat.baseColor.a = 0.5;
mat.transparent = true;
mat.blendMode = BlendMode.NORMAL;

具体的来说和模型的结构、名称、逻辑都有关系,我们拿一个简单的模型来举例 https://codepen.io/orillusion/pen/rNozgPJ

ezgif com-video-to-gif

具体的实现方法可以参考 codepen 的代码

lslzl3000 avatar Sep 16 '23 10:09 lslzl3000

那假如说,我在一个场景中加载了30个模型,触发了一个按钮的点击事件,然后想让这30个模型中的指定5个模型添加这样一个透明度的话,和这个示例是一样的操作吗? 还是说有更好的方法呢?

Temurayl avatar Sep 19 '23 08:09 Temurayl

mat.alphaCutoff = 0.1; mat.baseColor.a = 0.5; 这两个属性取值区间范围都是 0-1吗?

Temurayl avatar Sep 20 '23 01:09 Temurayl