免费资源部落

这篇文章将为大家详细讲解有关Creator3D中shader5_代码是如何控制effect中的属性，文章内容质量较高，因此小编分享给大家做个参考，希望大家阅读完这篇文章后对相关知识有一定的了解。

前言

之前做了一个球形的波浪水球，当时提到一句有点像加载进度条，那么下去我就实现了一下这个功能，游戏的加载进度用它来显示。

效果展示正文1.概述

在上边的效果显示中，大家可以看见，球形的波浪高度，随着游戏加载的进度逐渐变高，游戏加载到100%的时候，球也正好被填充满。那么大家就会想到，波浪小球的shader实现效果是在effec文件中，而游戏的加载进度是在游戏代码中，应该怎样在代码中去设置effect中的属性。

2.实现

Effect代码：

CCEffect%{techniques:-name:opaquepasses:-vert:general-vs:vert#builtinheaderfrag:unlit-fs:fragproperties:&propsmainTexture:{value:white}mainColor:{value:[1,1,1,1],editor:{type:color}}mScale:{value:[1,1,1,1]}mPos:{value:[1,1,1,1]}mHeight:{value:0}-name:transparentpasses:-vert:general-vs:vert#builtinheaderfrag:unlit-fs:fragblendState:targets:-blend:trueblendSrc:src_alphablendDst:one_minus_src_alphablendSrcAlpha:src_alphablendDstAlpha:one_minus_src_alphaproperties:*props}%CCProgramunlit-fs%{precisionhighpfloat;#include<output>#include<cc-global>#include<output>#include<cc-local-batch>invec3v_position;invec2v_uv;uniformsampler2DmainTexture;uniformConstant{vec4mainColor;vec4mScale;vec4mPos;floatmHeight;};vec4frag(){//顶点坐标，法线坐标都是基于世界坐标系的vec4color=mainColor;if(v_position.y+sin((v_position.x+cc_time.x)*7.0)/40.0>mPos.y-mScale.y/2.0+mHeight){color=vec4(1.0,1.1,1.0,0.1);}returnCCFragOutput(color*texture(mainTexture,v_uv));}}%

新建一个effect文件,我们需要下面3个地方的改动

1.添加可编辑的属性，mScale,mPos,mHieght 是我们需要添加的。

properties:&propsmainTexture:{value:white}mainColor:{value:[1,1,1,1],editor:{type:color}}mScale:{value:[1,1,1,1]}mPos:{value:[1,1,1,1]}mHeight:{value:0}

2.声明添加属性的类型

uniformConstant{vec4mainColor;vec4mScale;vec4mPos;floatmHeight;};

实现波浪效果

vec4frag(){//顶点坐标，法线坐标都是基于世界坐标系的//mPos小球的坐标//mScale小球的大小//mHeight波浪在小球中的高度vec4color=mainColor;if(v_position.y+sin((v_position.x+cc_time.x)*7.0)/40.0>mPos.y-mScale.y/2.0+mHeight){color=vec4(1.0,1.1,1.0,0.1);}returnCCFragOutput(color*texture(mainTexture,v_uv));}

游戏脚本中的代码

//获取小球的材质this.loadSphereCm=this.loadSphere.getComponent(ModelComponent);letmaterial:Material=this.loadSphereCm.material;//设置材质中mainColor属性值material.setProperty("mainColor",newVec4(0.0,0.7,0.8,1.0));letpos:Vec3=this.loadSphere.position;letscale:Vec3=this.loadSphere.scale;//设置材质中mPos属性值material.setProperty("mPos",newVec4(pos.x,pos.y,pos.z,0.0));//设置材质中mScale属性值material.setProperty("mScale",newVec4(scale.x,scale.y,scale.z,0.0));this.mProgress=0;this.schedule(()=>{this.mProgress+=1;if(this.mProgress>100){this.mProgress=100;}//根据加载进度设置mHeight的值material.setProperty("mHeight",scale.y*(this.mProgress/100));this.labelLoad.getComponent(LabelComponent).string="资源初始化进度"+this.mProgress+"%";},0.07);

关于Creator3D中shader5_代码是如何控制effect中的属性就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。