BetaGUI : BetaGUI 2.5 update - Style system added.

[betajaen]

Hi! I'm trying to use BetaGUI, I got it included into my app last night.

I recommend you use the BetaGUI modified in the BulletWrapper, it has special effects and I believe has the same functions as valtovars.

It's also the one I use for new the NxOgre tutorials and the base where I'll be porting over my CSS system.

http://get.nxogre.org/betagui/BetaGUI-Bullet.h


As for rollOver. I assume it's when the mouse pointer enters a widget for the first time.

[KungFooMasta]

Great, this looks nice, I will look into this more tonight!

Few questions:

Code: Select all

bool injectMouse(int x, int y, bool LMB);
bool injectKey(const Ogre::String &key, int x, int y);
void injectBackspace(int x, int y);

These are the only input inject functions I found. Does this acheive the same as all the other possible inject functions, including functionality for mouse wheel scrolling and right click, and key pressing and releasing?

What does the x and y fields do in injectKey function?

Also, what are the differences between a Button, BoolButton, and RealButton? Does a BoolButton represent it's state, pushed or not pushed? That might be able to represent a Checkbox, wouldn't it? CheckState and UnCheckState.. that would be really great!

BetaGUI looks very appealing, sorry if I am asking about more functionality for it.

KungFooMasta

[betajaen]

No, BetaGUI only responds to the left mouse button, no wheel support or right clicking. There isn't any need to implement it as none of the widgets would use them.

The X,Y in the injectKey is where the mouse pointer is, same for backspace.

I have no idea what the button types are (I didn't write them), but as a guess bool button is like a check box. Real button maybe some sort of slider and Button is a regular button.

[KungFooMasta]

There isn't any need to implement it as none of the widgets would use them.

Actually that is a good point, not sure what I was thinking, that is more of an input sort of thing. I'm mixing the two up

The BoolButton does look like it represents a two state button. There are certain implied material rules from the looks of it. You need the regular material name, matName + ".active", and matName + ".over".

Then you can just call BoolButton::activate( bool value ) to toggle between states. Pretty cool!

KungFooMasta

[KungFooMasta]

Not sure what I'm doing wrong.. I just created a file called BetaGUI.h and copied in the contents of http://get.nxogre.org/betagui/BetaGUI-Bullet.h and included it into my app. I then added the line #include "BetaGUI.h" and compiled, and get a massive amount of linker errors, here are the first few:

Code: Select all

1>Linking...
1>MenuBasedSystem.obj : error LNK2005: "public: class BetaGUI::RealButton * __thiscall BetaGUI::Window::addRealButton(float *,class Ogre::Vector4 const &,class std::basic_string<char,struct std::char_traits<char>,class std::allocator<char> > const &,enum BetaGUI::WindowPlacementType)" (?addRealButton@Window@BetaGUI@@QAEPAVRealButton@2@PAMABVVector4@Ogre@@ABV?$basic_string@DU?$char_traits@D@std@@V?$allocator@D@2@@std@@W4WindowPlacementType@2@@Z) already defined in LumeriaApplication.obj
1>MenuBasedSystem.obj : error LNK2005: "public: void __thiscall BetaGUI::GUI::setZRangeOrder(int,int)" (?setZRangeOrder@GUI@BetaGUI@@QAEXHH@Z) already defined in LumeriaApplication.obj
1>MenuBasedSystem.obj : error LNK2005: "public: class BetaGUI::BoolButton * __thiscall BetaGUI::Window::addBoolButton(bool *,class std::basic_string<char,struct std::char_traits<char>,class std::allocator<char> > const &,enum BetaGUI::WindowPlacementType)" (?addBoolButton@Window@BetaGUI@@QAEPAVBoolButton@2@PA_NABV?$basic_string@DU?$char_traits@D@std@@V?$allocator@D@2@@std@@W4WindowPlacementType@2@@Z) already defined in LumeriaApplication.obj
1>MenuBasedSystem.obj : error LNK2005: "public: __thiscall BetaGUI::GUI::~GUI(void)" (??1GUI@BetaGUI@@QAE@XZ) already defined in LumeriaApplication.obj

Commenting out the include results in successful build.. //#include "BetaGUI.h"

It's telling me I've already defined these functions? . . .

Any help is appreciated.

KungFooMasta

[CaseyB]

How many files did you add

Code: Select all

#include "BetaGUI.h"

to? If it's more than one then you need to remember to wrap the inside of BetaGUI.h with the

Code: Select all

#ifndef _BETA_GUI_H_
#define _BETA_GUI_H_

...

#endif

[KungFooMasta]

Yah, that's what it reminded me of also, but the ifndef is there, and it's unique within my project...

Code: Select all

#ifndef _UNIQUE_X_Y_Z_AA_
#define _UNIQUE_X_Y_Z_AA_
...
} // End of Betajaen's GUI. Normal programming
#endif

