Getting Started
When creating a Windows application, you start with a Form. You can then add multiple controls to the form. I used this same concept and created a Form class which inherits from the Game class. The form is just the container that really parents the controls within itself. It handles calls that load content, draws and updates which then filter to the child controls.
After creating the form, it's time to create our controls. Following will be screen shots with a short explanation of each item.
TextBox Control
The TextBox control allows a user to input text. It handles 3 Text Modes: SingleLine, MultiLine and Password. One thing I discovered, is that Microsoft's XNA Zune Extensions, does not expose the keyboard to us, so I had to create my own keyboard.
Keyboard Control
The Keyboard control simply allows characters to be added to the TextBox control. There are two basic modes: Letters and Other, as seen in the screen shots above.
Label Control
The Label Control is simply a way to put static text on a form or control. There are several properties that can assigned that will determine how the label is displayed.
ListBox Control
The ListBox control allows for multiple options to be put into a format where the user can scroll up or down to view the items and then make a selection. The ListBox control contains a collection of ListItems. The ListBox only draws the ListItems that are visible on screen at any given time.
Context Menu
The ContextMenu displays when a user touches and holds for a short time. The menu will then display and allow for a MenuItem to be selected. In this case, the ContextMenu is a way the user can switch between TabPages of the TabControl.
TabControl and TabPages
The TabControl has been displayed in all the screenshots thus far. There are three ways to navigate between TabPages.
- Click the arrows in the TabControl's header.
- Use the ContextMenu as shown in the previous screenshot.
- Swipe left -> right / right -> left.
Each TabPage can have it's own backcolor and control collection.
Checkbox Control
The Checkbox control is pretty simple, touch the control and it changes its checked state.
Button Control
These screenshots show the Button control and that an image can be applied as the button allowing for both normal and pressed states or the default Button control with a border and backcolor. It changes backcolor when in its pressed state.
There is a lot more to do!
Although I feel really good about the progress, there is still a lot to do in order to have a stable product. From the screen shots above, no doubt you have noticed some of those issues. My next two tasks are as follows:
- When clicking the change the text of a TextBox that is set to MulitLine, I need to adjust the display of the Keyboard TextBox. I also need to added a scrolling capability to the TextBox MultiLine.
- Currently, the ListBox control stops scrolling as soon as the user stops touching the screen. I need to account for a continuing scroll for long up/down swipes.
I hope this at least gives you an idea of the project. If you'd like to download the current Zune.Forms.dll or the source code, visit our CodePlex page:
ZuneForms.codeplex.com