Designing a Button


You can keep the code for your button in the same gui.cs code file you've been using up to this point (which is what the code on the included CD does), or you can put it in its own code file, which you would need to add to your project. Either way, add the class in Listing 5.9 to your code file.

Listing 5.9. The UiButton Class
 /// <summary> /// Will hold a 'button' that will be rendered via DX /// </summary> public class UiButton {     private Sprite renderSprite = null;     private Texture buttonTextureOff = null;     private Texture buttonTextureOn = null;     private Rectangle onSource;     private Rectangle offSource;     private Vector3 location;     private bool isButtonOn = false;     private Rectangle buttonRect;     // The click event     public event EventHandler Click;     /// <summary>     /// Create a new instance of the Button class using an existing sprite     /// </summary>     public UiButton(Sprite sprite, Texture on, Texture off,         Rectangle rectOn, Rectangle rectOff, Point buttonLocation)     {         // Store the sprite object         renderSprite = sprite;         // Store the textures         buttonTextureOff = off;         buttonTextureOn = on;         // Rectangles         onSource = rectOn;         offSource = rectOff;         // Location         location = new Vector3(buttonLocation.X, buttonLocation.Y, 0);         // Create a rectangle based on the location and size         buttonRect = new Rectangle((int)location.X, (int)location.Y,             onSource.Width, onSource.Height);     }     /// <summary>     /// Render the button in the correct state     /// </summary>     public void Draw()     {         if (isButtonOn)         {             renderSprite.Draw(buttonTextureOn, onSource, UiScreen.ObjectCenter,                 location, UiScreen.SpriteColor);         }         else         {             renderSprite.Draw(buttonTextureOff, offSource, UiScreen.ObjectCenter,                 location, UiScreen.SpriteColor);         }     } } 

You'll notice initially that this class is somewhat similar to the UI abstract class you just wrote. There are some important differences, though. First, you should see that there are two textures to store. One is used to render the button in the "off" state, and the other is used to render the button in the "on" state. It's entirely possible (and in this case, probable) that these textures will be the same file, simply with different source rectangles.

The constructor takes as arguments the sprite used to render the button, the textures for both the on and off states of the button, the rectangle sources of each of these states, and the location onscreen where the button will be rendered. Each of these items is stored for later use in the related class variable. The class itself has three other variables it will need, however. One, it needs to know what state the button is in. Because the button will either be on or off, a Boolean value is the natural selection here, with a default of off. Two, you also need to know the exact rectangle onscreen that the button encompasses. At the end of the constructor, you calculate this rectangle by taking the location onscreen and adding the size of the source rectangle. You'll find out why you need this work in a few moments. Third (and finally), because it is a button, you want an event to be fired when someone clicks the button.

The Draw method is simple. Depending on whether or not the button is on, the appropriate sprite is rendered at the correct location. The only real differences between the two calls are the texture that is passed in and the source rectangle. The last thing you need is a way to actually click the button and have its state change based on the location of the mouse. Add the code in Listing 5.10 to your UiButton class.

Listing 5.10. Handling the Mouse
 /// <summary> /// Update the button if the mouse is over it /// </summary> public void OnMouseMove(int x, int y) {     // Determine if the button is on or not     isButtonOn = buttonRect.Contains(x, y); } /// <summary> /// See if the user clicked the button /// </summary> public void OnMouseClick(int x, int y) {     // Determine if the button is pressed     if(buttonRect.Contains(x, y))     {         if (Click != null)             Click(this, EventArgs.Empty);     } } 

These methods should be called as the mouse moves around the screen and when the button is clicked. As the mouse moves around, the button state changes depending on whether the current mouse coordinates are within the rectangle onscreen where the button is rendered. This is the reason that you needed to calculate the exact screen rectangle where the button would be rendered. If the mouse button is clicked, you once again check whether the mouse is in the button's rectangle, and if it is, you fire the Click event so that whatever created this button will know about it.

The UiButton class was small and simple. Combining the UI screen classes with the buttons, you can create simple UIs for your game.



Beginning 3D Game Programming
Beginning 3D Game Programming
ISBN: 0672326612
EAN: 2147483647
Year: 2003
Pages: 191
Authors: Tom Miller

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net