XPLOsion - GUI loader [COMPLETE]

Announce new projects or updates of Irrlicht Engine related tools, games, and applications.
Also check the Wiki
Post Reply
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

XPLOsion - GUI loader [COMPLETE]

Post by chronologicaldot »

This is a bit too big for code snippets or I'd post it there. Plus, It's a long, unfinished job, and I wouldn't mind community assistance.

Basically, XPLOsion is a loader that takes information given in either files or trees and creates a GUI with it. The GUI can be attached to any GUIElement for it's parent (you don't have to rip it off of the root GUI element every time you use it).

All of the information is stored in two types of files: XML and CSS-type files. The XML files are primarily for arranging the GUI layout, and the CSS-like files are for assigning the parameters to the GUI elements. Hence, this is all very similar to HTML and CSS (and you might just be able to make a standard browser with some of the classes).

What kind of GUI can it load? - Anything that inherits IGUIElement and can be built from IGUIElement::deserializeAttributes() (including custom GUI elements)... well, it can.
There's the issue: I need to implement loading for all of the GUI elements in irrlicht. Believe it or not, this is a beginners job and should be very easy. I've already marked the two (yes, only two) places where stuff needs to be added. There is some debug code (using cout), but those lines can be taken out or ignored if you want.

There's a few other minor bugs that could be worked out, but nothing with the core code so far as I know.

Code:
You can currently find it at the very bottom of this page:
http://chronologicaldot.web44.net/proje ... p_xplosion

I give you this link instead of a direct link to the files, because the documentation is right next to it.
Pardon my emphasis on this:

READ THE DOCUMENTATION.

It's full of information - much more than I can give you in this post.


Picture? Well, I've just been tinkering with it. I've got it to correctly load HTML-div-like GUI elements, buttons (require background to be visible), and edit boxes (require borders to be visible).
Image
Yes, it can draw boxes (Those in the picture are divs).
Last edited by chronologicaldot on Wed Oct 17, 2012 7:34 pm, edited 1 time in total.
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

XPLOsion - additions and fixes

Post by chronologicaldot »

After quite abit of bug fixing, I managed to get divs working:
Image
My apologies to anyone who tried it out and found the divisions to be buggy.

Divs (divBox class) can automatically create scrollbars if they are set to automatic overflow handling and their content is outside their relative rectangle.

Other additions to XPLOsion are CGUIWindow (as you can see above) and CGUIContextMenu, although the latter for some reason doesn't work well when nested. When I nest it, load the program, and try to hover into the nested menu with my mouse, it highlights the first item I hover over (even detecting that it's selected), but won't recognize the second one as selected/highlighted when I hover over that, even if it becomes highlighted (I have to click and drag to highlight it). You can test it yourself by trying to load the following with XPLOsion:

XML file to load:

Code: Select all

 
<menu class="menu1">
<menu class="menu2"></menu>
<menu>
 
Load the following CSS file using CSSLibrary and assign that object to the XPLOsion instance before loading the XML file:

Code: Select all

 
.menu1
{
position: absolute;
left: 0; right:0; top:0; bottom:0;
Id: 10;
Enabled:true;
CloseHandling: 0;
ItemCount:2;
 
/* List of items in this menu */
/* 0 */
Text0: Ostrich;
CommandID0: 110;
Enabled0: true;
Checked0: true;
AutoChecking0: true;
 
/* 1 */
Text1: Shark;
CommandID1: 111;
Enabled1: true;
Checked1: false; /* Irrelevant to the problem */
AutoChecking1: true;
}
 
