Page 1 of 1

XPLOsion - GUI loader [COMPLETE]

Posted: Sat Oct 06, 2012 6:18 am
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).

XPLOsion - additions and fixes

Posted: Mon Oct 15, 2012 7:14 pm
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.

Update: irrlicht GUI element loading capability = complete

Posted: Wed Oct 17, 2012 7:31 pm
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)

Re: XPLOsion - GUI loader [COMPLETE]

Posted: Wed Oct 17, 2012 8:50 pm
by Granyte
Independent scrollbars can be used as sliders so ya they are sometime susefull on thier own

Re: XPLOsion - GUI loader [COMPLETE]

Posted: Fri Oct 19, 2012 4:24 pm
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.

Update: Version 1.3

Posted: Sun Nov 18, 2012 1:59 am
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.

Re: XPLOsion - GUI loader [COMPLETE]

Posted: Fri Apr 26, 2013 6:50 am
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.