Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

Code Snippets / [DBP] A simple GUI

Author
Message
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 16th Jan 2009 18:10 Edited at: 19th Jan 2009 18:45
Link
I've started working on a GUI for a level editor I'm making. It's going pretty good so far, but it's still pretty basic.

It supports:

-Windows.
-Buttons.
-Check boxes.
-Menu bars.
-Sliders.
-Right-Click menus.

It's fairly flexible as well. You can set everything from the color scheme used to the height of the window title bars to the the size of the window padding.

Oh, and windows which are children of other windows don't function very well right now.

Here's the code:



How to use it:

Before you do anything you must call InitGUI( ).

Once that's done you can start creating GUI widgets. The GUI currently only supports four widgets: windows, buttons, check boxes and menu bars.

You create windows with AddWindow( ):



The first thing you'll notice is that the function returns a value. That value is a handle to the window; it's holds its ID. This way you don't have to keep track of IDs. The first parameter is the handle of the parent window you're adding this window to. If the first parameter is -1 then the window won't have a parent. The second two values are the starting position of the window. The next two values are the starting size of the window, and the last is the title of the window, which will be displayed in its title bar.

Now that we've created the window we'll set some properties of it:



The first two functions we'll set our window so that we can move and resize it. The last two set the minimum width and height of our window.

Now we can add some widgets to our window. We'll start with a menu bar:



Once again the first function, 'AddMenuBar()', returns a handle to our menu bar. The only parameter is the parent window of our menu bar. If this value is set to -1 the menu bar will just be placed at the top of our screen, otherwise it will be put at the top of its parent window. The rest of the code just adds some menus and options to the menu bar, I think it's pretty self-explanatory.

Finally we'll add a check box and a button to our window:



Both these functions return handles to the element created. Also both functions have identical parameters. The first is the parent window of this widget. The second two are the starting positions. These positions are relative to the position of our parent window. The next two are the size of our widgets, and the last is the text used for the widget. To check if a button is clicked, use ButtonClicked( Button ), and to check if a check box is checked, use GetCheckBoxChecked( CheckBox ).

Oh and in our main loop we have to update our GUI with UpdateGUI( ):



And we'll check to see if the user presses 'Exit' on our menu bar like so:



Ok, I hope that explained it somewhat well. If you still have any questions feel free to ask.

UPDATES:

Ok, I've added "draw styles". Draw styles basically change the appearance of the GUI; not the colors, but the GUI itself.

Here are some styles I've come up with:

"Rounded"



"Gradient Fill"



"Shadow"



"3D"



And obviously all the colors can be customized.

You can set the draw style with "SetGUIDrawStyle( )". It takes one integer parameter, from one through 7:

1 - Regular
2 - Rounded
3 - Shadow
4 - 3D
5 - Tint Fill
6 - Gradient Fill
7 - Borderless

UPDATE:

I've replaced all DBP drawing calls with D3DFunc functions. All draw styles have at least small improvement, and Rounded and Gradient Fill are over twice as fast.

UPDATE:

I've added right-click menus. To enable right-click menus, use:



Where UseIt is 1 if you want it enabled or 0 if you don't want it. It's off by default. To add options to this menu, use:



Where Txt is the text displayed for the option. To see if an option has been selected/clicked use:



Where Option is the option you're checking to see if it's selected.

I have basically everything that I'm going to need for my editor, so this is pretty much done for the time being. However if you have a request for a certain widget I'd be glad to try and add it.

UPDATE:

I've added some fixes:

-I've fixed a bug where OptionClicked( ) didn't return correct values.
-I've fixed a bug where menubar parents weren't set correctly.

Back to top
Profile PM
Sven B
19
Years of Service
User Offline
Joined: 5th Jan 2005
Location: Belgium
Posted: 17th Jan 2009 12:14
Link
I can see you put alot of work in this. But to be honest, I'd delete some parts.
At its current state, the program runs at 11-15FPS on my machine (2GB RAM, Vista Home Prem 32bit, Dual Core 2.20GHz, GeForce 8600M GT), which is painfully slow. Especially if it is to be used in a program where the speed will only go down further.

