hengyang_client/wb_new_ui/plugins/FairyGUI-Plugin-Gradient-Text-master/main.ts

import { FairyGUI, FairyEditor, UnityEngine, System } from 'csharp';
const puerts_1 = require("puerts");

const App = FairyEditor.App;

App.pluginManager.LoadUIPackage(App.pluginManager.basePath + "/" + eval("__dirname") + '/CustomInspector')

enum GradientDir {
    up = "up",
    down = "down",
    left = "left",
    right = "right",
}

class GradientColorInspector extends FairyEditor.View.PluginInspector {
    private check_vertical: FairyGUI.GButton;
    private check_horizontal: FairyGUI.GButton;
    private ctrl_vertical: FairyGUI.Controller;
    private ctrl_horizontal: FairyGUI.Controller;
    private inputs: { [key: string]: FairyEditor.Component.ColorInput } = {};
    private colors: { [key: string]: UnityEngine.Color } = {};
    private last_obj: FairyEditor.FObject;
    private readonly dirs = [GradientDir.up, GradientDir.left, GradientDir.right, GradientDir.down]
    private gradient_text: string;
    private readonly allowObjectTypes = ["text", "richtext", "inputtext", "Button", "Label"];
    private color32List: System.Collections.Generic.List$1<UnityEngine.Color32>;

    public constructor() {
        super();
        
        let List = puerts_1.$generic(System.Collections.Generic.List$1, UnityEngine.Color32);
        this.color32List = new List();
        this.panel = FairyGUI.UIPackage.CreateObject("CustomInspector", "GradientColor").asCom;
        this.ctrl_vertical = this.panel.GetController("vertical");
        this.ctrl_horizontal = this.panel.GetController("horizontal");
        for (const key in this.dirs) {
            let dir = this.dirs[key]
            let n = this.panel.GetChild(dir) as FairyGUI.GComponent
            let input = n.GetChild("color") as FairyEditor.Component.ColorInput
            this.inputs[dir] = input;
            input.AddEventListener(FairyEditor.FEvents.SUBMIT, (context: FairyGUI.EventContext) => {
                console.log(dir, input.colorValue);
                this.set_color(dir, input.colorValue);
            })
        }

        this.check_vertical = this.panel.GetChild("check_vertical").asButton;
        this.check_vertical.selected = false
        this.check_vertical.onChanged.Add(() => {
            let obj = App.activeDoc.inspectingTarget
            let color = this.get_object_color(obj);
            if (!this.colors[GradientDir.up]) {
                this.init_dir_color(GradientDir.up, color);
            }
            if (!this.colors[GradientDir.down]) {
                this.init_dir_color(GradientDir.down, color);
            }

            this.update_colors()
        });
        this.check_horizontal = this.panel.GetChild("check_horizontal").asButton;
        this.check_horizontal.selected = false
        this.check_horizontal.onChanged.Add(() => {
            if (this.check_horizontal.selected) {
                let obj = App.activeDoc.inspectingTarget
                let color = this.get_object_color(obj);
                if (!this.colors[GradientDir.left]) {
                    this.init_dir_color(GradientDir.left, color);
                }
                if (!this.colors[GradientDir.right]) {
                    this.init_dir_color(GradientDir.right, color);
                }
            }
            this.update_colors()
        });

        this.updateAction = () => { return this.update_colors(); };
    }

    private get_text_field(gObject: FairyEditor.FObject): FairyEditor.FTextField {
        if (gObject.objectType != "component") {
            return gObject as FairyEditor.FTextField;
        }
        
        let gComponent = gObject as FairyEditor.FComponent;

        let gButton = gComponent.extention as FairyEditor.FButton;
        if (gButton != null) {
            console.log("gButton");
            return gButton.GetTextField();
        }

        let gLabel = gComponent.extention as FairyEditor.FLabel;
        if (gLabel != null) {
            console.log("gLabel");
            return gLabel.GetTextField();
        }

        return null;
    }

    private get_object_color(gObject: FairyEditor.FObject): UnityEngine.Color {
        let inputField = this.get_text_field(gObject);
        return inputField != null ? inputField.color : new UnityEngine.Color(1.0, 1.0, 1.0, 1.0);
    }

    private init_dir_color(dir: GradientDir, color: UnityEngine.Color) {
        this.colors[dir] = color;
        this.inputs[dir].colorValue = color
    }

    private update_colors(): boolean {
        let obj = App.activeDoc.inspectingTarget as FairyEditor.FObject;

        if (!obj) {
            return false;
        }

        let objTypeName = this.getObjectTypeName(obj);

        if (this.allowObjectTypes.indexOf(objTypeName) < 0) {
            return false;
        }

        if (obj != this.last_obj) {
            this.init_data(obj);
            this.last_obj = obj;
            this.update_color(obj, true);
        } else {
            this.update_color(obj, false);
        }


        return true; //if everything is ok, return false to hide the inspector
    }

    private set_color(dir: GradientDir, color: UnityEngine.Color) {
        if (this.colors[dir] == color) return;
        this.colors[dir] = color;
        this.update_colors()
    }

