A gooey, er, GUI mess

One of the things I'd like to have in my OpenGL-based graphics applications is some sort of graphical user interface (GUI, pronounced gooey).  I guess you could consider the mouse selection I showed in a previous post an example of a GUI, but that's not enough.  I've also shown simple text output overlaid on the graphics in the flight simulator port.  Neither is sufficient.  I want at least some basic buttons, textboxes, etc. that can be displayed and interacted with when appropriate.

There are a few approaches I could take.  There are a lot of frameworks out there for doing this, particularly if I were working in C/C++.  There are even a few C# wrappers to such frameworks, and a very small number of C# only libraries (see Empty Keys, for instance).  Or I could use WPF or Windows Forms, btu that ties me to Windows.  There are some cross-platform C#/.NET GUI libraries (like Avalonia), but few have good OpenGL integration, or they're such beasts I won't bother.  (If anybody knows of a good one, do please post in comments.)

So I decided to take a stab at my own GUI.  Its not currently integrated with my OpenGL code, but is stand alone.  (The background image is one of the samples Microsoft includes in the default Windows 7 install, not an awesome desert rendering I created - wouldn't it be awesome if it was?) Nevertheless, with about 5 hours work this evening I have something that's starting to work.  It consists of my own code and uses the System.Drawing library (for which the Mono Project has an equivalent for Unix-y systems), so is reasonably cross-platform.  I've got a bit more work to do on it, but you can see it in all its non-glory below.

A basic GUI

Buttons, labels, and panels are the only controls that exist right now, but they're more or less working. In the immediate future I envision creating text box and check box controls, but not the full panoply of different controls/widgets from Windows Forms, WPF, Qt, Gtk, etc.  Also, being able to display images would be very nice, and should be fairly simple, but mixing them with text on the same control (i.e. text and image on a button) is something a bit more complex (for the layout and clipping calculations) so that will wait until tomorrow.  The other effort would be making the panel control a bit fancier.

The one panel seen here in the center is emulating a dialog box, but not doing the world's best job of it.  The title bar at the top is optional, but when turned on it looks rather lame. It needs to be improved.  In the prototype, it appears whenever I click the big red "Do NOT click" button, and disappears again when its OK button is pressed.  Options and features for dragging, resizing, and collapsing/expanding would be nice - but I'm not sure I want to spend too much time on this.  I'm not looking to create something to let me build full-blown applications like I do in my day job, I'm looking to provide some minimal UI in places where user input is required.

Anchoring is one of the features that's complete and in place.  You can resize the window and the buttons in those corners will stay anchored as they've been set.  I don't have percentage-based locations/sizes like some GUI systems provide, which would be nice.  everything is in pixels, but they're specified relative to the edges.  So if anchored to the right edge, and the control has a right value of 10, it will appear 10 pixels to the left of the right edge, regardless of window resizing.

A couple other nice-to-haves that I may omit in the short term are rounded corners, gradient fill, and background images.  There's all nice features, but not essential.  Windows Forms-style docking would be another cool feature, but again not critical.  A persistence mechanism, so the layout could be edited on screen and saved, would be really need, but again not something I plan to address right now.

I've got a few more miscellaneous points to bring up, and then I'm calling it a night.  First, there's a nice set of modern (i.e. black and white) icons available free under the Apache license, apparently the end result of a project started by Google.  I may end up using them, or not, but thought I'd call them out in case anybody who reads this blog has need of such.  The other point is.... I can't remember. Maybe I should finish up and get some sleep.  Goodnight, world!