Speed is also one of the reasons why most complete GUI's in DBP are coded in Cloggy's D3D plugin. DBP 2D commands aren't really the fastest so it's not your fault...
Maybe you should try the plugin?

Other than that, it really looks good! My favorite's still the gradient one.

It's the programmer's life:
Have a problem, solve the problem, and have a new problem to solve.
Back to top
Profile PM Email
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 17th Jan 2009 14:33 Edited at: 17th Jan 2009 15:49
Link
Quote: "I can see you put alot of work in this. But to be honest, I'd delete some parts.
At its current state, the program runs at 11-15FPS on my machine (2GB RAM, Vista Home Prem 32bit, Dual Core 2.20GHz, GeForce 8600M GT), which is painfully slow. Especially if it is to be used in a program where the speed will only go down further."


Seriously??? 11-15FPS?! TBH I was not expecting that. I'm getting a solid 50FPS or so on a single-core 1.8GHz processor w/ 1GB RAM, a GeForce Go 6150 and Vista Home Premium 32 bit.

But I'll switch to Cloggy's plugin. Luckily at this point I've consolidated all the drawing to one function, so it shouldn't be very hard.

Quote: "Other than that, it really looks good! My favorite's still the gradient one."


Thanks.

EDIT:

I've updated the first post to use the D3Dfunc functions. Tell me if you get any improvement, specifically with Gradient Fill and Rounded.

Back to top
Profile PM
Sven B
19
Years of Service
User Offline
Joined: 5th Jan 2005
Location: Belgium
Posted: 17th Jan 2009 18:22
Link
The new version ran at a solid 350FPS for me when copy-pasted...

There must've been some problems on my computer. I retried the version without Cloggy's DLL, and it ran at 340FPS.

I'm sorry for putting you through this.

It's the programmer's life:
Have a problem, solve the problem, and have a new problem to solve.
Back to top
Profile PM Email
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 17th Jan 2009 18:27
Link
Quote: "I'm sorry for putting you through this."


Ah, no probs. If anything you've helped me because Cloggy's is giving me huge improvements for some of the draw styles.

Back to top
Profile PM
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 17th Jan 2009 23:07
Link
K, I have pretty much everything in this now that I'm going to need, so it's pretty much done for now, however if you have a request for a certain widget I'd be glad to try and add it.

Back to top
Profile PM
BMacZero
18
Years of Service
User Offline
Joined: 30th Dec 2005
Location: E:/ NA / USA
Posted: 19th Jan 2009 05:17
Link
That is COOL! I'm definitely bookmarking this, it will be a great help next time I need to make a level editor.

Good job .

Back to top
Profile PM Email Website
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 19th Jan 2009 05:29
Link
Quote: "That is COOL! I'm definitely bookmarking this, it will be a great help next time I need to make a level editor.

Good job ."


Thanks! If you have any requests for widgets I'd be glad to add them.

Back to top
Profile PM
BMacZero
18
Years of Service
User Offline
Joined: 30th Dec 2005
Location: E:/ NA / USA
Posted: 19th Jan 2009 05:57
Link
If I ever find any I really need, I'll be sure to post them up. Thanks .

Or are you looking for ideas? 'Cause I started making one of these a year or so ago and I had all kinds of crazy ideas I could post up. (Linear and radial sliders, drop-down menus, and text entry fields, just to name a few).

Back to top
Profile PM Email Website
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 19th Jan 2009 06:04
Link
Quote: "If I ever find any I really need, I'll be sure to post them up. Thanks .

Or are you looking for ideas? 'Cause I started making one of these a year or so ago and I had all kinds of crazy ideas I could post up. (Linear and radial sliders, drop-down menus, and text entry fields, just to name a few). "


Well, basically, I made this for my level editor, and it already has everything I'm going to need. However if somebody else like you needs something added I'd be glad to add it.

Back to top
Profile PM
Kohaku
19
Years of Service
User Offline
Joined: 3rd May 2004
Location: The not very United Kingdom
Posted: 19th Jan 2009 13:33 Edited at: 19th Jan 2009 13:37
Link
Looks really nice!

I do like a visually-simple GUI.



Back to top
Profile PM Website
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 19th Jan 2009 18:55
Link
Thanks! I'm trying to keep it as simple yet appealing as possible, while also keeping it flexible. For instance I can go from this:



