OGRE+CEGUI游戏教程(1)----GUI框架

 转载文章请注明出处：http://blog.csdn.net/pizzazhang 

  源码和可执行程序链接http://code.google.com/p/pizzaprojects/downloads/list

  今天起我会陆续更新一些原创的Ogre结合CEGUI的游戏教程。想到什么就做什么，没有固定的内容，不过基本是游戏里可以用到的。 

  请先确保学习完了Ogre Wiki上的基础和中级教程后再来讨论这里的教程。因为一些基础的Ogre知识这里不会多做解释。

  今天先建立一个用来演示的框架。其中我们已经有了BaseFramework框架，这个框架里已经帮你弄好了一些资源、场景管理器等设置，当然还有一个Overlay，但我们的GUI不打算使用Overlay，所以我们需要一个GUI框架。所以赶紧来做一个GUI框架使用吧！

 

MyGUISystem.h

class MyGUISystem{public:virtual ~MyGUISystem();//把OIS的鼠标ID转换成CEGUI的鼠标IDstatic CEGUI::MouseButton convertButton(OIS::MouseButtonID buttonId);//销毁资源bool destroy();//初始化CEGUI， 必须在RenderWindow创始后初始, 只在第一次调用有效bool init();//GUI更新void update(float timeSinceLastFrame);/**根据图片构造Imagesetparams:@name创建的Imageset名称, 全局唯一@filename创建Imageset的图片名称*/static void createImageset(const std::string& name, const std::string& filename);//加载layoutbool loadLayout(const std::string& layoutName);//得到指定名称的窗口inline CEGUI::Window* getWindow(const std::string& windowName) {return getGUIWindowManager()->getWindow(windowName); }//销毁指定名称的窗口bool destroyWindow(const std::string& windowName);/**给指定名称的窗口设定属性params:@windowName窗口名称@keyXML标签  key值@valueXML标签  value值*/static void setProperty(const std::string& windowName, const std::string& key, const std::string& value);/**注册CEGUI控件事件params:@windowName要注册事件的控件名称@eventName注册的控件事件@subscriber事件触发时的回调函数*/static void subscribeEvent(const CEGUI::String& windowName, const CEGUI::String &eventName, const CEGUI::Event::Subscriber &subscriber);//得到窗口管理器，用来获取管理GUI的窗口对象的管理器inline CEGUI::WindowManager* getGUIWindowManager(){return CEGUI::WindowManager::getSingletonPtr();}// 注入CEGUI鼠标点击事件bool injectMouseButtonDown(CEGUI::MouseButton id) {return mGUISystem->injectMouseButtonDown(id);}bool injectMouseButtonUp(CEGUI::MouseButton id) {return mGUISystem->injectMouseButtonUp(id); }// 注入CEGUI鼠标移动事件bool injectMouseMove(float xRel, float yRel){return mGUISystem->injectMouseMove(xRel, yRel);}//显示/隐藏GUI鼠标inline void showGUICursor(bool showCursor){if(showCursor){CEGUI::MouseCursor::getSingleton().show();}else{CEGUI::MouseCursor::getSingleton().hide();}//隐藏系统鼠标ShowCursor(false);}/**设置默认鼠标样式params:@schemeName样式名称@mouseName样式中的鼠标名称*/inline void setDefaultMouseCursor(const std::string& schemeName, const std::string& mouseName) {CEGUI::System::getSingleton().setDefaultMouseCursor(schemeName, mouseName);CEGUI::MouseCursor::getSingleton().setImage(mGUISystem->getDefaultMouseCursor());}public:/**单件实例方法*/static MyGUISystem* getSingletonPtr(){if(ms_singleton == NULL){ms_singleton = new MyGUISystem;}return ms_singleton;}private://单件实例指针static MyGUISystem* ms_singleton;private:CEGUI::OgreRenderer* mGUIRender;CEGUI::System* mGUISystem;private:/**私有化实例函数，实现单件*/MyGUISystem():mGUIRender(0), mGUISystem(0){}MyGUISystem(const MyGUISystem&);MyGUISystem& operator=(const MyGUISystem&);};

这里采用一个简单的单价模式来实现GUI系统。 其中最重要的方法是 loadLayout，createImageset ， setProperty和subscribeEvent。

