help with a GUI

Sickes

15-01-2008 17:03:58

Hi!!

i need a gui for a card game to create simple widgets like buttons, textbox, labels, windows..

What gui library may i use?

I read about MQuickGui but i don't find examples to know how program with it.

Any suggestion/help?

Thx.

Beauty

16-01-2008 09:40:52

Look to the [u]Ogre page of QuickGUI[/u] at the box Using QuickGUI. There are examples. I suppose with C# it will be similar.

Alternatively look to your SDK installation at OgreSDK\Mogre-Samples\Gui. There is an example using CEGUI.
In the wiki is an article for C++, but not very large.
Look here: www.ogre3d.org/wiki/index.php/CEGUI
A short example is here: www.ogre3d.org/wiki/index.php/Basic_Tutorial_6#CEGUI

Maybe [u]MogreBetaGUI[/u] helps you. It should be easy to use (for Ogre), but on Mogre I had some problems.

Here is an article how to use CEGUI under .NET. The code seems to be visual basic, but it could help:
www.ogre3d.org/wiki/index.php/Using_CEGUI_in_OgreDotNet

Sickes

19-01-2008 14:44:09

anybody have a example of using MQuickGui?

I don't know how use it to do a simple Gui.

Thx.

dodongoxp

19-01-2008 21:56:30

the syntax of the language in that page seems to be visual basic 8)

Sickes

26-01-2008 15:44:53

plz, have anybody a short example of MQuickGui use?

raygeee

26-01-2008 19:29:10

[edit] Updated the example code (now using the GUIManager.Singleton). [/edit]

I have to admit, I also had a lot of problems getting MQuickGUI to run because of a missing example. Apart from this I had some other problems: the missing skins and the missing qgui.material file.

First of all, you have to notive that current MQuickGUI is a port of an older QuickGUI where they used materials. Therefore the QuickGUI-Wiki isn't helping much.

To use this you need the qgui images loaded as resources and a qgui.material file located in the qgui-folder describing the images.

Now to the example:
MQuickGUI.GUIManager.Singleton._notifyWindowDimensions(800, 600); // Better update this to your current viewport's size!
MQuickGUI.GUIManager.Singleton.createMouseCursor(new Vector2(10, 10), "qgui.pointer");
MQuickGUI.Sheet sh = MQuickGUI.GUIManager.Singleton.createSheet("main sheet");
MQuickGUI.Window win = sh.createWindow("main window", new Vector4(50, 50, 400, 200), "qgui.window", MQuickGUI.QGuiMetricsMode.QGUI_GMM_PIXELS, MQuickGUI.QGuiMetricsMode.QGUI_GMM_PIXELS);
win.setText("window title");
MQuickGUI.Button bt = win.createButton("test button", new Vector4(50, 50, 100, 30), MQuickGUI.QGuiMetricsMode.QGUI_GMM_PIXELS, MQuickGUI.QGuiMetricsMode.QGUI_GMM_PIXELS, "qgui.button");
bt.setText("click me");

MQuickGUI.GUIManager.Singleton.setActiveSheet(sh);

Simple input handling with MOIS:
// Do this in OnFrameStarted():
MQuickGUI.GUIManager.Singleton.injectTime(evt.timeSinceLastFrame);

// Do this in your mouse handling method:
MQuickGUI.GUIManager.Singleton.injectMousePosition(mouseState.X.abs, mouseState.Y.abs) // Mouse cursor movement.

// Do this when MOIS says left mouse button is down / up.
MQuickGUI.GUIManager.Singleton.injectMouseButtonDown(MOIS.MouseButtonID.MB_Left);
MQuickGUI.GUIManager.Singleton.injectMouseButtonUp(MOIS.MouseButtonID.MB_Left);

// At the moment, keys have to be injected with their character into the GUI. The injectKeyCode() function isn't working.
MQuickGUI.GUIManager.Singleton.injectChar('a');

For the example use this qgui.material file (incomplete, not covering all controls/images)
material qgui.pointer
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.pointer.png
}
}
}
}
material qgui.window
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.png
}
}
}
}

material qgui.window.titlebar
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.titlebar.png
}
}
}
}

material qgui.window.titlebar.button
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.titlebar.button.png
}
}
}
}

material qgui.window.titlebar.button.down
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.titlebar.button.down.png
}
}
}
}


material qgui.window.titlebar.button.over
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.titlebar.button.over.png
}
}
}
}

material qgui.window.bottom
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.bottom.png
}
}
}
}

material qgui.window.left
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.left.png
}
}
}
}

material qgui.window.right
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.right.png
}
}
}
}

material qgui.window.top
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.window.top.png
}
}
}
}

material qgui.button
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.button.png
}
}
}
}

material qgui.button.disabled
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.button.disabled.png
}
}
}
}

material qgui.button.down
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.button.down.png
}
}
}
}
material qgui.button.over
{
technique
{
pass
{
lighting off
ambient 1 1 1
diffuse 1 1 1
specular 1 1 1 30
scene_blend alpha_blend
texture_unit
{
texture qgui.button.over.png
}
}
}
}

Beauty

27-01-2008 00:47:32

Nice that you want to add informations about to the wiki (-:
I thought all needed files are in the SVN.
Is your code the old port or did you make new port of the current QuickGUI?
It's good to add this information, but the most important would still be to get a working version instead of half boiled things.

Thanks that you want to help to build up the Mogre part of the wiki!

Sickes

27-01-2008 10:00:21

where do you find the skin images?

raygeee

27-01-2008 15:56:24

My example code fits to the current MQuickGUI found in the SVN.
As you can see from germandz's comments ("Initial version. Incomplete, port from QuickGUI 0.9.5v2") the port is from an older version than the current C++ QuickGUI (which is 0.9.7). For a list of changes since then (which we don't have implemented in our old version unfortunately) look here: http://www.ogre3d.org/phpBB2addons/viewtopic.php?t=4664

As skin images I used the ones from the C++ version located in the folder bin/media/skins/qgui/. The current C++ QuickGUI can be found here: http://www.ogre3d.org/phpBB2addons/viewtopic.php?t=5559
The QuickGUI wiki has some dead links in it :(

To use the other controls like combobox etc. you need to add their images to the qgui.material file. It's just copy & paste with changing names.

To get a fully working version we need someone working on the port. Currently we have to live with the old unfinished version. Also I don't know if the other controls are functionally since I haven't tested them. The best solution would be to create a .NET wrapper dll referencing the C++ version. I don't know if that's possible...

raygeee

27-01-2008 16:40:05

Just updated the wiki: http://www.ogre3d.org/wiki/index.php/MQuickGUI

Sickes

03-02-2008 21:45:06

Have any example of using the textbox??

thx