Gui System UML Feedback

May 4, 2012 at 7:40pm
Hello everybody,

As part of the game engine I'm writing I need a GUI system.
This is quite a large chunk so I decided to make a UML diagram first.
Currently, my implementation is this:

http://i.imgur.com/SPfBQ.png?1

This would allow us to write a Gui like this:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
#include <SFGE/GuiSystem.h>
#include <SFGE/PushButton.h>

void onClick()
{
	//Do something
}

void onQuit()
{
	//Quit application
}

sf::RenderWindow window;

sfge::GuiSystem gui(&window);

sfge::PushButton* playbutton = new sfge::PushButton("Play", 200, 200, 100, 50);
playbutton->setOnClickCallback(&onClick);

sfge::PushButton* quitbutton = new sfge::PushButton("Quit", 200, 400, 100, 50);
quitbutton->setOnClickCallback(&onQuit);


gui.addElement(playbutton);
gui.addElement(quitbutton);

//while handling events:
gui.handleEvent(Event);

//drawing
gui.draw();



IMO, this is very simple and flexible. Users can make their own GUI objects by deriving from GuiElement.


Feedback please? Would you use this?

EDIT: PushButton's class should have a setString method too.
Last edited on May 4, 2012 at 7:45pm
May 5, 2012 at 4:25am
closed account (3hM2Nwbp)
A good start, but be sure to consider other events that all GUI systems should have. Be sure to lay out the base class foundations before making all of your component types, because it's quite a pain to do later on for both yourself and your clients (especially if it breaks the interface!). Here are a few items for you to think about:

Component Essentials

1) Is this component focusable?
2) Tab index maintenance
3) Rendering order (what is on top of what?)
  - See code at end of post for a suggestion
4) Synchronizing rendering and input (if you're using separate threads)
5) What meta-data do I need to pass to event handlers?
6) Will I support GUI serialization / deserialization?


Mouse Events

1) Mouse Entered
2) Mouse Exited
3) Mouse Moved
4) Mouse Dragged
5) Mouse Wheel
6) Mouse Hovered


Keyboard Events

1) Enter / Return / Space pressed (if the element has focus)
2) Tab / Arrow key(s) pressed (to move focus)


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
#include <list>
#include <memory>
#include <boost/assert.hpp>

class ComponentBase
{
  std::list<std::shared_ptr<ComponentBase>> children;

  public:
    void addChild(std::shared_ptr<ComponentBase> child)
    {
      BOOST_ASSERT(child != nullptr);
      children.add(child);
    }

    virtual void render(void) const
    {
      for(auto iter = children.begin(); iter != children.end(); ++iter)
      {
         (*iter)->render();
      }
    }
};

class SomeComponent : public ComponentBase
{
  public:
    virtual void render(void) const
    {
       // Do custom rendering here

       // Then render my children
       this->ComponentBase::render();
    }
};


Hope it helps :)

PS. I've recently been tasked with creating an OO wrapper library around a procedural rendering API, so this is all still fairly fresh in my memory. Let me know if you have questions.

PPS. I'd use it providing that you distribute prebuilt binaries or VS project files for Windows :D I'm allergic to make-files.
Last edited on May 5, 2012 at 8:16am
May 5, 2012 at 5:48am
About events, I'm building my engine on top of SFML so they already get almost very event possible ;)

MouseMoved, MousePressed, MouseReleased, etc.
Topic archived. No new replies allowed.