 loadLayout方法主要是载入layout，但是传入的参数是指定layout的根窗口，把它作为GUISheet进行显示。

createImageset是载入图片资源让CEGUI转化为纹理供有StaticImage的地方使用。

setProperty主要用来设置窗口的属性，尤其是StaticImage的设置。

subscribeEvent用来注册GUI事件。

 

下面是实现文件：

MyGUISystem.cpp

#include "MyGUISystem.h"#include <cassert>//-----------------------------------------------------------------------------MyGUISystem* MyGUISystem::ms_singleton = NULL;//-----------------------------------------------------------------------------MyGUISystem::~MyGUISystem(){destroy();}//-----------------------------------------------------------------------------bool MyGUISystem::destroy(){CEGUI::OgreRenderer::destroySystem();delete ms_singleton;ms_singleton = 0;return true;}//-----------------------------------------------------------------------------CEGUI::MouseButton MyGUISystem::convertButton(OIS::MouseButtonID buttonId){switch(buttonId){case OIS::MB_Left:return CEGUI::LeftButton;case OIS::MB_Right:return CEGUI::RightButton;case OIS::MB_Middle:return CEGUI::MiddleButton;default:return CEGUI::LeftButton;}}//-----------------------------------------------------------------------------bool MyGUISystem::init(){if(!mGUIRender){mGUIRender = &CEGUI::OgreRenderer::bootstrapSystem();mGUISystem = CEGUI::System::getSingletonPtr();//加载GUI主题， 设置默认参数CEGUI::Imageset::setDefaultResourceGroup("Imagesets");CEGUI::Font::setDefaultResourceGroup("Fonts");CEGUI::Scheme::setDefaultResourceGroup("Schemes");CEGUI::WidgetLookManager::setDefaultResourceGroup("LookNFeel");CEGUI::WindowManager::setDefaultResourceGroup("Layouts");CEGUI::SchemeManager::getSingleton().create("TaharezLook.scheme");CEGUI::FontManager::getSingleton().create("SimHei-14.font");mGUISystem->setDefaultFont("SimHei-14");/* *此处设置图片资源(Imageset) *///设置默认鼠标样式setDefaultMouseCursor("TaharezLook", "MouseArrow");//设置GUI鼠标是否可见showGUICursor(true);return true;}return false;}//-----------------------------------------------------------------------------void MyGUISystem::update(float timeSinceLastFrame){mGUISystem->injectTimePulse(timeSinceLastFrame);}//-----------------------------------------------------------------------------void MyGUISystem::createImageset(const std::string& name, const std::string& filename){CEGUI::ImagesetManager::getSingleton().createFromImageFile(name, filename);}//-----------------------------------------------------------------------------bool MyGUISystem::loadLayout(const std::string& layoutName){CEGUI::Window *guiSheet;// 检测给定layout的文件是否加载,没有加载则加载if(!getGUIWindowManager()->isWindowPresent(layoutName)){// 从 .layout脚本文件读取一个UI布局设计，并将其放置到GUI资源组中。guiSheet = getGUIWindowManager()->loadWindowLayout(layoutName + ".layout");}else{// 如果已经加载则直接显示guiSheet = getGUIWindowManager()->getWindow(layoutName);}// 接下来我们告诉CEGUI显示哪份UI布局。当然我们可以随时更换显示的UI布局。mGUISystem->setGUISheet(guiSheet);//显示UI布局guiSheet->show();return true;}//-----------------------------------------------------------------------------bool MyGUISystem::destroyWindow(const std::string& windowName){getGUIWindowManager()->destroyWindow(windowName);return true;}//-----------------------------------------------------------------------------void MyGUISystem::subscribeEvent(const CEGUI::String& windowName,const CEGUI::String &eventName, const CEGUI::Event::Subscriber &subscriber){CEGUI::WindowManager::getSingleton().getWindow(CEGUI::String(windowName))->subscribeEvent(eventName,subscriber);}//-----------------------------------------------------------------------------void MyGUISystem::setProperty(const std::string& windowName, const std::string& key, const std::string& value){MyGUISystem::getSingletonPtr()->getWindow(windowName)->setProperty(key, value);}//-----------------------------------------------------------------------------

update中我们让GUI系统更新时间，如果你需要实现GUI的动画效果，那么这个方法必须在Ogre的每帧进行调用。

在init中我们设置了GUI的一些默认资源，其中的字体我使用的是黑体14号。这是一个中文字体，CEGUI本身是使用UTF-8编码的，那么理论上是可以显示中文的。但是还需要一些小小的步骤才行。

 

CEGUI中显示中文的步骤：

1. 将编辑好的layout文件使用VC Studio打开（不要使用记事本），然后在文件->高级保存选项中把文件保存为UTF-8。

2.从WINDOW/Fonts文件夹中找一个中文字体的文件， 比如我使用的simhei.ttf

3.新建一个xml字体文件， 比如SimHei-14.Font，然后写上：

<?xml version="1.0" ?><Font Name="SimHei-14" Filename="simhei.ttf" Type="FreeType" Size="14" NativeHorzRes="1024" NativeVertRes="768" AutoScaled="true"/>

Name就是我们需要在程序中使用的字体名。

4.之后可以直接在layout文件中 有Text属性的地方使用中文， 如果要在代码中设置Text的中文，需要这么使用：

CEGUI::String str = (CEGUI::utf8*)Ogre::UTFString(L"你需要的中文").asUTF8_c_str()

 

这个GUI框架的使用很简单， 在Ogre窗口配置好后，使用MyGUISystem::getSingletonPtr()->init()对GUI系统初始化， 在Ogre渲染循环里对GUI系统update, 然后就可以使用了。

 

下篇文章会使用这个框架做一个游戏里要找NPC对话， 点击NPC后镜头与NPC拉近，然后弹出GUI对话框， 如果要退出游戏按ESC弹出退出的GUI菜单，并且带有GUI的动画效果。