Ogre 1.7 SdkTrays獨立使用教學

從1.7版開始
Ogre就不使用長久以來合作的CEGUI做為預設的GUI
而開始使用擴充後的Overlay做為範例使用的GUI
但是這個範例用的GUI是包含在SampleBrower程式碼的一部分
雖然可以拆開來使用
不過因為Ogre官方教學檔大剌剌地說，不適用於初學者
這是配合SampleBrower的教學範例
所以造成了舊版使用者的使用困難，包含我
害著明明進展到了1.7，還是只能把CEGUIRederner挖出來用
並不是使用SampleBrower不好，只是最終還是得成為一個獨立的執行檔
而非掛在SampleBrower底下，像是範例
這是一定要突破的關卡

因此，在詳細研究過SdkTrays在SdkSample.h與SampleBrower裡的實作後
想辦法把它移殖到了原先1.6版之前使用的ExampleFrameListener中
沒有想像中的難，畢竟是Ogre原生的東西，相容性自然很高
甚至可以好好參考SdkTrays的寫法後
自己寫一個相似SdkTrays但卻是屬於自己的GUI工具
不過，這都是後話了，以下是詳細的使用方式

另外附記，這個教學也不是給完全初學者，至少要看完看懂這篇官方教學
http://www.ogre3d.org/tikiwiki/Basic+Tutorial+4&structure=Tutorials
了解FrameListener的作用
SdkTrays基本使用上與CEGUI類似
需要在FrameListener裡進行一些滑鼠的設定
也就是在FrameListener加入繼承OIS::MouseListener
並加入mousePressed、mouseMoved與mouseReleased的函數
不過沒辦法進行輸入字串是這個類別的缺點
所以沒有keyboard相關的輸入，基本上KeyListener可以不用加
然後SdkTrays裡有個SdkTrayListener物件屬於Listener
所以也要繼承SdkTrayListener

以SimpleFrameListener為例
以下是SampleFrameListener標頭檔的範例程式碼
using namespace OgreBites; class SampleFrameListener : public ExampleFrameListener, public SdkTrayListener, public OIS::MouseListener { public: SampleFrameListener(Ogre::RenderWindow* win, Ogre::Camera* cam); ~SampleFrameListener(); bool mousePressed(const OIS::MouseEvent& evt, OIS::MouseButtonID id); bool mouseReleased(const OIS::MouseEvent& evt, OIS::MouseButtonID id); bool mouseMoved(const OIS::MouseEvent& evt); protected: SdkTrayManager* mTrayMgr; }
再來就是SampleFrameListener的實作部分
SampleFrameListner::SampleFrameListener(Ogre::RenderWindow* win, Ogre::Camera* cam) : ExampleFrameListener(win,cam,true,true) { } SampleFrameListner::~SampleFrameListener() { } bool SampleFrameListner::frameRenderingQueued(const FrameEvent& evt) { } bool SampleFrameListner::frameStarted(const FrameEvent &evt) { } bool SampleFrameListner::mousePressed(const OIS::MouseEvent& evt, OIS::MouseButtonID id) { if (mTrayMgr->injectMouseDown(evt, id)) return true; /* normal mouse processing here... */ return true; } bool SampleFrameListner::mouseReleased(const OIS::MouseEvent& evt, OIS::MouseButtonID id) { if (mTrayMgr->injectMouseUp(evt, id)) return true; /* normal mouse processing here... */ return true; } bool SampleFrameListner::mouseMoved(const OIS::MouseEvent& evt) { if (mTrayMgr->injectMouseMove(evt)) return true; /* normal mouse processing here... */ return true; }
接下來就是填空啦
建構式裡，填入底下這些
//建立SdkTrayManager管理物件，並把Listner指向自己 mTrayMgr = new SdkTrayManager("InterfaceName", mWindow, mMouse, this); //滑鼠的Listener也指向自己 mMouse->setEventCallback(this); //因為不是使用SampleBrower載入字型資源，所以要自行載入 Ogre::FontManager::getSingleton().getByName("SdkTrays/Caption")->load(); Ogre::FontManager::getSingleton().getByName("SdkTrays/Value")->load();
不過為了避免離不開程式，請在frameStarted函式裡加入下面函式
//鍵盤訊息取得 mKeyboard->capture(); //當按下鍵盤的ESC後，結束FrameListener return mKeyboard->isKeyDown(OIS::KC_ESCAPE) ? false : true;
編譯後執行
就可以看到滑鼠指標到處動…才怪 XD
必須還要在frameRenderingQueued裡加入這兩行
//加入SdkTray的更新事件 mTrayMgr->frameRenderingQueued(evt); //加入滑鼠的補捉 mMouse->capture();
這樣，滑鼠就可以動啦

不過這樣當然不夠，我們可以加入一些東西
例如，按鈕與文字
在建構式裡，再加入
//加入標籤，在畫面左上角(TL_TOPLEFT)，名稱為MyLabel，內容為Show Number 1,2,3,，標籤寬度240 mTrayMgr->createLabel(TL_TOPLEFT, "MyLabel", "Show Number: 1,2,3,", 240); //加入標籤，在畫面左上角(TL_TOPLEFT)，名稱為MyButton，顯示為Click Me! mTrayMgr->createButton(TL_TOPLEFT, "MyButton", "Click Me!");
編譯後的就可以看到左上角有一個視窗，然後也有個按鈕可以按
不過，這個按鈕並沒有任何的作用
然後我們可以發現，我們加入了兩行元件
它們的排列也是兩行，而不是接續在右方
這是SdkTray GUI的特性
其次，可以放置的位置也不自由
主要有左上，上方，右上，左方，中間，右方，左下，下方，右下
共九個位置
不能指定視窗在指定的位置
以上的特性換句話說，用在一般的範例還好
複雜一點的就很難使用了

OK東西創造出來了，我們想改變內容
還要按鈕按下去有動作要怎麼做呢？
我並沒有在SampleBrower裡找到類似的Widget Event作法
範例裡面的作法我也很不能理解
所以我使用我的作法
首先在frameStarted函數取得剛剛創建的Label與Button
接著當按鈕按下時，標籤就變更文字
程式碼如下：
//取得標籤p OgreBites::Panel* p = (OgreBites::Panel*)(mTrayMgr->getWidget("MyLabel")); //取得按鈕b OgreBites::Button* b = (OgreBites::Button*)(mTrayMgr->getWidget("MyButton")); //如果b被按下 if( (b->getState() == OgreBites::BS_DOWN) ) p->setCaption("Button Down"); else p->setCaption("Show Number: 1,2,3,");
也就是在frameStarted進行取得Widget再更新
當然自己繼承SdkTray再創立WidgetEvent的更新也行
不過這方面還在研究中
至於其它像是Checkbox、TextBox、ParamsPanel等
建議就直接從Sample裡的原始碼去研究囉
我有空再補充列表吧