Can anybody verify using that file with no problems?

KungFooMasta

[betajaen]

I'm using it all the time, but I'm only referencing it in one file. I expect you are not and many of the methods and functions are being defined twice.

You could split it around Line 633, cut and paste to the end of the file (except for the last line's #endif). Put that into BetaGUI-Bullet.cpp.

It should work then.

[KungFooMasta]

Alright, I got it working by splitting it into 2 files.

I want to use BetaGUI for my application which consists of many game states, each with its own GUI. Does BetaGUI seem feasible for this? I've been digging through the code all night, and it doesn't look like it wouldn't take much work to be able to accomplish this (optimism).

I saw in the Ogre API that it's costly to delete Overlays. I also see that your code tries to reuse overlays as much as possible. This is fine for small apps, as you will probably never need to have multiple screens or game states. What I would like is a way to cleanup all the Overlays created. I created a logger and tried to figure out how to cleanly destroy the overlays on destruction of windows/widgets, but I kept getting crashes. I also tried call the OverlayManager::destroyAll function, but I get a crash as well. The API recommends not calling destroyAll, and instead letting OGRE handle overlay destruction on shutdown. Are overlays really that delicate? Even if I couldn't figure out how to properly clean up all the created overlays, I should be able to call the destroyAll method.. (kind of like SceneManager::clearScene, although I don't need this function since I clean up everything myself)

Also, I'm really bad when it comes to circular dependencies. If anybody could email me or throw up a link to a set of .h/.cpp files that separate all the BetaGUI classes, that would really help me out. It was tedious searching around 2 large files all the time. (I have tried twice to separate BetaGUI-Bullet.h into multiple files, but when it comes to circular dependencies and forward declarations, errors change frequently, and it's hard for me to figure out the proper order to declare/include things..)

I really want to use BetaGUI for my app, there are lots of good benefits to using it!

Thanks if anybody can provide a small zip of BetaGUI in separate files.

KungFooMasta

[nikki]

Betajean, I am still getting that error I told you about earlier:-

Code: Select all

Error #: 6
Function: OverlayManager::createOverlayElement
Description: OverlayElement with name BetaGUI.w11 already exists..
File: c:\ogre\ogrenew\ogremain\src\ogreoverlaymanager.cpp
Line: 549
Stack unwinding: <<beginning of stack>>

Its the same error, but its not always w11. I also remember seeing w51 sometime. Any idea what the problem might be?

[yarock]

and how can change the gui font color??

[Noman]

Hi

I'm trying to play around with BetaGUI (Using BetaGUI-Bullet) to see if it matches my needs.

I tried to create a window (bgui.window - got the pack from URL http://www.nxogre.org/screens/bguires.zip) and it said that there was no such material bgui.window.close. I looked into the code and realized what they wanted. Is there an updated pack somewhere?

Also, i see that all the sizes are pixel based, and not dimension based (0-1). Is there a way to change this? Might be problematic with changing resolutions...


[Edit]
Ok... Playing around with it some more. Starting to get the hang of it... One thing that is bothering me is that we are forced to include all the custom materials (just got a crash because .over wasn't there). Maybe it's better to ignore missing materials (other than the default one) rather than crash?

[Noman]

OK

I played around with the library, and I'm liking the fact that its so small that it is rather easy to customize the library to fit my needs. What I'm working on right now is to be able to control the fonts by means of scripting. Currently, the over/not over colors are hard coded. I want them to be scriptable.

So, what im trying to do, is to be able to define a "style template" for the text in certain situations. For example, I want to be able to do something like this:

Code: Select all

// BetaGUI template overlays
template element TextArea(bgui.button.caption)
{
	font_name StarWars
	char_height 300
	colour_top 0.5 0.5 0.5
	colour_bottom 0.5 0.5 0.5
}

template element TextArea(bgui.button.caption.over)
{
	font_name StarWars
	char_height 400
	colour_top 0.7 0.7 0.7
	colour_bottom 0.5 0.5 0.5
}

I started implementing this, but have encountered a problem :
Overlay templates are not "deltas" - they are absolute definitions. Which means that when the template is created, the default values are placed as well, and when i use overlay's CopyFromTemplate method, they get copied over as well, meaning that the position & size of my overlay will also be changed, whereas I just want the style.

So, I decided to do this manually, and change Widget's over() method (the rest will follow of course) The code :

Code: Select all

if (a && mHasActiveState && mMainOverlay)
        {
            mMainOverlay->setMaterialName(mMaterialName + ".over");

            if (mCaptionOverlay)
            {
				
		mCaptionOverlay->setParameter("colour_top", 
			Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.0)));
		mCaptionOverlay->setParameter("colour_bottom", 
			Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.00)));
				
            }
        }

