优化demo
This commit is contained in:
caizhitao
parent
7e197c0892
commit
ba90b2170c
@ -3,7 +3,7 @@
|
||||
// 原理：
|
||||
// 1. 画圆
|
||||
// 2. 圆心高亮（透明度=1.0），圆边缘不亮（透明度=0.0）
|
||||
// 3. 在原图像上方叠加圆
|
||||
// 4. 在原图像上方叠加圆
|
||||
|
||||
CCEffect %{
|
||||
techniques:
|
||||
@ -21,7 +21,7 @@ CCEffect %{
|
||||
|
||||
# 扩散颜色
|
||||
centerColor: {
|
||||
value: [1.0, 0.0, 0.0, 1.0],
|
||||
value: [1.0, 1.0, 0.0, 1.0],
|
||||
inspector: {
|
||||
type: color,
|
||||
tooltip: "发光颜色"
|
||||
@ -30,7 +30,7 @@ CCEffect %{
|
||||
|
||||
# 扩散起点坐标
|
||||
centerPoint: {
|
||||
value: [0.5, 0.5],
|
||||
value: [0.2, 0.2],
|
||||
inspector: {
|
||||
tooltip: "扩散起点坐标"
|
||||
}
|
||||
@ -38,7 +38,7 @@ CCEffect %{
|
||||
|
||||
# 扩散半径
|
||||
radius: {
|
||||
value: 0.2,
|
||||
value: 0.4,
|
||||
inspector: {
|
||||
tooltip: "扩散半径"
|
||||
}
|
||||
@ -98,15 +98,15 @@ CCProgram fs %{
|
||||
// 扩散颜色
|
||||
vec4 centerColor;
|
||||
|
||||
// // 因为现在cc不支持 vec2 数组，所以只能用 vec4 数组
|
||||
// // 而一个 vec4 就包含两个 vec2 ，共计 4 个属性，所以如果数组是4，就表示有8个点了
|
||||
// vec4 points[4];
|
||||
|
||||
// 扩散起点坐标
|
||||
vec2 centerPoint;
|
||||
|
||||
// 扩展半径
|
||||
float radius;
|
||||
|
||||
// 裁剪掉透明区域上的点光
|
||||
// ps：编辑器还不支持 bool 类型的样子，因此没在 CCEffect 中定义 cropAlpha
|
||||
bool cropAlpha;
|
||||
}
|
||||
|
||||
/**
|
||||
@ -116,13 +116,15 @@ CCProgram fs %{
|
||||
// 计算当前 uv 到扩散起点的距离
|
||||
float dis = distance(v_uv0, centerPoint);
|
||||
|
||||
// 第一步裁剪
|
||||
// 找出扩散范围，扩散范围为1.0透明度，其他范围为0.0透明度
|
||||
float a = step(dis, radius);
|
||||
float a = 1.0 ;
|
||||
|
||||
// // 第二步裁剪
|
||||
// // 本来透明的uv不要
|
||||
// a *= step(0.01, textureColor.a);
|
||||
// 裁剪掉透明区域上的点光
|
||||
if (cropAlpha) {
|
||||
a *= step(0.01, textureColor.a);
|
||||
}
|
||||
|
||||
// 裁剪掉扩散范围外的uv
|
||||
// a *= step(dis, radius);
|
||||
|
||||
// 加入从中心往外渐变的效果
|
||||
a *= 1.0 - (dis / radius);
|
||||
|
||||
@ -5,11 +5,11 @@
|
||||
{
|
||||
"glsl1": {
|
||||
"vert": "\nprecision highp float;\nuniform mat4 cc_matViewProj;\nuniform mat4 cc_matWorld;\n\nattribute vec3 a_position;\nattribute vec4 a_color;\nvarying vec4 v_color;\n\n#if USE_TEXTURE\nattribute vec2 a_uv0;\nvarying vec2 v_uv0;\n#endif\n\nvoid main () {\n vec4 pos = vec4(a_position, 1);\n\n #if CC_USE_MODEL\n pos = cc_matViewProj * cc_matWorld * pos;\n #else\n pos = cc_matViewProj * pos;\n #endif\n\n #if USE_TEXTURE\n v_uv0 = a_uv0;\n #endif\n\n v_color = a_color;\n\n gl_Position = pos;\n}\n",
|
||||
"frag": "\nprecision highp float;\n\n#if USE_ALPHA_TEST\n \n uniform float alphaThreshold;\n#endif\n\nvoid ALPHA_TEST (in vec4 color) {\n #if USE_ALPHA_TEST\n if (color.a < alphaThreshold) discard;\n #endif\n}\n\nvoid ALPHA_TEST (in float alpha) {\n #if USE_ALPHA_TEST\n if (alpha < alphaThreshold) discard;\n #endif\n}\n\nvarying vec4 v_color;\n\n#if USE_TEXTURE\nvarying vec2 v_uv0;\nuniform sampler2D texture;\n#endif\n\n#if ENABLE_DIFFUSION\nuniform vec4 centerColor;\nuniform vec2 centerPoint;\nuniform float radius;\n/**\n * 添加某个扩散点后混合后的纹理颜色\n */\nvec4 addDiffusionColor(vec4 textureColor, vec2 centerPoint, float radius, vec4 centerColor) {\n\n float dis = distance(v_uv0, centerPoint);\n\n float a = step(dis, radius);\n\n a *= 1.0 - (dis / radius);\n\n vec4 diffusionColor = centerColor * a;\n\n return textureColor * textureColor.a + diffusionColor;\n}\n#endif\n\nvoid main () {\n vec4 o = vec4(1, 1, 1, 1);\n\n #if USE_TEXTURE\n o *= texture2D(texture, v_uv0);\n #if CC_USE_ALPHA_ATLAS_TEXTURE\n o.a *= texture2D(texture, v_uv0 + vec2(0, 0.5)).r;\n #endif\n #endif\n\n o *= v_color;\n\n ALPHA_TEST(o);\n\n gl_FragColor = o;\n \n #if ENABLE_DIFFUSION\n gl_FragColor = addDiffusionColor(gl_FragColor, centerPoint, radius, centerColor);\n #endif\n}\n"
|
||||
"frag": "\nprecision highp float;\n\n#if USE_ALPHA_TEST\n \n uniform float alphaThreshold;\n#endif\n\nvoid ALPHA_TEST (in vec4 color) {\n #if USE_ALPHA_TEST\n if (color.a < alphaThreshold) discard;\n #endif\n}\n\nvoid ALPHA_TEST (in float alpha) {\n #if USE_ALPHA_TEST\n if (alpha < alphaThreshold) discard;\n #endif\n}\n\nvarying vec4 v_color;\n\n#if USE_TEXTURE\nvarying vec2 v_uv0;\nuniform sampler2D texture;\n#endif\n\n#if ENABLE_DIFFUSION\nuniform vec4 centerColor;\nuniform vec2 centerPoint;\nuniform float radius;\nuniform bool cropAlpha;\n/**\n * 添加某个扩散点后混合后的纹理颜色\n */\nvec4 addDiffusionColor(vec4 textureColor, vec2 centerPoint, float radius, vec4 centerColor) {\n\n float dis = distance(v_uv0, centerPoint);\n\n float a = 1.0 ;\n\n if (cropAlpha) {\n a *= step(0.01, textureColor.a);\n }\n\n a *= 1.0 - (dis / radius);\n\n vec4 diffusionColor = centerColor * a;\n\n return textureColor * textureColor.a + diffusionColor;\n}\n#endif\n\nvoid main () {\n vec4 o = vec4(1, 1, 1, 1);\n\n #if USE_TEXTURE\n o *= texture2D(texture, v_uv0);\n #if CC_USE_ALPHA_ATLAS_TEXTURE\n o.a *= texture2D(texture, v_uv0 + vec2(0, 0.5)).r;\n #endif\n #endif\n\n o *= v_color;\n\n ALPHA_TEST(o);\n\n gl_FragColor = o;\n \n #if ENABLE_DIFFUSION\n gl_FragColor = addDiffusionColor(gl_FragColor, centerPoint, radius, centerColor);\n #endif\n}\n"
|
||||
},
|
||||
"glsl3": {
|
||||
"vert": "\nprecision highp float;\nuniform CCGlobal {\n vec4 cc_time;\n\n vec4 cc_screenSize;\n\n vec4 cc_screenScale;\n\n vec4 cc_nativeSize;\n\n mat4 cc_matView;\n mat4 cc_matViewInv;\n mat4 cc_matProj;\n mat4 cc_matProjInv;\n mat4 cc_matViewProj;\n mat4 cc_matViewProjInv;\n vec4 cc_cameraPos;\n\n vec4 cc_exposure;\n\n vec4 cc_mainLitDir;\n\n vec4 cc_mainLitColor;\n\n vec4 cc_ambientSky;\n vec4 cc_ambientGround;\n};\nuniform CCLocal {\n mat4 cc_matWorld;\n mat4 cc_matWorldIT;\n};\n\nin vec3 a_position;\nin vec4 a_color;\nout vec4 v_color;\n\n#if USE_TEXTURE\nin vec2 a_uv0;\nout vec2 v_uv0;\n#endif\n\nvoid main () {\n vec4 pos = vec4(a_position, 1);\n\n #if CC_USE_MODEL\n pos = cc_matViewProj * cc_matWorld * pos;\n #else\n pos = cc_matViewProj * pos;\n #endif\n\n #if USE_TEXTURE\n v_uv0 = a_uv0;\n #endif\n\n v_color = a_color;\n\n gl_Position = pos;\n}\n",
|
||||
"frag": "\nprecision highp float;\n\n#if USE_ALPHA_TEST\n \n uniform ALPHA_TEST {\n float alphaThreshold;\n }\n#endif\n\nvoid ALPHA_TEST (in vec4 color) {\n #if USE_ALPHA_TEST\n if (color.a < alphaThreshold) discard;\n #endif\n}\n\nvoid ALPHA_TEST (in float alpha) {\n #if USE_ALPHA_TEST\n if (alpha < alphaThreshold) discard;\n #endif\n}\n\nin vec4 v_color;\n\n#if USE_TEXTURE\nin vec2 v_uv0;\nuniform sampler2D texture;\n#endif\n\n#if ENABLE_DIFFUSION\nuniform Diffusion {\n\n vec4 centerColor;\n\n vec2 centerPoint;\n\n float radius;\n}\n\n/**\n * 添加某个扩散点后混合后的纹理颜色\n */\nvec4 addDiffusionColor(vec4 textureColor, vec2 centerPoint, float radius, vec4 centerColor) {\n\n float dis = distance(v_uv0, centerPoint);\n\n float a = step(dis, radius);\n\n a *= 1.0 - (dis / radius);\n\n vec4 diffusionColor = centerColor * a;\n\n return textureColor * textureColor.a + diffusionColor;\n}\n#endif\n\nvoid main () {\n vec4 o = vec4(1, 1, 1, 1);\n\n #if USE_TEXTURE\n o *= texture(texture, v_uv0);\n #if CC_USE_ALPHA_ATLAS_TEXTURE\n o.a *= texture2D(texture, v_uv0 + vec2(0, 0.5)).r;\n #endif\n #endif\n\n o *= v_color;\n\n ALPHA_TEST(o);\n\n gl_FragColor = o;\n \n #if ENABLE_DIFFUSION\n gl_FragColor = addDiffusionColor(gl_FragColor, centerPoint, radius, centerColor);\n #endif\n}\n"
|
||||
"frag": "\nprecision highp float;\n\n#if USE_ALPHA_TEST\n \n uniform ALPHA_TEST {\n float alphaThreshold;\n }\n#endif\n\nvoid ALPHA_TEST (in vec4 color) {\n #if USE_ALPHA_TEST\n if (color.a < alphaThreshold) discard;\n #endif\n}\n\nvoid ALPHA_TEST (in float alpha) {\n #if USE_ALPHA_TEST\n if (alpha < alphaThreshold) discard;\n #endif\n}\n\nin vec4 v_color;\n\n#if USE_TEXTURE\nin vec2 v_uv0;\nuniform sampler2D texture;\n#endif\n\n#if ENABLE_DIFFUSION\nuniform Diffusion {\n\n vec4 centerColor;\n\n vec2 centerPoint;\n\n float radius;\n\n bool cropAlpha;\n}\n\n/**\n * 添加某个扩散点后混合后的纹理颜色\n */\nvec4 addDiffusionColor(vec4 textureColor, vec2 centerPoint, float radius, vec4 centerColor) {\n\n float dis = distance(v_uv0, centerPoint);\n\n float a = 1.0 ;\n\n if (cropAlpha) {\n a *= step(0.01, textureColor.a);\n }\n\n a *= 1.0 - (dis / radius);\n\n vec4 diffusionColor = centerColor * a;\n\n return textureColor * textureColor.a + diffusionColor;\n}\n#endif\n\nvoid main () {\n vec4 o = vec4(1, 1, 1, 1);\n\n #if USE_TEXTURE\n o *= texture(texture, v_uv0);\n #if CC_USE_ALPHA_ATLAS_TEXTURE\n o.a *= texture2D(texture, v_uv0 + vec2(0, 0.5)).r;\n #endif\n #endif\n\n o *= v_color;\n\n ALPHA_TEST(o);\n\n gl_FragColor = o;\n \n #if ENABLE_DIFFUSION\n gl_FragColor = addDiffusionColor(gl_FragColor, centerPoint, radius, centerColor);\n #endif\n}\n"
|
||||
}
|
||||
}
|
||||
],
|
||||
|
||||
@ -11,6 +11,6 @@
|
||||
"ENABLE_DIFFUSION": true
|
||||
},
|
||||
"_props": {
|
||||
"radius": 0.2
|
||||
"radius": 0.4
|
||||
}
|
||||
}
|
||||
@ -78,10 +78,10 @@
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 113
|
||||
"__id__": 125
|
||||
},
|
||||
{
|
||||
"__id__": 114
|
||||
"__id__": 126
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -171,7 +171,7 @@
|
||||
"array": [
|
||||
0,
|
||||
0,
|
||||
393.5138244914885,
|
||||
492.7684547533456,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
@ -245,13 +245,13 @@
|
||||
"__id__": 9
|
||||
},
|
||||
{
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 112
|
||||
"__id__": 124
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -428,7 +428,7 @@
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "Sliders",
|
||||
"_name": "Controller",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 5
|
||||
@ -448,15 +448,18 @@
|
||||
},
|
||||
{
|
||||
"__id__": 78
|
||||
},
|
||||
{
|
||||
"__id__": 95
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 95
|
||||
"__id__": 107
|
||||
},
|
||||
{
|
||||
"__id__": 96
|
||||
"__id__": 108
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -471,7 +474,7 @@
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 576,
|
||||
"height": 444
|
||||
"height": 540
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
@ -1698,7 +1701,7 @@
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
230.40000000000006,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
@ -1877,7 +1880,7 @@
|
||||
"_N$handle": {
|
||||
"__id__": 37
|
||||
},
|
||||
"_N$progress": 0,
|
||||
"_N$progress": 1,
|
||||
"_id": "35YKg9gStEhLErp2N/639Q"
|
||||
},
|
||||
{
|
||||
@ -1986,8 +1989,8 @@
|
||||
}
|
||||
],
|
||||
"_useOriginalSize": false,
|
||||
"_string": "0.10 | 26",
|
||||
"_N$string": "0.10 | 26",
|
||||
"_string": "1.00 | 255",
|
||||
"_N$string": "1.00 | 255",
|
||||
"_fontSize": 40,
|
||||
"_lineHeight": 40,
|
||||
"_enableWrapText": true,
|
||||
@ -3981,7 +3984,7 @@
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
23.039999999999992,
|
||||
92.16000000000005,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
@ -4160,7 +4163,7 @@
|
||||
"_N$handle": {
|
||||
"__id__": 88
|
||||
},
|
||||
"_N$progress": 0.1,
|
||||
"_N$progress": 0.4,
|
||||
"_id": "c2uNTLxCdF2oHJ+IS0EBLe"
|
||||
},
|
||||
{
|
||||
@ -4312,6 +4315,589 @@
|
||||
"_originalHeight": 0,
|
||||
"_id": "785zd8XfJMALOKEKNQ7O0m"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "CropAlphaToggle",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 9
|
||||
},
|
||||
"_children": [
|
||||
{
|
||||
"__id__": 96
|
||||
},
|
||||
{
|
||||
"__id__": 99
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 106
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 576,
|
||||
"height": 60
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
-510,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": "0bSVqNIRdKirxNt6luVamv"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "DescLabel",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 95
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 97
|
||||
},
|
||||
{
|
||||
"__id__": 98
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 432,
|
||||
"height": 40
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 1,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
144,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": "2a4P++lclCLYLPc4P9YhfR"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Label",
|
||||
"_name": "SliderDescLabel<Label>",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 96
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_useOriginalSize": false,
|
||||
"_string": "裁剪透明区域的光：",
|
||||
"_N$string": "裁剪透明区域的光：",
|
||||
"_fontSize": 40,
|
||||
"_lineHeight": 40,
|
||||
"_enableWrapText": true,
|
||||
"_N$file": null,
|
||||
"_isSystemFontUsed": true,
|
||||
"_spacingX": 0,
|
||||
"_batchAsBitmap": false,
|
||||
"_N$horizontalAlign": 0,
|
||||
"_N$verticalAlign": 1,
|
||||
"_N$fontFamily": "Arial",
|
||||
"_N$overflow": 2,
|
||||
"_N$cacheMode": 0,
|
||||
"_id": "d6tUp0/3xLs6nI//wYjaM0"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Widget",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 96
|
||||
},
|
||||
"_enabled": true,
|
||||
"alignMode": 1,
|
||||
"_target": null,
|
||||
"_alignFlags": 45,
|
||||
"_left": 0,
|
||||
"_right": 0.25,
|
||||
"_top": 10,
|
||||
"_bottom": 10,
|
||||
"_verticalCenter": 0,
|
||||
"_horizontalCenter": 0,
|
||||
"_isAbsLeft": true,
|
||||
"_isAbsRight": false,
|
||||
"_isAbsTop": true,
|
||||
"_isAbsBottom": true,
|
||||
"_isAbsHorizontalCenter": true,
|
||||
"_isAbsVerticalCenter": true,
|
||||
"_originalWidth": 113.38,
|
||||
"_originalHeight": 50.4,
|
||||
"_id": "77UPZovv1IvK2+wcVSVh3U"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "Toggle",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 95
|
||||
},
|
||||
"_children": [
|
||||
{
|
||||
"__id__": 100
|
||||
},
|
||||
{
|
||||
"__id__": 102
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 104
|
||||
},
|
||||
{
|
||||
"__id__": 105
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 28,
|
||||
"height": 28
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
158,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": "b9SyyC/gdCDKY9vdqWEFuE"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "Background",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 99
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 101
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 28,
|
||||
"height": 28
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": "53uZJPYSJJrr07Weqcqjdo"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 100
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "6827ca32-0107-4552-bab2-dfb31799bb44"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 1,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_atlas": null,
|
||||
"_id": "11SIAqt1BIjZwYIAAj+yu7"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "checkmark",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 99
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 103
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 28,
|
||||
"height": 28
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": "d7A3s24e5BWIfNNJ0oexhv"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 102
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "90004ad6-2f6d-40e1-93ef-b714375c6f06"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 2,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": false,
|
||||
"_atlas": null,
|
||||
"_id": "d2ULg6zxZKs5LVf0/K6jfr"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Widget",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 99
|
||||
},
|
||||
"_enabled": true,
|
||||
"alignMode": 1,
|
||||
"_target": null,
|
||||
"_alignFlags": 8,
|
||||
"_left": 0.75,
|
||||
"_right": 0,
|
||||
"_top": 0,
|
||||
"_bottom": 0,
|
||||
"_verticalCenter": 0,
|
||||
"_horizontalCenter": 0,
|
||||
"_isAbsLeft": false,
|
||||
"_isAbsRight": true,
|
||||
"_isAbsTop": true,
|
||||
"_isAbsBottom": true,
|
||||
"_isAbsHorizontalCenter": true,
|
||||
"_isAbsVerticalCenter": true,
|
||||
"_originalWidth": 0,
|
||||
"_originalHeight": 0,
|
||||
"_id": "f39gCrxQlNa7kZ9Ne/c+/b"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Toggle",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 99
|
||||
},
|
||||
"_enabled": true,
|
||||
"_normalMaterial": {
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
},
|
||||
"_grayMaterial": null,
|
||||
"duration": 0.1,
|
||||
"zoomScale": 1.2,
|
||||
"clickEvents": [],
|
||||
"_N$interactable": true,
|
||||
"_N$enableAutoGrayEffect": false,
|
||||
"_N$transition": 3,
|
||||
"transition": 3,
|
||||
"_N$normalColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 214,
|
||||
"g": 214,
|
||||
"b": 214,
|
||||
"a": 255
|
||||
},
|
||||
"_N$pressedColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 211,
|
||||
"g": 211,
|
||||
"b": 211,
|
||||
"a": 255
|
||||
},
|
||||
"pressedColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 211,
|
||||
"g": 211,
|
||||
"b": 211,
|
||||
"a": 255
|
||||
},
|
||||
"_N$hoverColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"hoverColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_N$disabledColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 124,
|
||||
"g": 124,
|
||||
"b": 124,
|
||||
"a": 255
|
||||
},
|
||||
"_N$normalSprite": null,
|
||||
"_N$pressedSprite": null,
|
||||
"pressedSprite": null,
|
||||
"_N$hoverSprite": null,
|
||||
"hoverSprite": null,
|
||||
"_N$disabledSprite": null,
|
||||
"_N$target": {
|
||||
"__id__": 100
|
||||
},
|
||||
"_N$isChecked": true,
|
||||
"toggleGroup": null,
|
||||
"checkMark": {
|
||||
"__id__": 103
|
||||
},
|
||||
"checkEvents": [],
|
||||
"_id": "7bKEFTsjNDwasqgjeKI1fQ"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Widget",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 95
|
||||
},
|
||||
"_enabled": true,
|
||||
"alignMode": 1,
|
||||
"_target": null,
|
||||
"_alignFlags": 40,
|
||||
"_left": 0,
|
||||
"_right": 0,
|
||||
"_top": 0,
|
||||
"_bottom": 0,
|
||||
"_verticalCenter": 0,
|
||||
"_horizontalCenter": 0,
|
||||
"_isAbsLeft": true,
|
||||
"_isAbsRight": true,
|
||||
"_isAbsTop": true,
|
||||
"_isAbsBottom": true,
|
||||
"_isAbsHorizontalCenter": true,
|
||||
"_isAbsVerticalCenter": true,
|
||||
"_originalWidth": 461.38,
|
||||
"_originalHeight": 0,
|
||||
"_id": "efiFYhAgxFpY9khUf6wQ/S"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Widget",
|
||||
"_name": "",
|
||||
@ -4350,7 +4936,7 @@
|
||||
"_layoutSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 576,
|
||||
"height": 444
|
||||
"height": 540
|
||||
},
|
||||
"_resize": 1,
|
||||
"_N$layoutType": 2,
|
||||
@ -4381,31 +4967,31 @@
|
||||
},
|
||||
"_children": [
|
||||
{
|
||||
"__id__": 98
|
||||
"__id__": 110
|
||||
},
|
||||
{
|
||||
"__id__": 100
|
||||
"__id__": 112
|
||||
},
|
||||
{
|
||||
"__id__": 102
|
||||
"__id__": 114
|
||||
},
|
||||
{
|
||||
"__id__": 104
|
||||
"__id__": 116
|
||||
},
|
||||
{
|
||||
"__id__": 106
|
||||
"__id__": 118
|
||||
},
|
||||
{
|
||||
"__id__": 108
|
||||
"__id__": 120
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 110
|
||||
"__id__": 122
|
||||
},
|
||||
{
|
||||
"__id__": 111
|
||||
"__id__": 123
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4461,13 +5047,13 @@
|
||||
"_name": "ball_0",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 99
|
||||
"__id__": 111
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4523,7 +5109,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 98
|
||||
"__id__": 110
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -4555,13 +5141,13 @@
|
||||
"_name": "cocos_logo",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 101
|
||||
"__id__": 113
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4617,7 +5203,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 100
|
||||
"__id__": 112
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -4649,13 +5235,13 @@
|
||||
"_name": "ball_1",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 103
|
||||
"__id__": 115
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4711,7 +5297,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 102
|
||||
"__id__": 114
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -4743,13 +5329,13 @@
|
||||
"_name": "video_btn",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 105
|
||||
"__id__": 117
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4805,7 +5391,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 104
|
||||
"__id__": 116
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -4837,13 +5423,13 @@
|
||||
"_name": "SystemFont",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 107
|
||||
"__id__": 119
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4899,7 +5485,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 106
|
||||
"__id__": 118
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -4929,13 +5515,13 @@
|
||||
"_name": "BmFont",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 109
|
||||
"__id__": 121
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@ -4991,7 +5577,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 108
|
||||
"__id__": 120
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
@ -5023,7 +5609,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_enabled": true,
|
||||
"alignMode": 1,
|
||||
@ -5050,7 +5636,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 97
|
||||
"__id__": 109
|
||||
},
|
||||
"_enabled": true,
|
||||
"_layoutSize": {
|
||||
|
||||
@ -2,9 +2,7 @@ const { ccclass, property } = cc._decorator;
|
||||
|
||||
@ccclass
|
||||
export default class LocalDiffusionCtrl extends cc.Component {
|
||||
private _centerPointPos: cc.Vec2 = cc.v2(0.5, 0.5);
|
||||
private _centerColor: cc.Color = cc.Color.RED;
|
||||
private _radius: number = 0.2;
|
||||
private _localDiffusionUniform: LocalDiffusionUniform = new LocalDiffusionUniform();
|
||||
|
||||
onEnable() {
|
||||
this.node.on(cc.Node.EventType.TOUCH_START, this._onTouchStart, this);
|
||||
@ -28,50 +26,51 @@ export default class LocalDiffusionCtrl extends cc.Component {
|
||||
|
||||
// 将触摸点转换为OPENGL坐标系并归一化
|
||||
// OpenGl 坐标系原点在左上角
|
||||
this._centerPointPos = cc.v2(
|
||||
this._localDiffusionUniform.certerPoint = cc.v2(
|
||||
this.node.anchorX + touchPointInNodeSpace.x / this.node.width,
|
||||
1 - (this.node.anchorY + touchPointInNodeSpace.y / this.node.height)
|
||||
);
|
||||
|
||||
this._updateMaterial({
|
||||
centerColor: this._centerColor,
|
||||
certerPoint: this._centerPointPos,
|
||||
radius: this._radius
|
||||
});
|
||||
this._updateMaterial();
|
||||
}
|
||||
|
||||
private _onPropertyChange(color: cc.Color, radius: number) {
|
||||
this._centerColor = color;
|
||||
this._radius = radius;
|
||||
this._updateMaterial({
|
||||
centerColor: this._centerColor,
|
||||
certerPoint: this._centerPointPos,
|
||||
radius: this._radius
|
||||
});
|
||||
private _onPropertyChange(localDiffusionUniform: LocalDiffusionUniform) {
|
||||
this._localDiffusionUniform.centerColor = localDiffusionUniform.centerColor;
|
||||
this._localDiffusionUniform.radius = localDiffusionUniform.radius;
|
||||
this._localDiffusionUniform.cropAlpha = localDiffusionUniform.cropAlpha;
|
||||
this._updateMaterial();
|
||||
}
|
||||
|
||||
private _updateMaterial(param: {
|
||||
/**
|
||||
* 中心点颜色
|
||||
*/
|
||||
centerColor: cc.Color;
|
||||
|
||||
/**
|
||||
* 中心点坐标 ([0.0, 1.0], [0.0, 1.0])
|
||||
*/
|
||||
certerPoint: cc.Vec2;
|
||||
|
||||
/**
|
||||
* 扩散半径 [0.0, 1.0]
|
||||
*/
|
||||
radius: number;
|
||||
}) {
|
||||
private _updateMaterial() {
|
||||
this.getComponents(cc.RenderComponent).forEach(renderComponent => {
|
||||
let material: cc.Material = renderComponent.getMaterial(0);
|
||||
material.setProperty("centerColor", param.centerColor);
|
||||
material.setProperty("centerPoint", param.certerPoint);
|
||||
material.setProperty("radius", param.radius);
|
||||
material.setProperty("centerColor", this._localDiffusionUniform.centerColor);
|
||||
material.setProperty("centerPoint", this._localDiffusionUniform.certerPoint);
|
||||
material.setProperty("radius", this._localDiffusionUniform.radius);
|
||||
material.setProperty("cropAlpha", this._localDiffusionUniform.cropAlpha);
|
||||
renderComponent.setMaterial(0, material);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export class LocalDiffusionUniform {
|
||||
/**
|
||||
* 中心点颜色
|
||||
*/
|
||||
centerColor: cc.Color = cc.Color.YELLOW;
|
||||
|
||||
/**
|
||||
* 中心点坐标 ([0.0, 1.0], [0.0, 1.0])
|
||||
*/
|
||||
certerPoint: cc.Vec2 = cc.v2(0.5, 0.5);
|
||||
|
||||
/**
|
||||
* 扩散半径 [0.0, 1.0]
|
||||
*/
|
||||
radius: number = 0.5;
|
||||
|
||||
/**
|
||||
* 是否裁剪掉透明区域上的点光
|
||||
*/
|
||||
cropAlpha: boolean = true;
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import LocalDiffusionCtrl from "./LocalDiffusionCtrl";
|
||||
import LocalDiffusionCtrl, { LocalDiffusionUniform } from "./LocalDiffusionCtrl";
|
||||
|
||||
const { ccclass, property } = cc._decorator;
|
||||
|
||||
@ -19,25 +19,29 @@ export default class LocalDiffusionEffectScene extends cc.Component {
|
||||
private _radiuSlider: cc.Slider = null;
|
||||
private _radiuSliderLabel: cc.Label = null;
|
||||
|
||||
private _cropAlphaToggle: cc.Toggle = null;
|
||||
|
||||
private _examplesParentNode: cc.Node = null;
|
||||
|
||||
onLoad() {
|
||||
cc.dynamicAtlasManager.enabled = false;
|
||||
|
||||
this._redSlider = cc.find("Canvas/Content/Sliders/ColorRedSlider/Slider").getComponent(cc.Slider);
|
||||
this._redSliderLabel = cc.find("Canvas/Content/Sliders/ColorRedSlider/ValueLabel").getComponent(cc.Label);
|
||||
this._redSlider = cc.find("Canvas/Content/Controller/ColorRedSlider/Slider").getComponent(cc.Slider);
|
||||
this._redSliderLabel = cc.find("Canvas/Content/Controller/ColorRedSlider/ValueLabel").getComponent(cc.Label);
|
||||
|
||||
this._greenSlider = cc.find("Canvas/Content/Sliders/ColorGreenSlider/Slider").getComponent(cc.Slider);
|
||||
this._greenSliderLabel = cc.find("Canvas/Content/Sliders/ColorGreenSlider/ValueLabel").getComponent(cc.Label);
|
||||
this._greenSlider = cc.find("Canvas/Content/Controller/ColorGreenSlider/Slider").getComponent(cc.Slider);
|
||||
this._greenSliderLabel = cc.find("Canvas/Content/Controller/ColorGreenSlider/ValueLabel").getComponent(cc.Label);
|
||||
|
||||
this._blueSlider = cc.find("Canvas/Content/Sliders/ColorBlueSlider/Slider").getComponent(cc.Slider);
|
||||
this._blueSliderLabel = cc.find("Canvas/Content/Sliders/ColorBlueSlider/ValueLabel").getComponent(cc.Label);
|
||||
this._blueSlider = cc.find("Canvas/Content/Controller/ColorBlueSlider/Slider").getComponent(cc.Slider);
|
||||
this._blueSliderLabel = cc.find("Canvas/Content/Controller/ColorBlueSlider/ValueLabel").getComponent(cc.Label);
|
||||
|
||||
this._alphaSlider = cc.find("Canvas/Content/Sliders/ColorAlphaSlider/Slider").getComponent(cc.Slider);
|
||||
this._alphaSliderLabel = cc.find("Canvas/Content/Sliders/ColorAlphaSlider/ValueLabel").getComponent(cc.Label);
|
||||
this._alphaSlider = cc.find("Canvas/Content/Controller/ColorAlphaSlider/Slider").getComponent(cc.Slider);
|
||||
this._alphaSliderLabel = cc.find("Canvas/Content/Controller/ColorAlphaSlider/ValueLabel").getComponent(cc.Label);
|
||||
|
||||
this._radiuSlider = cc.find("Canvas/Content/Sliders/RadiuSlider/Slider").getComponent(cc.Slider);
|
||||
this._radiuSliderLabel = cc.find("Canvas/Content/Sliders/RadiuSlider/ValueLabel").getComponent(cc.Label);
|
||||
this._radiuSlider = cc.find("Canvas/Content/Controller/RadiuSlider/Slider").getComponent(cc.Slider);
|
||||
this._radiuSliderLabel = cc.find("Canvas/Content/Controller/RadiuSlider/ValueLabel").getComponent(cc.Label);
|
||||
|
||||
this._cropAlphaToggle = cc.find("Canvas/Content/Controller/CropAlphaToggle/Toggle").getComponent(cc.Toggle);
|
||||
|
||||
// 代码添加控制脚本
|
||||
this._examplesParentNode = cc.find("Canvas/Content/Examples");
|
||||
@ -47,26 +51,28 @@ export default class LocalDiffusionEffectScene extends cc.Component {
|
||||
}
|
||||
|
||||
onEnable() {
|
||||
this._redSlider.node.on("slide", this._onSliderChanged, this);
|
||||
this._greenSlider.node.on("slide", this._onSliderChanged, this);
|
||||
this._blueSlider.node.on("slide", this._onSliderChanged, this);
|
||||
this._alphaSlider.node.on("slide", this._onSliderChanged, this);
|
||||
this._radiuSlider.node.on("slide", this._onSliderChanged, this);
|
||||
this._redSlider.node.on("slide", this._onPropertyChanged, this);
|
||||
this._greenSlider.node.on("slide", this._onPropertyChanged, this);
|
||||
this._blueSlider.node.on("slide", this._onPropertyChanged, this);
|
||||
this._alphaSlider.node.on("slide", this._onPropertyChanged, this);
|
||||
this._radiuSlider.node.on("slide", this._onPropertyChanged, this);
|
||||
this._cropAlphaToggle.node.on("toggle", this._onPropertyChanged, this);
|
||||
}
|
||||
|
||||
onDisable() {
|
||||
this._redSlider.node.off("slide", this._onSliderChanged, this);
|
||||
this._greenSlider.node.off("slide", this._onSliderChanged, this);
|
||||
this._blueSlider.node.off("slide", this._onSliderChanged, this);
|
||||
this._alphaSlider.node.off("slide", this._onSliderChanged, this);
|
||||
this._radiuSlider.node.off("slide", this._onSliderChanged, this);
|
||||
this._redSlider.node.off("slide", this._onPropertyChanged, this);
|
||||
this._greenSlider.node.off("slide", this._onPropertyChanged, this);
|
||||
this._blueSlider.node.off("slide", this._onPropertyChanged, this);
|
||||
this._alphaSlider.node.off("slide", this._onPropertyChanged, this);
|
||||
this._radiuSlider.node.off("slide", this._onPropertyChanged, this);
|
||||
this._cropAlphaToggle.node.off("toggle", this._onPropertyChanged, this);
|
||||
}
|
||||
|
||||
start() {
|
||||
this._onSliderChanged();
|
||||
this._onPropertyChanged();
|
||||
}
|
||||
|
||||
private _onSliderChanged() {
|
||||
private _onPropertyChanged() {
|
||||
// 更新进度条值 Label 文本
|
||||
this._redSliderLabel.string = `${this._redSlider.progress.toFixed(2)} | ${Math.round(255 * this._redSlider.progress)}`;
|
||||
this._greenSliderLabel.string = `${this._greenSlider.progress.toFixed(2)} | ${Math.round(255 * this._greenSlider.progress)}`;
|
||||
@ -76,16 +82,16 @@ export default class LocalDiffusionEffectScene extends cc.Component {
|
||||
|
||||
// 通知子节点更新材质
|
||||
this._examplesParentNode.children.forEach(childNode => {
|
||||
childNode.emit(
|
||||
"on_property_change",
|
||||
cc.color(
|
||||
childNode.emit("on_property_change", <LocalDiffusionUniform>{
|
||||
centerColor: cc.color(
|
||||
Math.round(255 * this._redSlider.progress),
|
||||
Math.round(255 * this._greenSlider.progress),
|
||||
Math.round(255 * this._blueSlider.progress),
|
||||
Math.round(255 * this._alphaSlider.progress)
|
||||
),
|
||||
this._radiuSlider.progress
|
||||
);
|
||||
radius: this._radiuSlider.progress,
|
||||
cropAlpha: this._cropAlphaToggle.isChecked
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user