.menu2
{
position: absolute;
left: 0; right:0; top:0; bottom:0; /* The fact that this is identical to above is also irrelevant to the problem considering that context menus shape themselves and determine their own positions when they are sub-menus. See CGUIContextMenu.cpp */
Id: 20;
Enabled:true;
ParentItem: 1; /* This is a very important item because it tells this menu where it's placement as a submenu is in the other menu. */
CloseHandling: 0;
ItemCount:2;
 
/* List of items in this menu */
/* 0 */
Text0: Yucka;
CommandID0: 150;
Enabled0: true;
Checked0: true;
AutoChecking0: true;
 
/* 1 */
Text1: Blake;
CommandID1: 151;
Enabled1: true;
Checked1: false; /* Irrelevant to the problem */
AutoChecking1: true;
}
 
I plan on adding all of the GUI elements of Irrlicht, hoping they all work after calling deserializeAttributes(). If you guys have any feature suggestions, feel free to let me know.
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

Update: irrlicht GUI element loading capability = complete

Post by chronologicaldot »

Aside from the bugs in menus (pretty sure that's not my fault), everything works fine.

XPLOsion is now capable of loading every built-in GUI element in irrlicht minus those that would be redundant or probably not useful on their own (like independent scrollbars).

Complete list of loaded elements:
text (CGUIStaticText),
div (divBox),
button (CGUIButton),
editbox (CGUIEditBox),
window (CGUIWindow),
menu (CGUIContextMenu),
menubar (CGUIMenu),
messagebox (CGUIMessageBox),
modalscreen (CGUIModalScreen),
meshviewer (CGUIMeshviewer),
checkbox (CGUICheckBox),
combobox (CGUIComboBox),
fileopendialog (CGUIFileOpenDialog),
listbox (CGUIListBox),
colorselectdialog (CGUIColorSelectDialog),
inoutfader (CGUIInOutFader)
Granyte
Posts: 850
Joined: Tue Jan 25, 2011 11:07 pm
Contact:

Re: XPLOsion - GUI loader [COMPLETE]

Post by Granyte »

Independent scrollbars can be used as sliders so ya they are sometime susefull on thier own
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

Re: XPLOsion - GUI loader [COMPLETE]

Post by chronologicaldot »

I thought about that right after I posted it, so I probably will add them. I've also considered adding a slider class like in Java.
If you have any feature requests, let me know.
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

Update: Version 1.3

Post by chronologicaldot »

Due to a change in the way irrlicht 1.8 handles sub elements, I had to modify the scroll bar handling for divisions. It works now for irrlicht 1.8 and should still work for 1.7

I've also added a slider class. It's like a scroll bar but with a few differences:
- It has no up and down / left and right buttons.
- You can set the width/length of the scrolling box (very convenient :D )
- You can give it a background color.
As an element, it's still labeled a scroll bar, so if you do something special to scroll bars with a GUI skin, it will effect them.

Next update, I intend to add tabs and tab control.
chronologicaldot
Competition winner
Posts: 684
Joined: Mon Sep 10, 2012 8:51 am

Re: XPLOsion - GUI loader [COMPLETE]

Post by chronologicaldot »

I've made some important changes.
- GUI elements from registered GUI element factories can now be loaded. The string name you give them in the factory is what you use for their tag name.
- GUIFunctionFire has been removed. I decided this wasn't very efficient, so I replaced it with a new system called GUI Element Acceptor, which allows for direct binding of the GUI element to the classes that use it.
- I now have a version number! (A constant)

Bonus: I made language files for Notepad++ that color code and provide auto-completion for predefined serializable values in irrlicht. Notably, the color coding is designed for CSS-like files, hence the color coding of the curly braces.
This is included in the download file, but it can also be downloaded separately on my website.
Current direct link:
chronologicaldot.web44.net/projects/cpp/Notepad++ irr lang.zip
I realize it's probably bad practice to put spaces in a URL, but I wasn't thinking about that when I uploaded it.

Aside: I've changed the CSSLibrary documentation. It is now much shorter and easier to find stuff.

I'm curious if anyone is using this. If so, I'll look into adding tables (which should actually be a piece of cake if I'm not lazy about it).
I'm also open to suggestions.
Post Reply