使用urho3d的编辑器编辑UI思路及使用

使用urho3d其中UI原生编辑器，那么就需要了解怎么使用

urho3d的UI是直接使用一张png图片在加相应的DefaultStyle.xml来进行设计 看看机构

<element type="BorderImage" >
        <attribute name="Texture" value="Texture2D;Textures/UI.png" />
        <attribute name="Blend Mode" value="alpha" />
    </element>
    <element type="Button" style="BorderImage">
        <attribute name="Image Rect" value="16 0 32 16" />
        <attribute name="Border" value="4 4 4 4" />
        <attribute name="Pressed Image Offset" value="16 0" />
        <attribute name="Hover Image Offset" value="0 16" />
        <attribute name="Pressed Child Offset" value="-1 1" />
    </element>

首先明确urho3d原生UI是使用像素点来做处理的

这里 BorderImage就是一整张UI.png图片了 看看Button他的类型是BorderImage, Image Rect: 默认的状态的取的像素范围 这个就是一整张图片

大体就是这里，如果我们想定义自己的按钮可以这里

<element type="BButon" style="Button" auto="false">
        <attribute name="Image Rect" value="288 0 304 16" />
        <attribute name="Border" value="4 4 4 4" />
        <attribute name="Pressed Image Offset" value="1 1" />
        <attribute name="Hover Image Offset" value="0 0" />
        <attribute name="Pressed Child Offset" value="-1 1" />
    </element>

下来就可以在编辑器里面直接设置这个东东了 有时候设置不一定生效，要保存

之后重新打开才会生效，需要自己尝试看看