Tutorial 4.1: Setting Up The Menu Styles
To make a menu (or menus), you first need to define two things: a Button Style and a Menu Style. We will do these in a new method to keep things easier and for another reason that will become clear later on. Before doing so, we must add the images this menu uses to our content directory. Download the following file, and unzip the images to your computer, Then add them to your content directory (the same way we added the model). Tutorial4Images.zip. You will also need to create two new SpriteFonts in your content folder, named MenuFont and MenuHeader. You should know how to do this from tutorial 1.4.

Now you can add the following code to your project after the Initialize() method.

XMenuButtonStyle ButtonStyle; 
XMenuStyle MainMenuStyle, PauseMenuStyle;
public void SetMenuStyles()
        // Set up the style for the buttons
        ButtonStyle = new XMenuButtonStyle();
        ButtonStyle.Background = @"Menu_Button";
        ButtonStyle.HighlightedBackground = @"Menu_Highlight";
        ButtonStyle.Font = @"MenuFont";
        ButtonStyle.Height = 23;
        ButtonStyle.Width = 281;
        ButtonStyle.TextColor = Color.White;
        ButtonStyle.HighlightedTextColor = Color.White;
        ButtonStyle.Spacing = 3;
        ButtonStyle.Padding = new Vector2(4, 2);

        // Set up a style for the main menu
        MainMenuStyle = new XMenuStyle();
        MainMenuStyle.Background = @"Menu_Background";
        MainMenuStyle.TopLeft = new Vector2(0, 0);
        MainMenuStyle.BottomRight = new Vector2(XE2.game.Window.ClientBounds.Width, XE2.game.Window.ClientBounds.Height);
        MainMenuStyle.FillTexture = null;
        MainMenuStyle.Padding = new Vector2(10, 39);
        MainMenuStyle.TitleColor = Color.White;
        MainMenuStyle.TitleFont = @"MenuHeader";
        MainMenuStyle.TitleLocation = new Vector2(15, 10);

        // Copy that style and make a few changes to it for the pause menu
        PauseMenuStyle = MainMenuStyle;
        PauseMenuStyle.TopLeft = new Vector2(0, 0);
        PauseMenuStyle.BottomRight = new Vector2(309, XE2.game.Window.ClientBounds.Height);
        PauseMenuStyle.FillTexture = @"Menu_Fill";

In the next tutorial, we will create the menus themselves and add buttons to them. Tutorial 4.2: Setting up the menus

Last edited Mar 23, 2008 at 7:58 AM by Hazardous101, version 5


No comments yet.