112 lines
6.1 KiB
TypeScript
112 lines
6.1 KiB
TypeScript
import FlashLightCtrlComponent, { FlashLightUBO } from "./FlashLightCtrlComponent";
|
|
|
|
const { ccclass, property } = cc._decorator;
|
|
|
|
@ccclass
|
|
export default class FlashLightEffectScene extends cc.Component {
|
|
private _redSlider: cc.Slider = null;
|
|
private _redSliderLabel: cc.Label = null;
|
|
private _greenSlider: cc.Slider = null;
|
|
private _greenSliderLabel: cc.Label = null;
|
|
private _blueSlider: cc.Slider = null;
|
|
private _blueSliderLabel: cc.Label = null;
|
|
private _alphaSlider: cc.Slider = null;
|
|
private _alphaSliderLabel: cc.Label = null;
|
|
private _lightWidthSlider: cc.Slider = null;
|
|
private _lightWidthSliderLabel: cc.Label = null;
|
|
private _lightAngleSlider: cc.Slider = null;
|
|
private _lightAngleSliderLabel: cc.Label = null;
|
|
|
|
private _enableGradientToggle: cc.Toggle = null;
|
|
private _cropAlphaToggle: cc.Toggle = null;
|
|
private _enableFogToggle: cc.Toggle = null;
|
|
|
|
private _examplesParentNode: cc.Node = null;
|
|
|
|
onLoad() {
|
|
cc.dynamicAtlasManager.enabled = false;
|
|
|
|
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/Controller/ColorGreenSlider/Slider").getComponent(cc.Slider);
|
|
this._greenSliderLabel = cc.find("Canvas/Content/Controller/ColorGreenSlider/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/Controller/ColorAlphaSlider/Slider").getComponent(cc.Slider);
|
|
this._alphaSliderLabel = cc.find("Canvas/Content/Controller/ColorAlphaSlider/ValueLabel").getComponent(cc.Label);
|
|
this._lightWidthSlider = cc.find("Canvas/Content/Controller/LightWidthSlider/Slider").getComponent(cc.Slider);
|
|
this._lightWidthSliderLabel = cc.find("Canvas/Content/Controller/LightWidthSlider/ValueLabel").getComponent(cc.Label);
|
|
this._lightAngleSlider = cc.find("Canvas/Content/Controller/LightAngleSlider/Slider").getComponent(cc.Slider);
|
|
this._lightAngleSliderLabel = cc.find("Canvas/Content/Controller/LightAngleSlider/ValueLabel").getComponent(cc.Label);
|
|
|
|
this._enableGradientToggle = cc.find("Canvas/Content/Controller/EnableGradientToggle/Toggle").getComponent(cc.Toggle);
|
|
this._cropAlphaToggle = cc.find("Canvas/Content/Controller/CropAlphaToggle/Toggle").getComponent(cc.Toggle);
|
|
this._enableFogToggle = cc.find("Canvas/Content/Controller/EnableFogToggle/Toggle").getComponent(cc.Toggle);
|
|
|
|
// 代码添加控制脚本
|
|
this._examplesParentNode = cc.find("Canvas/Content/Examples");
|
|
this._examplesParentNode.children.forEach(childNode => {
|
|
childNode.addComponent(FlashLightCtrlComponent);
|
|
});
|
|
}
|
|
|
|
onEnable() {
|
|
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._lightWidthSlider.node.on("slide", this._onPropertyChanged, this);
|
|
this._lightAngleSlider.node.on("slide", this._onPropertyChanged, this);
|
|
|
|
this._enableGradientToggle.node.on("toggle", this._onPropertyChanged, this);
|
|
this._cropAlphaToggle.node.on("toggle", this._onPropertyChanged, this);
|
|
this._enableFogToggle.node.on("toggle", this._onPropertyChanged, this);
|
|
}
|
|
|
|
onDisable() {
|
|
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._lightWidthSlider.node.off("slide", this._onPropertyChanged, this);
|
|
this._lightAngleSlider.node.off("slide", this._onPropertyChanged, this);
|
|
|
|
this._enableGradientToggle.node.off("toggle", this._onPropertyChanged, this);
|
|
this._cropAlphaToggle.node.off("toggle", this._onPropertyChanged, this);
|
|
this._enableFogToggle.node.off("toggle", this._onPropertyChanged, this);
|
|
}
|
|
|
|
start() {
|
|
this._onPropertyChanged();
|
|
}
|
|
|
|
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)}`;
|
|
this._blueSliderLabel.string = `${this._blueSlider.progress.toFixed(2)} | ${Math.round(255 * this._blueSlider.progress)}`;
|
|
this._alphaSliderLabel.string = `${this._alphaSlider.progress.toFixed(2)} | ${Math.round(255 * this._alphaSlider.progress)}`;
|
|
this._lightWidthSliderLabel.string = `${this._lightWidthSlider.progress.toFixed(2)}`;
|
|
|
|
let angle = 180 * this._lightAngleSlider.progress;
|
|
this._lightAngleSliderLabel.string = `${this._lightAngleSlider.progress.toFixed(2)} | ${angle.toFixed(2)}`;
|
|
|
|
// 通知子节点更新材质
|
|
this._examplesParentNode.children.forEach(childNode => {
|
|
childNode.emit("on_property_change", <FlashLightUBO>{
|
|
lightColor: 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)
|
|
),
|
|
lightAngle: angle,
|
|
lightWidth: this._lightWidthSlider.progress,
|
|
enableGradient: this._enableGradientToggle.isChecked,
|
|
cropAlpha: this._cropAlphaToggle.isChecked,
|
|
enableFog: this._enableFogToggle.isChecked
|
|
});
|
|
});
|
|
}
|
|
}
|