Blender Game Engine Menu

Whenever I download a game engine, first of all I always ask 'How to create a menu'. So, lets create a menu using my favorite game engine 'Blender Game Engine'.

Start a new project. Remove everything from the viewport - press 'Ctrl+A' to select everything and then press 'Delete'. Now we have an empty project. Save the project with a name something like - Menu.blend.

First we will need a camera - go to menu - 'Add->Camera'.

A camera will be created facing down side. Move that upwards a bit on z axis.

Don't forget to save your project.

Now create a plan - go to menu - 'Add->Mesh->Plane'. A plane object will be created.

Here is the button images that we will use to make the menu.

I have made very simple two buttons, each with normal and hover images. The blue outlined button will be used as normal button and white outlined button will be used as hover button.

Texture the button using above image. Make the material 'Shadeless' -

and create four buttons with it.

Now go to camera view - press '0' on numpad. Move the two buttons with white outline out side the camera view. Scale - position the the two images as you like.

We have now our basic setup for the menu. Lets make them into working menu buttons.

Before we add scripts, rename the buttons with a unique name each.

Now select the two "Normal' buttons and duplicate it. Move that below the 'Hover' buttons. And rename the two buttons that we have inside camera view.

We will use 'Replace Mesh' to replace the mesh of the object during runtime. So, just changing the name of the object won't work here. We will need to rename the object data as well. So, do it now with each buttons.
Note: There are other ways to create the buttons. Like changing the visibility of the object, changing the position of the object, using the action etc. I am going with Replace mesh. It is up to you what you choose.

Open the 'Logic Editor' panel. Select the play button. You can make the menu:
One - only using the logic brick
Two - with python only and
Three - using both.
I am going to use both logic brick and python. You can try the other way yourself, if you want.

 

Play button still selected - add two 'Mouse' sensor - add a 'Python' controller and add two 'Edit Object' actuators

Name the actuators and sensors to something that suits our needs. We will need a mouse click and mouse over actuator. So, change the second actuator to 'Mouse Over'. In controller, select the python script( I am using Menu.py, see below for the script ) from the drop down list. With sensors, change the 'Add Object' to 'Replace Mesh' and select the appropriate mesh name from the drop down list.

Do it with 'Quit' button also. Don't forget to save your project.

Now open 'Text Editor' panel and create a new text. Name it to 'Menu.py'( as mentioned above or change it to whatever you like).

Here is the python code that we will use for both 'Play' and 'Quit' button.

import bge
cont = bge.logic.getCurrentController()
own = cont.owner

#sensors
lClick = cont.sensors["lClick"]
mouse_over = cont.sensors["MouseOver"]

#actuators
normal = cont.actuators["Normal"]
hover = cont.actuators["Hover"]

if mouse_over.positive:
    #change the mesh to hover
    cont.activate(hover)
   
    if lClick.positive:
        #do whatever you want
        print("You clicked me")
else:
    cont.activate(normal)

By default mouse cursor is set to hidden. We need to unhide the mouse cursor before we run the game. Go to 'Render' panel and check the 'Mouse Cursor' check box.

Now press 'P' and enjoy :).

Here is the finish .blend file Menu.blend