    private update_color(obj: FairyEditor.FObject, force: boolean) {
        let color = this.get_color_text()
        if (this.gradient_text == color) {
            if (!force) {
                return;
            }
        } else {
            this.gradient_text = color;

            let customData = obj.GetProperty("customData");
            let customDataObj = null;
    
            if (customData != null && customData != "") {
                try {
                    customDataObj = JSON.parse(obj.customData)
                } catch (error) {
                    console.log("json error:", error)
                    customDataObj = {};
                }
            } else {
                customDataObj = {};
            }
    
            if (color.length > 0) {
                customDataObj["gradient"] = color
            } else {
                delete customDataObj["gradient"]
            }
    
            let json = "";
    
            if (Object.keys(customDataObj).length > 0) {
                json = JSON.stringify(customDataObj);
            }
    
            obj.docElement.SetProperty("customData", json);
        }
        
        let textField = this.get_text_field(obj);
        if (textField == null) {
            return;
        }

        let tf = textField.textFormat;
        tf.gradientColor = this.get_color32_array();
        // textField.textFormat = tf;

        // 这里无法直接设置textFormat 用这种方式间接触发其更新
        let text = textField.text;
        textField.text = "";
        textField.text = text;
    }

    // 获取对象类型
    private getObjectTypeName(gObject: FairyEditor.FObject): string {
        let gComponent = gObject as FairyEditor.FComponent;
        if (gComponent != null && gComponent.extention != null) {
            return gComponent.extention._type;
        }

        return gObject.objectType;
    }

    private get_color32_array(): System.Array$1<UnityEngine.Color32> {
        if (!this.check_vertical.selected && !this.check_horizontal.selected) {
            return null;
        }
            
        this.color32List.Clear();

        if (this.check_vertical.selected) {
            if (this.check_horizontal.selected) {
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.up))); // 左上角
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.left))); // 左下角
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.right))); // 右上角
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.down))); // 右下角
            } else {
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.up)));
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.down)));
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.up)));
                this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.down)));
            }
        } else if (this.check_horizontal.selected) {
            this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.left)));
            this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.left)));
            this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.right)));
            this.color32List.Add(this.get_color_32(this.get_dir_color(GradientDir.right)));
        }

        return this.color32List.ToArray();
    }

    private get_color_text(): string {
        if (!this.check_vertical.selected && !this.check_horizontal.selected) return "";
        let s = ""

        if (this.check_vertical.selected) {
            if (this.check_horizontal.selected) {
                s += FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.up)) // 左上角
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.left)) // 左下角
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.right)) // 右上角
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.down)) // 右下角
            } else {
                s += FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.up))
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.down))
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.up))
                s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.down))
            }
        } else if (this.check_horizontal.selected) {
            s += FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.left))
            s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.left))
            s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.right))
            s += "," + FairyEditor.ColorUtil.ToHexString(this.get_dir_color(GradientDir.right))
        }

        return s;
    }

    private get_color_32(c: UnityEngine.Color): UnityEngine.Color32 {
        let color32 = new UnityEngine.Color32();
        color32.r = UnityEngine.Mathf.Round(UnityEngine.Mathf.Clamp01(c.r) * 255.0);
        color32.g = UnityEngine.Mathf.Round(UnityEngine.Mathf.Clamp01(c.g) * 255.0);
        color32.b = UnityEngine.Mathf.Round(UnityEngine.Mathf.Clamp01(c.b) * 255.0);
        color32.a = UnityEngine.Mathf.Round(UnityEngine.Mathf.Clamp01(c.a) * 255.0);

        return color32;
    }

    private get_dir_color(dir: GradientDir): UnityEngine.Color {
        if (this.colors[dir]) {
            return this.colors[dir]
        }
        let obj = App.activeDoc.inspectingTarget as FairyEditor.FTextField;
        return obj.color
    }

    private init_data(obj: FairyEditor.FObject) {
        // 使用customData
        // 使用ubb数据
        // 使用文本颜色
        // this.check_vertical.selected = false
        // this.check_horizontal.selected = false
        this.colors = {}
        this.gradient_text = ""
        let customData = obj.GetProperty("customData");
        let customDataObj = null;

        if (customData != null && customData != "") {
            try {
                customDataObj = JSON.parse(obj.customData)
            } catch (error) {
                console.log("json error:", error)
            }
        }

        if (!customDataObj || !customDataObj.gradient) {
            this.check_vertical.selected = false;
            this.check_horizontal.selected = false;
            return;
        }

        this.gradient_text = customDataObj.gradient;

        let reg = /(#\w+)/g
        let r: RegExpExecArray | null;
        let i = 0
        while (r = reg.exec(this.gradient_text)) {
            let color_hex = r[1];
            let dir = this.dirs[i]
            this.colors[dir] = FairyEditor.ColorUtil.FromHexString(color_hex)
            this.inputs[dir].colorValue = this.colors[dir]
            i++
        }

        // 顺序为 左上角、左下角、右上角、右下角
        let color_left_up = FairyEditor.ColorUtil.ToHexString(this.colors[GradientDir.up]);
        let color_left_down = FairyEditor.ColorUtil.ToHexString(this.colors[GradientDir.left]);
        let color_right_up = FairyEditor.ColorUtil.ToHexString(this.colors[GradientDir.right]);
        let color_right_down = FairyEditor.ColorUtil.ToHexString(this.colors[GradientDir.down]);

        if (color_left_up == color_right_up && color_left_down == color_right_down) {
            this.check_horizontal.selected = false;
        } else {
            this.check_horizontal.selected = true;
        }

        if (color_left_up == color_left_down && color_right_up == color_right_down) {
            this.check_vertical.selected = false;
        } else {
            this.check_vertical.selected = true;
        }
    }
}

//Register a inspector
App.inspectorView.AddInspector(() => new GradientColorInspector(), "GradientColorJS", "渐变");
//Condition to show it
App.docFactory.ConnectInspector("GradientColorJS", "mixed", false, false);