Article: Containers and components
From DaevsGUI
WARNING: This page is outdated
Components
Components are objects that actually make the GUI visible. A component can be a button, a text area, a colour / gradient, a plain texture or anything else that is supported (you can add virtually anything yourself, see the developer tutorials).
Each component has it's own tutorial, we will only discuss it in general here.
Take a look at the following code:
DaevsGUI::Component *component = new DaevsGUI::Component; component->rect(40, 10, 100, 200); // offset x = 40 and y = 10 of the top-left window corner, with width = 100 and height = 200 // or: component->rect(DaevsGUI::Rect(40, 10, 100, 200)); component->draw(); // nothing will happen, the stock component does nothing delete component; // it's not used by any other object, so deleting is safe (see examples below)
Containers
Containers are objects that contain containers or components. They are just to bundle parts of the GUI, making them a group. This enables us to draw a group at once (instead of drawing each element individually), move everything inside in one function call and send events to just one object.
The container maintains a list of elements (either containers or components) which get commands passed from the container whenever you pass a command onto the container. Since it is a list, the order in which the elements are stored is important, since that defines which element is send the command to first and which last (think of the drawing order). Therefore a container has a set of functions to control the order.
The following code allocates and deallocates a new container, as well as adds a component and draws the whole container (including the component!). This is a stock (plain) container, one can use custom containers as well, which should work the same way, depending on the author.
DaevsGUI::Container *container = new DaevsGUI::Container; component->rect(50, 50, 30, 30); DaevsGUI::Component *component = new DaevsGUI::Component; component->rect(40, 10, 100, 200); container->add(component); container->draw(); // this will call component->draw() as well // the component will be draw at x = (50 + 40) = 90 and y = (50 + 10) = 60 // there is no checking if the component is draw outside the width and height // of 30 from the container; these are used for the event system only (currently) // but you could build a wrapper on top of this library that does support it of course // no need to delete the component, the container takes care of it (this behaviour can be changed, see the 'How it works' tutorial) delete container;
What if we add multiple components, want to change the order in which they are stored and remove a few in the meanwhile?
enum { ONE, TWO, THREE }; DaevsGUI::Container *container = new DaevsGUI::Container; DaevsGUI::Component *one = new DaevsGUI::Component; DaevsGUI::Component *two = new DaevsGUI::Component; DaevsGUI::Component *three = new DaevsGUI::Component; // we bind an unsigned integer to each component container->add(ONE, one); container->add(TWO, two); container->add(THREE, three); container->draw(); // one, two, three container->top(TWO); container->draw(); // two, one, three container->bottom(ONE); container->draw(); // two, three, one container->swap(ONE, TWO); container->draw(); // one, three, two container->move(TWO, 1); // move upwards container->draw(); // one, two, three container->move(TWO, -2); // move downwards container->draw(); // two, three, one container->remove(THREE); // remove three from the list container->draw(); // two, one delete container;
