• Go DevMENTAL

    If I can build a Windows Phone app anyone can! Extra controls for free!

    • 0 Comments

    While the default controls in the Windows Phone SDK are nice, there are more free controls you can download and use as well to make your applications even better!

    My continuing adventures exploring Windows Phone application development. If you missed my early stories, you can find them here. Don’t forget Canada, you only have until May 20th, 2012 to have your app published to get prizes from developermovement.com

    I finally have a bit of time to go back to my Windows Phone app. I have a textbox for entering a time which forces numeric input. It works but I can’t help but feel there should be a better control than just a textbox. When I look at other windows phone apps I see a lot of really nice looking controls that I don’t see in my toolbox. After a little searching I discovered you can download a Windows Phone Toolkit and get more new Windows Phone controls for free!

    In this blog post I’ll talk about.

    • How to install the toolkit
    • How to add the new controls to my toolbar
    • What controls are in the toolkit

    So let’s see if I can figure out how to install this and take a look at what it gives me.

    Install the toolkit

    1. First I download the Silverlight for Windows Phone Toolkit.msi file to install the toolkit
    2. Agree to the terms of use.
    3. Run the file (you can save it then run it if you prefer, but I have pretty good internet connectivity so I’m going to run it directly)
    4. Now the installer launches, I accept the license agreement, click install, choose allow when prompted whether I want to let Windows run this software, and within a minute I get a message saying the software is successfully installed.

    Getting the new controls on your toolbox

    It’s installed, so now I launch Visual Studio and open up my project, but…uh… I don’t see anything different! When I go to the toolbox I still see the same list of controls. I look at the documentation tab ‘This project does not have documentation yet’, I read the page,lots of stuff about the controls, nothing about how to get them to show up in Visual Studio! Developer community to the rescue, a few Bing searches reveals the answer.

    1. In the Solution Explorer, add a reference to toolkit.dll which was installed but may not be added as a reference to your project. It shows up as Microsoft.Phone.Controls.Toolkit after you add the reference.

    image

    2. Add a new tab to your toolbox by right clicking on the toolbox and choosing Add Tab (You don’t have to do this, but by creating a new tab you can put all the new controls in one place so you can easily find them)

    3. Add the controls to the toolbox by going to your new tab in the toolbox, right click and choose Choose Items. In the Filter box type Microsoft.Phone.Controls so that all the phone controls are listed. Then select all the new controls you want to add. Just a quick note, some of these aren’t really controls unto themselves and are classes that are used by the controls (for example ListPickerItem is an item in the ListPicker Control). So you may not want to add all of them to your toolbox. Adding the reference allows you to use their functionality, adding them to the toolbox just gives you the ability to drag and drop them to your screens.

    image

    4. You should now see the controls in your toolbox

    image

    What new controls do I get?

    Wow there are a lot of them I’ll do what I can here to summarize, but I may not cover every single control. I’ll break it down the same way I did when I talked about the Windows Phone standard controls. There is no formal documentation of this toolkit so I have hunted for blog posts to help wherever possible.

    Controls for entering and displaying data

    • AutoComplete – This control allows you to have a list of words in the properties of the control. For example states, cities, provinces, countries. When someone starts typing in the control if they start typing a value in your list it will autocomplete the word. Found a blog with some tips on how to use it here
    • DatePicker – I like this one, it allows users to choose a date by scrolling to choose the day, month and year. image
    • ListPicker – This is basically a combo box control for Windows Phone, for really long lists you might prefer the LongList control. I found a blog post on ListPicker here.
    • RecurringDaysPicker – Enables you to select one or more days of the weekimage
    • TimePicker – allows you to select a time of day

    image

    • PhoneTextBox – is a rich text box control that allows action icons inside the text box that the user can tap as well as hints for users and length indicators. Good blog post here
    • LongListSelector – This is a good control for list boxes with a lot of values for the user to choose from. Found a good blog post here.
    • MultiSelectList – this is a list box control that allows you to select more than one value. Good blog post here.
    • ToggleSwitch – This is a great little control that is used in many Windows Phone applications for specifying ON/OFF values. Good blog post here.image

    Controls that do stuff

    • ContextMenu – you’ve seen this before, when someone taps and holds an item on the screen and a little pop up menu appears. We do it a lot in Windows applications. Like when you are in Microsoft Word and you right click you get a context menu for Cut, Copy & Paste. I found a blog post with some tips on this control here
    • PerformanceProgressBar – This control allows you to give feedback to a user about progress of a long running operation. Blog post here.

    Controls to make things look pretty

    • HubTile – just like the live tiles you see on the front page, you can add tiles to your application. Good blog post here.
    • WrapPanelControl – this allows you to create a panel that will organize child controls either horizontally or vertically. Blog post here.
    • LockablePivot – this control allows you to add a mode to the pivot control so that only the current item is shown. Blog post here.
  • Go DevMENTAL

    Tips and gotchas for Windows Phone: Road Trip Runner

    • 0 Comments

    This series features interviews with student Windows Phone app developers who share the lessons they learned building windows phone applications.

    This week’s interview features Kam Shing (Joe) Yip a student from Concordia University who built a game called Road Trip Runner

    To see more stories like this go here.

    rtr

    Could you briefly describe your application/game?

    Road Trip Runner is based on the imaginary little man that I used to think was running next to the car as I was bored looking out the window during a road trip. The player can choose the side of the window from where he wants to play the game. The game displays a little man running across the scene on your car window as seen with the camera from your Windows Phone.

    Tap on the screen to jump and dodge the incoming shurikens. The simple gameplay keeps the game casual.

    Did you use XNA, Silverlight or both?

    I used both XNA and Silverlight, but the game is mostly made in XNA. In particular, the textures calls, game loop and logic are in XNA. However, the game cannot be completed with XNA alone as XNA does not have access to all the tools necessary. For Road Trip Runner, I needed the raw camera data which can be accessed only through Silverlight.

    What was your banging your head against a wall moment?

    Save and load data. FileIO is not the same on the phone, I didn’t know the proper way of accessing data. In my mind I thought that a game is not the same if there cannot be a high score to beat! So I kept on pushing for the feature.

    Did you ever solve that issue?

    I wouldn’t say I solved the issue by myself. Fortunately, I have other friends working on their own apps and games which require save/load features. I asked for their help and they managed to help me solve it.

    If you had to build this same app again from scratch, what would you do differently?

    The menu, I wish I could have made a nicer menu system and better screen manager.

    Any nice surprises?

    The simplicity of the camera API was a surprise to me. In the beginning I didn’t have the right tools. I was using the 7.0 SDK. Raw camera data access can be found in the 7.1 SDK only. It took me a little time before realizing this, but when I got the chance to code in the right environment, it wasn’t long until I got the camera working. It went smoother than I expected it would.

    Did you leverage the mobile platform?

    The game is very mobile specific I would say. It is design to use what is particular about the mobile platform. So, it cannot be just any game. Mobile may have less power in terms of process or graphic, but there are functionalities that are specific to the phone, so the game is designed to use what is particular about new smartphones, their camera.

    Did you leverage the touch screen?

    The game uses tap for having the little man jump. It is the only way to control him

    What is one thing you think you did really well in this application?

    The idea I would say. It is funny how many people actually imagine a little man running alongside their ride. I saw a post on a webpage about the topic and I realize how many people actually imagine a little man running or at least something similar. I would like to bring this little game of ours to life and I did it.

    Where can I learn more about your app/game?

    yipksj.blogspot.ca

    Who developed this application?

    Joe Yip, that’s my publisher name. People call me Joe, but some calls me Kam Shing which is my other name. I am a computer science student at Concordia University in the computer games option. I make games for school projects, personal projects or events. I enjoy making games, not only it is fun, but it also gives me a sense of accomplishment.

    Look for Road Trip Runner on the Windows Phone Marketplace.

Page 2 of 2 (7 items) 12