Difference between revisions of "Layout Containers"

From CEGUI Wiki - Crazy Eddie's GUI System (Open Source)
Jump to: navigation, search
(initial, needs a lot of work!)
 
(→‎Grid Layout Container)
 
(13 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
''Note: Layout containers are a new feature, it's currently in the stable svn branch (v0-7). It will most likely be released with CEGUI 0.7.2''
+
{{VersionBadge|0.8}}
  
 
This introduces the concept of widgets that automatically layout their child widgets. Without these layout containers, doing dynamic complex UI was really hard and you had to do a lot of custom code.
 
This introduces the concept of widgets that automatically layout their child widgets. Without these layout containers, doing dynamic complex UI was really hard and you had to do a lot of custom code.
Line 11: Line 11:
  
 
Code sample:
 
Code sample:
−
<code><cpp/>
+
<source lang="cpp">
 
CEGUI::VerticalLayoutContainer* layout = static_cast<CEGUI::VerticalLayoutContainer*>(CEGUI::WindowManager::getSingleton().createWindow("VerticalLayoutContainer"));
 
CEGUI::VerticalLayoutContainer* layout = static_cast<CEGUI::VerticalLayoutContainer*>(CEGUI::WindowManager::getSingleton().createWindow("VerticalLayoutContainer"));
  
 
// add windows to the layout
 
// add windows to the layout
−
layout->addChildWindow(wnd1);
+
layout->addChild(wnd1);
−
layout->addChildWIndow(wnd2);
+
layout->addChild(wnd2);
  
−
parentWindow->addChildWindow(layout);
+
parentWindow->addChild(layout);
−
</code>
+
</source>
  
 
=== Horizontal Layout Container ===
 
=== Horizontal Layout Container ===
Line 28: Line 28:
 
=== Grid Layout Container ===
 
=== Grid Layout Container ===
 
Arranges child windows into a grid. '''You have to set grid dimensions before you add any windows to the container'''.
 
Arranges child windows into a grid. '''You have to set grid dimensions before you add any windows to the container'''.
 +
 +
Basic Example:
 +
<source lang="cpp">
 +
// includes: <sstream>, loaded schemes: TaharezLook.scheme
 +
 +
CEGUI::GridLayoutContainer *glc = static_cast<CEGUI::GridLayoutContainer*>(CEGUI::WindowManager::getSingletonPtr()->createWindow("GridLayoutContainer", "GLC"));
 +
 +
d_root->addChild( glc );
 +
 +
glc->setGridDimensions( 2, 3 );
 +
 +
for(int i = 0; i < 6; ++i)
 +
{
 +
    std::stringstream stringStream;
 +
    stringStream << "Window #" << i;
 +
 +
    CEGUI::Window* window = CEGUI::WindowManager::getSingletonPtr()->createWindow(
 +
            "TaharezLook/StaticText");
 +
 +
    window->setSize( CEGUI::USize( cegui_reldim( 0.1f ), cegui_reldim( 0.1f )));
 +
    window->setText(stringStream.str());
 +
 +
    glc->addChild( window );
 +
}
 +
</source>
 +
 +
[[Category:Manuals]]

Latest revision as of 11:08, 11 January 2015

Written for CEGUI 0.8

Works with versions 0.8.x (stable)

Works with latest CEGUI stable!

This introduces the concept of widgets that automatically layout their child widgets. Without these layout containers, doing dynamic complex UI was really hard and you had to do a lot of custom code.

Basic concepts

Layout containers are simply widgets that have no visuals to them, they don't render anything, they also usually don't react to any input (this isn't really required but the 3 existing stock layout containers don't react to input themselves). They simply just set their child windows positions in a certain way (depending on the container). When child windows are resized, added or removed, the layout containers relayouts them to match the arrangement.

Inbuilt layout containers

Vertical Layout Container

Arranges child windows one after each other vertically.

Code sample: 

CEGUI::VerticalLayoutContainer* layout = static_cast<CEGUI::VerticalLayoutContainer*>(CEGUI::WindowManager::getSingleton().createWindow("VerticalLayoutContainer"));
 
// add windows to the layout
layout->addChild(wnd1);
layout->addChild(wnd2);
 
parentWindow->addChild(layout);

Horizontal Layout Container

Arranges child windows one after each other horizontally.

Horizontal layout container is used exactly the same as vertical layout container.

Grid Layout Container

Arranges child windows into a grid. You have to set grid dimensions before you add any windows to the container.

Basic Example: 

// includes: <sstream>, loaded schemes: TaharezLook.scheme
 
CEGUI::GridLayoutContainer *glc = static_cast<CEGUI::GridLayoutContainer*>(CEGUI::WindowManager::getSingletonPtr()->createWindow("GridLayoutContainer", "GLC"));
 
d_root->addChild( glc );
 
glc->setGridDimensions( 2, 3 );
 
for(int i = 0; i < 6; ++i)
{
    std::stringstream stringStream;
    stringStream << "Window #" << i;
 
    CEGUI::Window* window = CEGUI::WindowManager::getSingletonPtr()->createWindow( 
            "TaharezLook/StaticText");
 
    window->setSize( CEGUI::USize( cegui_reldim( 0.1f ), cegui_reldim( 0.1f )));
    window->setText(stringStream.str());
 
    glc->addChild( window );
}
Retrieved from "http://cegui.org.uk/wiki/index.php?title=Layout_Containers&oldid=5592"