egret GUI 和 egret Wing 是我看到h5 最渣的设计

一个抄袭FlexLite抄的连自己思想都没有,别人精髓都不懂的垃圾框架。也不学学MornUI,好歹有点自己想法。

 

先来个最小可用集合吧:

 

1. egret create legogame --type gui。生成一个带gui的项目。

2. 用webstorm打开这个傻逼项目。

3. 修改theme.thm:

{
    "skins":
    {
        "egret.gui.Button":"skins.simple.ButtonSkin"
    }
}

4. 修改resource.json

{
    "groups":[
    {
        "keys":"button_disabled_png,button_down_png,button_normal_png,bgImage",
        "name":"preload"
    }],
    "resources":[
    {
        "name":"button_disabled_png",
        "scale9grid":"3,4,14,13",
        "type":"image",
        "url":"assets/simple/NormalButton/button_disabled.png"
    },
    {
        "name":"button_down_png",
        "scale9grid":"4,3,13,14",
        "type":"image",
        "url":"assets/simple/NormalButton/button_down.png"
    },
    {
        "name":"button_normal_png",
        "scale9grid":"4,3,13,15",
        "type":"image",
        "url":"assets/simple/NormalButton/button_normal.png"
    },
    {
        "name":"bgImage",
        "type":"image",
        "url":"assets/bg.jpg"
    }
    ]
}

5. 进入resource/assets/simple目录,保留NormalButton,其他删掉。进入src/skins/simple/ 除了buttonskin.exml,其他删掉。

6. 进入ShowcaseSkin.exml, 删除List,得到:

<?xml version='1.0' encoding='utf-8'?>
<e:Skin width="480" height="800" xmlns:e="http://ns.egret-labs.org/egret" xmlns:w="http://ns.egret-labs.org/wing">
    <w:HostComponent name="egret.gui.SkinnableComponent"/>
    <w:Declarations/>
    <e:states>
        <e:State name="normal"/>
        <e:State name="disabled"/>a
    </e:states>
    <e:Button id="btnShowMessage" label="click" y="50" horizontalCenter="0"/>
</e:Skin>

7. 进入Showcase.ts,除了button,其他都删除:

class Showcase extends egret.gui.SkinnableComponent {

    public constructor() {
        super();
        this.skinName = "skins.scene.ShowcaseSkin";
    }

    public btnShowMessage:egret.gui.Button;

    public partAdded(partName:string, instance:any):void {
        super.partAdded(partName, instance);
    }
}

8. 在legogame目录下面,运行egret build, egret startserver。得到只有一个button的结果。

 

这个就是最小可用集:Mininum available set。

 

继续研究resource.json和theme.thm是不是多余的。还有那个buttonskin.exml 文件

 

你可能感兴趣的:(GUI)