Difference between revisions of "Game chat box"
From CEGUI Wiki - Crazy Eddie's GUI System (Open Source)
| Line 1: | Line 1: | ||
| − | + | The following .layout defines a FrameWindow containing two widgets; a Listbox in the upper region for chat history and an Editbox at the lower region for text input. | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
'''chat.layout''' | '''chat.layout''' | ||
| Line 32: | Line 27: | ||
</pre> | </pre> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | ''' | + | '''InitialiseChatBox()''' |
<pre> | <pre> | ||
| − | + | // A helper variable | |
| + | CEGUI::WindowManager& winMgr = CEGUI::WindowManager::getSingleton(); | ||
| + | |||
| + | // Load the chat layout and add it to the GUI sheet | ||
| + | mMainWindow = winMgr.loadWindowLayout("chat.layout"); | ||
if (mMainWindow) | if (mMainWindow) | ||
| − | + | CEGUI::System::getSingleton().getGUISheet()->addChildWindow(mMainWindow); | |
| − | CEGUI:: | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | // The only event we're interested is when the <ENTER> key is pressed | |
| + | // This will call upon the EditTextAccepted() function to add the text to the Listbox | ||
| + | CEGUI::Window* editBox = winMgr.getWindow("/Chat/Wnd/Edit"); | ||
| + | editBox->subscribeEvent(CEGUI::Editbox::EventTextAccepted, CEGUI::Event::Subscriber(&ChatWidget::EditTextAccepted, this)); | ||
| + | </pre> | ||
'''EditTextAccepted()''' | '''EditTextAccepted()''' | ||
| Line 59: | Line 48: | ||
bool ChatWidget::EditTextAccepted(const CEGUI::EventArgs& args) | bool ChatWidget::EditTextAccepted(const CEGUI::EventArgs& args) | ||
{ | { | ||
| − | // | + | // Variables for the Listbox and the Editbox |
| + | mEditBox = static_cast<CEGUI::Editbox*> (winMgr.getWindow("/Chat/Wnd/Edit")); | ||
| + | mListBox = static_cast<CEGUI::Listbox*> (winMgr.getWindow("/Chat/Wnd/List")); | ||
| + | |||
| + | // Add the Editbox text to the Listbox | ||
CEGUI::ListboxTextItem* item = new CEGUI::ListboxTextItem(mEditBox->getText()); | CEGUI::ListboxTextItem* item = new CEGUI::ListboxTextItem(mEditBox->getText()); | ||
mListBox->addItem ( item ); | mListBox->addItem ( item ); | ||
| + | |||
| + | // Scroll the Listbox entries such that the new text is visible | ||
mListBox->ensureItemIsVisible(mListBox->getItemCount()); | mListBox->ensureItemIsVisible(mListBox->getItemCount()); | ||
| − | // | + | |
| + | // Clear the text in the Editbox | ||
mEditBox->setText(""); | mEditBox->setText(""); | ||
| Line 69: | Line 65: | ||
} | } | ||
</pre> | </pre> | ||
| + | |||
| + | |||
| + | TODO: Create a new version that handles different fonts, both font names (such as Arial, Times New Roman) and font sizes (such as 8, 10, 12). This will be done by adding a new widget within a looknfeel (such as TaharezLook.looknfeel). The main feature will be that the Editbox's height will rely on the LineSpacing value of the font. | ||
Revision as of 15:28, 29 January 2008
The following .layout defines a FrameWindow containing two widgets; a Listbox in the upper region for chat history and an Editbox at the lower region for text input.
chat.layout
<?xml version="1.0" ?> <GUILayout> <Window Type="TaharezLook/FrameWindow" Name="/Chat"> <Property Name="Position" Value="x:0.0 y:0.0" /> <Property Name="Size" Value="w:0.25 h:0.25" /> <Property Name="Alpha" Value="0.8" /> <Window Type="DefaultWindow" Name="/Chat/Wnd"> <Property Name="Alpha" Value="0.8" /> <Property Name="Position" Value="x:0.0 y:0.00" /> <Property Name="Size" Value="w:1 h:1" /> <Window Type="TaharezLook/Listbox" Name="/Chat/Wnd/List"> <Property Name="Position" Value="x:0.0 y:0.1" /> <Property Name="Size" Value="w:1 h:0.77" /> </Window> <Window Type="TaharezLook/Editbox" Name="/Chat/Wnd/Edit" > <Property Name="Position" Value="x:0.01 y:0.87" /> <Property Name="Size" Value="w:0.98 h:0.12" /> </Window> </Window> </Window> </GUILayout>
InitialiseChatBox()
// A helper variable
CEGUI::WindowManager& winMgr = CEGUI::WindowManager::getSingleton();
// Load the chat layout and add it to the GUI sheet
mMainWindow = winMgr.loadWindowLayout("chat.layout");
if (mMainWindow)
CEGUI::System::getSingleton().getGUISheet()->addChildWindow(mMainWindow);
// The only event we're interested is when the <ENTER> key is pressed
// This will call upon the EditTextAccepted() function to add the text to the Listbox
CEGUI::Window* editBox = winMgr.getWindow("/Chat/Wnd/Edit");
editBox->subscribeEvent(CEGUI::Editbox::EventTextAccepted, CEGUI::Event::Subscriber(&ChatWidget::EditTextAccepted, this));
EditTextAccepted()
bool ChatWidget::EditTextAccepted(const CEGUI::EventArgs& args)
{
// Variables for the Listbox and the Editbox
mEditBox = static_cast<CEGUI::Editbox*> (winMgr.getWindow("/Chat/Wnd/Edit"));
mListBox = static_cast<CEGUI::Listbox*> (winMgr.getWindow("/Chat/Wnd/List"));
// Add the Editbox text to the Listbox
CEGUI::ListboxTextItem* item = new CEGUI::ListboxTextItem(mEditBox->getText());
mListBox->addItem ( item );
// Scroll the Listbox entries such that the new text is visible
mListBox->ensureItemIsVisible(mListBox->getItemCount());
// Clear the text in the Editbox
mEditBox->setText("");
return true;
}
TODO: Create a new version that handles different fonts, both font names (such as Arial, Times New Roman) and font sizes (such as 8, 10, 12). This will be done by adding a new widget within a looknfeel (such as TaharezLook.looknfeel). The main feature will be that the Editbox's height will rely on the LineSpacing value of the font.