Is now

Code: Select all

if (a && mHasActiveState && mMainOverlay)
        {
            mMainOverlay->setMaterialName(mMaterialName + ".over");

            if (mCaptionOverlay)
            {
				try 
				{	
					Ogre::OverlayElement* templateOverlay = Ogre::OverlayManager::getSingleton().
						getOverlayElement("bgui.caption.over", true);
					Ogre::OverlayElement* defaultOverlay = Ogre::OverlayManager::getSingleton().
						createOverlayElement("TextArea", "DefaultTemplateTextArea", true);
					for (int i=0; i<templateOverlay->getParameters().size(); i++) 
					{
						Ogre::String name = templateOverlay->getParameters()[i].name;
						Ogre::String templateValue = templateOverlay->getParameter(name);
						Ogre::String defaultValue = defaultOverlay->getParameter(name);
						if (defaultValue.compare(templateValue) != 0) 
						{
							mCaptionOverlay->setParameter(name, templateOverlay->getParameter(name));
						}
					}
				}
				catch (...) 
				{
					mCaptionOverlay->setParameter("colour_top", 
						Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.0)));
					mCaptionOverlay->setParameter("colour_bottom", 
						Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.00)));
				}
            }
        }

(Code is still in debugging/research state - has hard coded stuff etc, but is rather easy to refine when i work out my problems)

This works (only things defined in the template get set), except that the call for defaultOverlay's getParameter with font_name gives me an access violation error. I tried iterating over its parameters to see that it has a font_name parameters and it reports that it does. Once i get around this, it will work and we will be able to scriptably set font styles for widgets.

If anyone knows why this happens, i think this could be a good addition to BetaGUI...

[betajaen]

It is a good idea. I've done something quite similar with "BetaGUI 3", which is to base the entire look of it all using a script based on the syntax of CSS (in HTML).

Of course my code is in early stages, you can only set it up within code (not via templates like yours) and it only supports four attributes - colour, font, background, border. I believe these systems are better than just using image sets, materials and XML schemas as it's nice to use something simple and is used a lot in the web.



But as for your question; I assume you've checked the font name is correct (there are no trailing or preceeding spaces or tabs). Have you tried manually loading it before hand?

[Noman]

The problems occur when a template does NOT include a font name. Ive managed to generalize the problem and post about it here :

http://www.ogre3d.org/phpBB2/viewtopic.php?t=30586

Would you like to include my changes in the official BetaGUI-Bullet.h when I am done with them?

As for BetaGUI 3, I believe that as little new formats needs to be introduced to a system in order to customize it.

BetaGUI does this, by using existing script types (materials) for its definitions. I want to try to bring more customizability to BetaGUI by using overlay scripts to customize states.

Adding css does bring in a new format to the system (which is bad according to what i said) but its not really a new format, as css is quite common. However, the question is, how comfortable is css for game gui design... Interesting idea.

[nikki]

betajean, I've been encountering some errors with BetaGUI (posted above on the same page). Is it advisable to switch from the old BetaGUI to the Bullet BetaGUI version? Are there any major changes required to do so?

[betajaen]

@Noman

I mis-understood. Perhaps then you should have a system that has a default font name, so when a font isn't mentioned it should use that. How about using the one given in the GUI constructor?

I find it awful to specify 20 seperate materials for a GUI system like that, as well as seperate template files and so on. CSS is just an implementation, and I'm certainly not using any elements or HTML rendering engine to create it with. Just the concept and syntax.

This to me, seems much easier read and modify:

Code: Select all

* {
font: 12 Arial;
color: white
}

button {
background: button.gif
}

button:hover {
background: button.over.gif
}

text {
background: pink;
}

text:hover {
background: hotpink;
}

As for your contribution, I would leave it on the addons section the Wiki Article. I need to change it give links and describe the seperate forks and modifications. Yours can go in there too

@Nikki
I would, it's a lot better to work with and has some lovely new features.

