Sign in to follow this  
CirdanValen

Recursively traversing UI elements

Recommended Posts

I'm developing a UI for my game and it's editors, and I'm trying to figure out the best way to organize my UI. Right now I have a base class of View that all UI elements inherit, and I have a Container class which is designed to hold a number of subviews, possibly other Containers. For a mouse event, I want to loop through all of the views using the mouse's coordinates, so in my Container class I have a getViewAt(x,y) which iterates through a std::list of Views to find which view is at the point, otherwise it will return itself. However, if I have a container within my container, I have no way of traversing that deep into the tree.

My two ideas are: 1) Give all Views the ability to have children along with the functionality of passing all input events to the children. 2) I give the View class a "hasChildren()" function that returns false by default. If the view is-a Container, it will return true(if it has children) and my program can cast it as a Container*...which seems really dirty.

I think the first method is better design, but I don't know how I feel about giving every view the features of a container.

Share this post


Link to post
Share on other sites
The very first time I did a GUI myself, I just had one list of controls. It's a big like your approach, I just hadn't such containers. I had to fake them badly.
All in all it ended up in a huge mess and me having to recode the whole thing.
You simply have no control about what is on top and what lays under some other control. That can give problems with rendering, and also very important, with input.

I can say that I have learned from the mistakes I made in this GUI. In my current one I used this Children-Approach. All of my controls can have sub controls.
This automatically solves the problem of rendering order, input order and it makes clipping extremely easy.

This property-box control I made recently consists out of a quite a few different controls. You can see it in this thread, as well as the rest of my GUI:
http://www.gamedev.net/community/forums/topic.asp?topic_id=589391

For the property-box, there is the thing on the border, which is collapsible when you click on the name.
Next thing is the inner container which only draws the separator lines and manages the child-controls like text-labels and this edit/checkboxes.
I didn't had to recode them to use them within my property-box control.

Having it like this is quite nice, so I can have buttons in my images of images in my buttons, or texts in the containers inside a tree control which lays inside a container itself while this container can get hidden by a collapsible box.

Share this post


Link to post
Share on other sites
Ideally, you probably want each control to be able to have child controls, or to say it another way, each control should be a Container.

Also, in order to prevent having to send every mouse input to every control, you can have each control contain it's own bounding box, which encompasses the bounding boxes of all it's child controls. This way, you can easily narrow down which control to send the mouse input to, as long as you do it recursively. And, the bounding boxes will only have to be updated (after creation) at certain times, such as a resize of the window, or resize of the other controls.

Share this post


Link to post
Share on other sites
Building on what Ender posted, my code is very similar but it uses a message style system that each control can trigger (it works like Windows controls do). When it's click upon it sends that msg to the inter-process msg handler and from that point on it deals with it as it see fit. The msg that each control can send is specified in the INI entry for that control so it makes for a very configurable system.

With this setup the hud will act just like the Windows dialog, a msg will be sent and it is up to the program on how to act upon said msg. This will give you alot of flexibility and it is very easy to determine what the user click on.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this