Ogre笔记十：CELayoutEditor 的使用方法

CELayoutEditor编辑是所见即所得的

首先，新建

新建好一个项目后，会有一个Root的跟标签（窗口）

然后你需要向这个空白窗口中

添加若干window

为新窗口命名（这个命名类似windows里面的文件目录）

选择窗口种类（其中有几种不同的皮肤）

这里先展示3种不同风格的Framewindow和Button

下面我们来做一个登录的界面：

我们保存到C:\OgreSDK\media\gui\Login.layout

我们可以用记事本打开Login.layout看看：

<?xml version="1.0" encoding="UTF-8"?><GUILayout >    <Window Type="DefaultWindow" Name="Root/main" >        <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />        <Property Name="UnifiedAreaRect" Value="{{0.000912894,0},{0.000600448,0},{1.00091,0},{1.0006,0}}" />        <Window Type="TaharezLook/FrameWindow" Name="Root/logins" >            <Property Name="Font" Value="DejaVuSans-10" />            <Property Name="Text" Value="Welcome" />            <Property Name="Alpha" Value="0.85" />            <Property Name="TitlebarFont" Value="Commonwealth-10" />            <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />            <Property Name="TitlebarEnabled" Value="True" />            <Property Name="UnifiedAreaRect" Value="{{0.306762,0},{0.142863,0},{0.769488,0},{0.592477,0}}" />            <Window Type="TaharezLook/StaticText" Name="Root/logins/static" >                <Property Name="Font" Value="DejaVuSans-10" />                <Property Name="Text" >Welcome ! Please login first !Account :Password :</Property>                <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />                <Property Name="UnifiedAreaRect" Value="{{0.0345544,0},{0.158096,0},{0.964979,0},{0.72209,0}}" />                <Window Type="TaharezLook/Editbox" Name="Root/logins/static/name" >                    <Property Name="Font" Value="DejaVuSans-10" />                    <Property Name="MaxTextLength" Value="1073741823" />                    <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />                    <Property Name="UnifiedAreaRect" Value="{{0.369242,0},{0.3771,0},{0.739005,0},{0.548438,0}}" />                </Window>                <Window Type="TaharezLook/Editbox" Name="Root/logins/static/password" >                    <Property Name="MaxTextLength" Value="1073741823" />                    <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />                    <Property Name="UnifiedAreaRect" Value="{{0.370188,0},{0.617992,0},{0.739951,0},{0.789331,0}}" />                </Window>            </Window>            <Window Type="TaharezLook/Button" Name="Root/logins/quit" >                <Property Name="Font" Value="DejaVuSans-10" />                <Property Name="Text" Value="exit" />                <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />                <Property Name="UnifiedAreaRect" Value="{{0.630493,0},{0.793219,0},{0.880493,0},{0.920019,0}}" />            </Window>            <Window Type="TaharezLook/Button" Name="Root/logins/login" >                <Property Name="Font" Value="DejaVuSans-10" />                <Property Name="Text" Value="login" />                <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />                <Property Name="UnifiedAreaRect" Value="{{0.08582,0},{0.790217,0},{0.33582,0},{0.920245,0}}" />            </Window>        </Window>    </Window></GUILayout>

最后我直接用上一节中的代码

修改ExampleApp.cpp中代码：

//*************************************************************************************************************//                       用.xml创建界面         mEditorGuiSheet = CEGUI::WindowManager::getSingleton().loadWindowLayout((CEGUI::utf8*)"TutoralGui.xml");mGUISystem->setGUISheet(mEditorGuiSheet);CEGUI::PushButton* quitButton=(CEGUI::PushButton*)CEGUI::WindowManager::getSingleton().getWindow((CEGUI::utf8*)"Quit");setupEventHandlers();}void TutorialApplication::createFrameListener(void){mFrameListener = new GuiFrameListener(mWindow, mCamera, mGUIRenderer);mRoot->addFrameListener(mFrameListener);}void TutorialApplication::setupEventHandlers(void){CEGUI::WindowManager& wmgr = CEGUI::WindowManager::getSingleton();wmgr.getWindow((CEGUI::utf8*)"Quit")->subscribeEvent(CEGUI::PushButton::EventClicked,CEGUI::Event::Subscriber(&TutorialApplication::handleQuit, this));}

为：

//                       用.xml创建界面         mEditorGuiSheet = CEGUI::WindowManager::getSingleton().loadWindowLayout((CEGUI::utf8*)"Login.layout");mGUISystem->setGUISheet(mEditorGuiSheet);CEGUI::PushButton* quitButton=(CEGUI::PushButton*)CEGUI::WindowManager::getSingleton().getWindow((CEGUI::utf8*)"Root/logins/quit");setupEventHandlers();}void TutorialApplication::createFrameListener(void){mFrameListener = new GuiFrameListener(mWindow, mCamera, mGUIRenderer);mRoot->addFrameListener(mFrameListener);}void TutorialApplication::setupEventHandlers(void){CEGUI::WindowManager& wmgr = CEGUI::WindowManager::getSingleton();wmgr.getWindow((CEGUI::utf8*)"Root/logins/quit")->subscribeEvent(CEGUI::PushButton::EventClicked,CEGUI::Event::Subscriber(&TutorialApplication::handleQuit, this));}

最后效果：