There isn't any major changes between the traditional BetaGUI and the BetaGUIBullet code, apart from running the "update" in GUI every frame, this is for the effect system to behave properly.

[Noman]

Perhaps then you should have a system that has a default font name, so when a font isn't mentioned it should use that. How about using the one given in the GUI constructor?

I can't do this. If I'm loading a template that doesn't have a font name defined and I just try to question it to ASK if it has a font name defined, I get an access violation error. I believe sinbad added a null guard on it (thats what i saw in the help thread that i opened), so this should be closed in the next maintainance release of ogre. Till then, I'll just specify a font name in all of my templates.

As for the css system, I have to say it looks promising

--Edit--
I had some time to work on my overlay template thing, and brought it to a satisfactory level. First of all, I wrote this function (which should be a method of Widget) :

Code: Select all

void updateCaptionFromTemplate(Ogre::OverlayElement* captionOverlay, const Ogre::String& templateMaterial) 
	{
		//This is the first line to avoid unneccesary things if no template overlay.
		//Will throw exception if doesn't exist.
		Ogre::OverlayElement* templateOverlay = Ogre::OverlayManager::getSingleton().
						getOverlayElement(templateMaterial, true);

		//Get/Create the default overlay for this caption
		Ogre::OverlayElement* defaultOverlay;
		const Ogre::String& type = captionOverlay->getTypeName();
		try {
			defaultOverlay = Ogre::OverlayManager::getSingleton().getOverlayElement(
				Ogre::String("DefaultTemplate") + type, true);
		}
		catch (...) {
			defaultOverlay = Ogre::OverlayManager::getSingleton().
				createOverlayElement(type, Ogre::String("DefaultTemplate") + type, true);
		}

		//font_name crash fix - remove in 1.4.1 or later.
		if (type.compare("TextArea") == 0) {
			defaultOverlay->setParameter("font_name", captionOverlay->getParameter("font_name"));
		}

		//Iterate over the fields of the template and apply if they are custom
		for (int i=0; i<templateOverlay->getParameters().size(); i++) 
		{
			Ogre::String name = templateOverlay->getParameters()[i].name;
			if (defaultOverlay->getParameter(name).compare
				(templateOverlay->getParameter(name)) != 0) 
			{
				captionOverlay->setParameter(name, templateOverlay->getParameter(name));
			}
		}
	}

And then, parts of the code that look like this :

Code: Select all

if (mCaptionOverlay)
{
	mCaptionOverlay->setParameter("colour_top", 
		Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.0)));
	mCaptionOverlay->setParameter("colour_bottom", 
		Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.00)));
}

Should be replaced by this :

Code: Select all

if (mCaptionOverlay)
{
	try 
	{	
		updateCaptionFromTemplate(mCaptionOverlay, mMaterialName + ".caption.over");
	}
	catch (...) 
	{
		mCaptionOverlay->setParameter("colour_top", 
			Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.0)));
		mCaptionOverlay->setParameter("colour_bottom", 
			Ogre::StringConverter::toString(Ogre::ColourValue(1.0, 0.96, 0.76, 1.00)));
	}
}

(Of course, the constants and the name of the caption style need to change per instance).

You mentioned a wiki that i can add this to. Is it the one in ogre3d's wiki?

[Noman]

Just a small vid of what i wanted to do (cause it probably looks weird from the side) is to go from this :

Code: Select all

mGui = new BetaGUI::GUI("Root", "StarWars", 14, mWindow);
	mLocalManager->registerMouseListener(new BetaGUIInjector(mGui));
	BetaGUI::Window* window = mGui->createWindow ( Vector4 ( 50, 50, 300, 400 ), "fire.optionwindow", BetaGUI::WFT_NONE, "G.U.I." );
	mGui->createMousePointer(Vector2(32, 32), "bgui.pointer");
	//window->createStaticText( Vector4(20,20,200,100), "Item" );
	window->createButton( Vector4(75,50,200,50), "fire.button", "Move", BetaGUI::Callback());
	window->createButton( Vector4(75,100,200,50), "fire.button", "Attack", BetaGUI::Callback());
	window->createButton( Vector4(75,150,200,50), "fire.button", "Skill", BetaGUI::Callback());
	window->createButton( Vector4(75,200,200,50), "fire.button", "Item", BetaGUI::Callback());
	window->createButton( Vector4(75,250,200,50), "fire.button", "Wait", BetaGUI::Callback());

And this :

Code: Select all

