Developing a GUI in C++ and DirectX

Mason McCuskey Developing a GUI in C++ and DirectX

Part I: The Basics, and the Mouse

Before I get started, I want to throw out a disclaimer: I’m going to outline the approach I used when I created the GUI system for my upcoming title, Quaternion. Treat this text as one solution to a very intricate problem, nothing more. I’m not saying that this way of making a GUI is the fastest or easiest way; I’m simply outlining a solution that worked for me. Also, this text is not complete. Like one of those Bob-Vila TV episodes, it skips over the easy stuff and concentrates on the interesting. There is no attached source file; there are code snippets in the text, and that’s it. In that code, I’ve stripped out a lot of layers of indirection that aren’t relevant to what I’m trying to show (i.e. the wrappers that you’d probably have for your DirectX functions, non-relevant initialization and cleanup code, etc). Also, beware of bugs - I’ve done lots of bug checking, but I’m only human. If you find a bug, please let me know about it by emailing [email protected].

I’m making several assumptions about your knowledge. I’m assuming you know the basics of how event-driven programming works (message queues, etc), and I’m assuming you have a strong grasp of PDL (the commenting language - if you don’t know what this is, read Code Complete, by Steve McConnell), and C++. I used C++ to implement my GUI system, because I’m a card-carrying member of the C++ fan club, and because the OOP of C++ work great for implementing window and control types. Shameless plug for the C++ language: Note the power of OOP in this solution, and ask yourself if you could do the same thing as easily in C.

Let’s start by defining our scope. It’s important to realize up front that we’re not remaking Windows 95, we’re just trying to get a simple GUI up for a game, so we don’t have to implement every single control and GUI construct. We only need a few parts for this simple GUI: a mouse pointer, a generic window, and some dialog controls to place within that window. We’re also going to need a resource editor, a program that will allow us to design dialogs by graphically dropping controls at various places.

Start with the basics - The Rendering Loop

I’m going to start at the top, by defining a function that will calculate and draw one frame of our GUI system. Let’s call this function RenderGUI(). In PDL, RenderGUI does something like this:

void CApplication::RenderGUI(void) {

 // get position and button status of mouse cursor

 // calculate mouse cursor’s effects on windows / send messages

 // render all windows

 // render mouse

 // flip to screen

}

Pretty straightforward for now. Basically, we grab the new position and status of the mouse cursor, calculate any changes that are caused by the new position, render all our windows, render the mouse cursor, then push the whole thing to the screen.

The Mouse

Now that we’ve got a main function, we’re going to create a mouse class. This mouse class will initialize the rodent, and will be responsible for querying its position and storing the results. Here’s the definition:

class CMouse {

public:

 CMouse(); // boring

 ~CMouse(); // boring

 int Init(LPDIRECTINPUT di); // we’ll talk about this later

 int Refresh(void); // we’ll talk about this later

 int GetButton(int index) {

  if (index ‹ 0 || index › NUMMOUSEBUTTONS) return(0);

  return(m_button[index]);

}

 CPoint GetPosition(void) { return(m_position); }

 enum { NUMMOUSEBUTTONS = 3 }; // three button mouse

private:

 LPDIRECTINPUTDEVICE m_mousedev;

 char m_button[NUMMOUSEBUTTONS]; // state of buttons

 CPoint m_position; // actual screen position

};

Pretty straightforward class definition. We’ve got two data pieces, m_button and m_position, abstracted by two functions, GetButton and GetPosition(). Then we’ve got Init and Refresh functions, which initialize the mouse and Refresh its button and position information. The m_mousedev is an interface to our mouse device; we get this interface during Init(), and use it in Refresh to communicate with DirectInput.