THIS IS UNFINISHED, DONT DO IT JUST YET
A user on ZB's asked me how to create a slidey menu for the Zune HD. So here is a quick tutorial. Ive made it very simple instead of being perfect coding so if you want something like this, rather use it for the idea instead of the actual implementation(unless ofcourse it works fine for what you need).
1) Ok lets create a button
2) Now create a XNA 3.1 project in VS or VC#. Right click on Content in your solution explorer and Add -> Existing Item. Navigate to where you have saved your button image and select it.
3) Right click on your project(not the solution) in the solution explorer and click Add -> Class. Name it Menu.cs and hit OK.
4) In the new class add the following using directives at the top:
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Graphics;
using System.Collections;
5) Now add this code inside class Menu { ... }
Vector2 pos; //to store our x and y
Texture2D tex; //to store menuitem texture
ArrayList menuItems = new ArrayList(); //stores our items
int currMaxY = 0;
public Vector2 acceleration; //keeps the items acceleration
public Menu(Vector2 pos, Texture2D menuItemTex)
{
this.pos = pos;
this.tex = menuItemTex;
acceleration = new Vector2(0,0);
}
Basically that is just the initialization of the menu object and creating the variables we will use.
6) Next, create another class(right click project -> Add -> class) and call it MenuItem.cs
7) Add the same using directives to this new class as you did the last:
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Graphics;
using System.Collections;
8) Put the following initialization code into the menu item class inside class MenuItem{ ...}
public Vector2 pos; //to store our x and y
//this x and y is in relation to the menu pos
public Texture2D tex; //to store menuitem texture
public MenuItem(Vector2 pos, Texture2D menuItemTex)
{
this.pos = pos;
this.tex = menuItemTex;
}
9) Going back to the Menu class we need to make a method to add menu items. So add this below public Menu(Vect....
public void AddMenuItem(string text)
{
MenuItem item = new MenuItem(new Vector2(0, currMaxY + 10), tex);
//creates a new item. It will get its Y value from the increasing
//currMaxY value which stores where the last item is.
currMaxY += tex.Height;//add the item height to it.
menuItems.Add(item);//add the menuitem to the arraylist.
}
10) Ok now lets add some drawing code to out Menu class. We will call the Menu DrawMe() method from our game1 class sending in the current SpriteBatch so that the Menu class can draw its items. There are better ways of doing this(like inheriting from DrawableGameComponent but for simplicity sake lets do it this way).
public void DrawMe(SpriteBatch sb)
{
foreach (MenuItem item in menuItems)
{
//this will loop through the menu items.
//the reason for adding the menu pos to the item pos is that item positions are
//done in relation to the menu. So if the items Y is 60 and the menus Y is 100 then the item will be at 160px
sb.Draw(item.tex, (item.pos += pos), Color.White);
}
}
11) Next we need one final method added to our Menu class called update. What this will do is two things, a)it will move the menu with the finger, and b) when a finger is not on it will keep them moving so that if you have 500 menu items you can flick it to scroll down fast. So add the following updateme() method to Men
TO BE CONTINUED