template element TextArea(fire.button.caption)
{
	font_name Cloister
	char_height 35
	colour_top 0.56 0.52 0.29 1.0
	colour_bottom 0.56 0.52 0.29 1.0
}

template element TextArea(fire.button.caption.over)
{
	font_name Cloister
	char_height 35
	colour_top 1.0 0.0 0.2 1.0
	colour_bottom 1.0 0.0 0.2 1.0
}

template element TextArea(fire.button.caption.active)
{
	font_name Cloister
	char_height 50
	colour_top 1.0 0.0 0.2 1.0
	colour_bottom 1.0 0.0 0.2 1.0
}

To this :

http://www.youtube.com/watch?v=41RcQsSDRNk

Thats the look I'm trying to go for, and i think it was quite easy to achieve with this small modification to BetaGUI...

[KungFooMasta]

Code: Select all

I can't do this.

I don't understand the problem. Cant' you just use the FontManager and grab the first font via a resource iterator, and set that as your default font? Just have the Manager class store the name of the font, and whenever a font is not specified use mDefaultFont. One way to access this is to make the manager into a singleton, but if you have classes that are friends of the manager (is the widget class a friend?) then you can access it that way.

The effect in the video looks pretty cool! I used BetaGUI a little a while back, but isn't that doable without modification? You just need 3 material files, one of the word, one of the word in red, and one of the word enlarged and in red. So you start with the original image, and mouse over changed to red, and mouse down changes to large red.

Great Idea, looks like a cool menu!

KungFooMasta

[Noman]

This is the problem : I load the template, and try to ask it if it has a font_name specified. If it doesn't, I get a crash. I can't decide that I need to use the default font without knowing that the template doesn't have one defined.

As for the menu. Can a material specify the size & color of a nested overlay's text? Not too sharp on ogre's material system, but I'm pretty sure that it can't do at least one of them...

[KungFooMasta]

Sorry, I realized what you were saying after posting. That's great that the problem should get fixed.

Ah, I believe you're right in that materials can't set size or color of text.

What you've implemented seems very useful.

KungFooMasta

[betajaen]

Say hello to BetaGUI 2.5



Based on Tuan Kuranes' BetaGUI code in his Bullet wrapper, and with respect to his work. I've stripped out some of the widgets and kept the good bits, including his amazing effect system. It's meant as a stop gap between the current BetaGUI and the planned BetaGUI 3 in the DeltaGUI thread. I've replaced the callback system to a class::method pointer system without the use of templates.

As so:

Code: Select all

BetaGUI::Window* win = mGUI->createWindow(Vector4(256,64,640,320), "bgui.window", BetaGUI::WFT_RESIZE_AND_MOVE, "Test Window", mEditor);
win->createButton(Vector4(170,100,101,24), "bgui.button", "Hello",(BetaGUI::BetaGUIMethodPtr) &Editor::callQuit);
win->createStaticText(Vector4(20,64,70,23), "Guess a number");
win->createTextInput(Vector4(170,64,133,23), "bgui.textinput", "1337", 8);

The features planned is a new skinning system which supports seperate themes PER window. It should take away some of the programmer/designer thing, and even takes away the unneeded width/height which must be specified in each widget creation.

I also want two new widgets; A slider and a multi-purpose progress metre, and the button widget will act like a push-down/push-up button for boolean values such as check boxes.

Oh it has a new skin with centered text

[jacmoe]

Looks great!

When can we get our grubby hands on it?

[Chimelion]

Hello, BetaGUI 2.5!

Cool, looking forward to it.

Wondering if I can still do this:

-> on the last version of BetaGUI-bullet, I removed all references to the mouse pointer overlay, which was an easy thing to do (especially since many were already commented out). Then I created my own overlay in my gui manager using almost the exact same code as yours. Then near the end of my manager's mouse position update, I simply call these two lines:

Code: Select all

pUIPointerOverlay->setPosition(mUIPointerPos.x, mUIPointerPos.y);
bUnused = pBetaGUI->injectMouse(mUIPointerPos.x, mUIPointerPos.y, bMouseBtnDown);

Finally, I perform a hacky way of determining whether or not BetaGUI had any focus at all, and if it did not, I call the next mouse consumer on my list. It works like a charm, and BetaGUI is well behaved when the mouse is busy elsewhere.

1. What is the most efficient way to determine that any part of BetaGUI has the mouse focus? I'm using a crude hack approach, but would like a simple property accessor method or a return result from the inject methods that indicates focus. (I hacked the return from injectMouse().)