to this:



by changing three lines of code.

Back to top
Profile PM
Phaelax
DBPro Master
21
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 19th Jan 2009 21:14
Link
well done, results look great. I too was trying to make a windowing system with all the necessary window components. I'm still in the process (took a very long break) of determining the best method for organizing the data structures and how to maintain everything.

Lemme know when you make the "aqua" theme!

DB Code Corner
Back to top
Profile PM Email Website
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 19th Jan 2009 22:29
Link
Quote: "well done, results look great."


Thanks.

Quote: "Lemme know when you make the "aqua" theme!"


I wish! I'm not sure I could get very close using nothing but 'D3D_Line' and 'D3D_Box' though.

Back to top
Profile PM
Sasuke
18
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 20th Jan 2009 19:34
Link
Hi AndrewT, Nice Work, looks great so far

My only concern is that your using this for a level editor which top performance is a must. Sven B said the new version ran at 350 Fps (I haven't been able to test it yet, sorry), if you think about it, thats only one window with a few gadgets on it. What if you had lots of windows or menus, lists etc, with lots of objects loaded aswell, I don't think the system could take it.

Personally I use an image based gui for top performace (the good old draw everything onto a bitmap - get image method), I make sure the fps is running well into the thousands (2500-4500fps is my target) before adding objects to the scene. You could even still have resizable windows which would only slightly dampen performance. Or maybe an image/sprite based gui which is still pretty fast.

When I was making my editor, I bumped into lots of problem with the performance of my Gui before I switched to image/sprite based.

I still love your Gui though, there some great work here, just thought I'd give you a heads up thats all.

A dream is a fantasy, if you achieve that fantasy it was never a dream to begin with.
Back to top
Profile PM Email
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 20th Jan 2009 20:40
Link
Sasuke:

Thanks a bunch for the info. First off thank you for pointing out the possible performance issues. I'll definitely consider image-based in the future, however I'm going to *attempt* the level editor with my current GUI and and see how it does once I get into the more complicated aspects. If I have major performance problems then I'll switch to image-based. As for the 2,500-4,500 FPS target, well that's out of the question for me. An empty scene in DBP runs at 200 FPS tops for me (don't worry though, I'm getting a new laptop soon). Anyways thanks for bringing up the point.

Back to top
Profile PM
Sasuke
18
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 20th Jan 2009 21:43
Link
Quote: "As for the 2,500-4,500 FPS target, well that's out of the question for me."


Ohh sorry, I keep forgetting that my computer is like a Deathstar powered by a sun. Anyway, i'll be following your project, like to see how it turns out, so good luck

A dream is a fantasy, if you achieve that fantasy it was never a dream to begin with.
Back to top
Profile PM Email
Sven B
19
Years of Service
User Offline
Joined: 5th Jan 2005
Location: Belgium
Posted: 21st Jan 2009 16:42
Link


This little snippet ran at 780FPS. So if this is pretty much a maximum, I consider your GUI decent when it comes to speed.

It's the programmer's life:
Have a problem, solve the problem, and have a new problem to solve.
Back to top
Profile PM Email
Sasuke
18
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 5th Feb 2009 18:02
Link
Just if your still at this, theres another way to speed this up by alot. Instead of updated everything thats being drawn every frame, you draw it to a bitmap and copy the bitmap to the root bitmap every frame. This is very similar to using get image and pasting it every frame but without the get image slowdown, you only update the bitmap when you need to. So for example:



That should work, not tested, but thats the basic method.

A dream is a fantasy, if you achieve that fantasy it was never a dream to begin with.
Back to top
Profile PM Email
AndrewT
17
Years of Service
User Offline
Joined: 11th Feb 2007
Location: MI, USA
Posted: 5th Feb 2009 20:31
Link
Thanks for the input Sasuke. I'm currently involved with C++ and SDL atm so I'm not currently working on this code, however I have considered the idea of converting it to a plugin so when I come back to this I'll try out your method.

Back to top
Profile PM
Back to top

Login to post a reply

Server time is: 2024-05-02 01:40:20
Your offset time is: 2024-05-02 01:40:20