Skip navigation

Category Archives: Development

How to develop for Windows Phone 7.

Okay, I won’t waste time and jump to the new things. Please be notified that I will focus on the new features in area of development.  for all new stuff in Windows Phone Mango update please check this informative video.

  • Background processing:  apps will be able to run in the background with some restrictions. app will be restricted to use 10% of the CPU power and just 5MB of RAM. Also for people who would like to design mobile social hub, you will be enable to make your app in the background runs every 30 min for 15 sec to sync data.
  • New profiler and emulator: more enhanced emulator performance and debugging experience.
  • Use of Silverlight + XNA together: in the same app.
  • Silverlight 4
  • IE9 web browser control: hardware acceleration for blazing web browsing experience on the phone.
  • Live Tile enhancements: you can update your tile info, graphs locally without the need for a remote service or internet connectivity.
  • Additional sensors: direct camera access, compass & gyro
  • Fast application switching: switching between open 3rd party apps is now available.
  • Networking / sockets for communications: yes you can now open ports and start communicate!
  • Local SQL database: for those who wanted to CRUD structured data locally on phone, yes this day comes true.
  • Access to calendar and contacts for apps: in the last version you had Phone Number Choose, that enable you to pick a phone number for a contact. now you can select whatever the info or data your want about the contact. and about the calender, yes this is sweet!

Smart phones are full of awesome capabilities and features. These capabilities could be hardware or software components. For example it could be a hardware like Camera, or could be a software like phone contacts book. Windows phone made it easy task for the developer to get use of such capabilities in their own apps. Before we go on, you should meet Launchers and Choosers

It is confusing somehow to tell the difference between the two expressions but in general:

Launchers: are complete out of box components that you fire and forget, like SMS or Email composer, media player  and so many other components.

Choosers: are look-up like components. For example you may like to select a phone number from those saved on your phone. This is a perfect look-up task, and it will be done through PhoneNumberChooserTask chooser.

NOTE: Launchers do not return data, while choosers do!

Next you will find all official Launchers and Choosers that are available with Windows Phone 7 RTM.

Launchers

  • EmailComposeTask – Allows an application to launch the email application with a new message displayed; use this to allow users to send email from your application
  • MarketplaceDetailTask – Allows an application to launch the Windows Phone Marketplace client application and display the details page for the specified product.
  • MarketplaceHubTask – Allows an application to launch the Windows Phone Marketplace client application.
  • MarketplaceReviewTask – Allows an application to launch the Windows Phone Marketplace client application and display the review page for the specified product.
  • MarketplaceSearchTask – Allows an application to launch the Windows Phone Marketplace client application and display the search results from the specified search terms.
  • MediaPlayerLauncher – Allows an application to launch the media player
  • PhoneCallTask – Allows an application to launch the Phone application; use this to allow users to make a phone call from your application
  • SaveEmailAddressTask – Allows an application to launch the contacts application; use this to allow users to save an email address from your application to a new or existing contact
  • SavePhoneNumberTask – Allows an application to launch the contacts application; use this to allow users to save a phone number from your application to a new or existing contact
  • SearchTask – Allows an application to launch the Web Search application
  • SmsComposeTask – Allows and application to launch the SMS application
  • WebBrowserTask – Allows an application to launch the Web Browser application

Choosers

  • EmailAddressChooserTask – Allows an application to launch the Contacts application; use this to obtain the email address of a contact selected by the user
  • CaptureCameraTask – Allows an application to launch the Camera application; use this to allow users to take a photo from your application
  • PhoneNumberChooserTask – Allows an application to launch the Contacts application; use this to obtain the phone number of a contact selected by the user
  • PhotoChooserTask – Allows an application to launch the Photo Chooser application; use this to allow users to select a photo

Community Rocks!

Today I will just mention two important open-source amazing libraries that is result of the hard work from the Windows Phone community.

WP7Contrib

WP7 Contrib is a set of components to help build WP7 Apps. It can be plugged into MVVM Light or used as separate components in your App. Our goal is to provide a set of tools and patterns that help WP7 developers.

PhoneyTools

Collection of 3rd party libraries that should help developers to access more Windows Phone functionality that is not available in the main windows phone framework.

It is advised to read the brief description and documentation for each library before you start  using them.

Intro

Modern mobile applications design is evolved for many years. Nowadays it is all about the user life. For a user, whenever he or she launches the application, he or she is expecting the application to give him or her what it is most important for the moment. It is very advised in the process of developing a mobile application, is to take care of three characteristics. Application should be Personal, Relevant and Connected.

I will make an example for typical application for an active sales man who want to make business on the run. I will show how to apply principles mentioned here to make a modern mobile application.

Typical

Image above is the screenshot of the typical “My SAELS” application in the old days. You will notice the app home screen if full of tasks related to me and other colleges in Sales team in my company. Even tasks assigned to my colleagues will appear in the app home screen! Wired?

Personal

First thing I want to see when I open my application is my data. Things I will care for the moment are the tasks assigned to me. I am even want only tasks for today, because the most critical thoughts in my mind is concerned about today sales tasks. After applying this principle, my sales app will look like that:

 

Personal

Relevant

Now I got my personal information, I need it relevant. If you can notice, in previous screenshot, MY SALES app is telling me that I have two sales tasks for today. To make it relevant, I want application to show me the needed task when I am already in company I am planning to visit today. for example when I launch the application, GPS sensor in my phone will detect that I am currently in or near from Contoso head office, so the application will show me the task related to today Contoso sales operation! Check next screen shot:

relevant

OutLine:

If you know about Context web, or what is commonly known as Web 3.0, where the web will interact with real data from your real world. For example when you search for Pizza, search results will be bound to those Pizza restaurants near from your current location, sure you will get the idea around concept Relevant.

Connected

Cloud computing is all about making you connected to the world through internet. Titan name like Amazon, Google and for sure Microsoft had made big progress in turning internet into a connected platform.

Back to our MY SALES app, it will be a useful asset in your application to keep you connected with your manger and colleges in team with updates occurred on your tasks.

For example when I finish my task at Contoso, I want my Sales manager to be notified with last update happen to my task.

 

Connected

NOTE: to make my app connected always, we will need to make a new post about Push Notifications for Windows Phone!

I wish you now get the principles.

Thanks for your time Smile

Splash screen is the beautiful screen that shows up once you launched the application on your desktop or smart phone. In this post we will try illustrate the easiest the way to make a splash screen for your Windows Phone application.

First we need a JPEG lovely image that could act as a splash screen with (480*800) pixels size. I have opened my Paint and created some cool splash screen for this demo purpose .

Now add this image file to the application solution folder. Right click on the splash screen image file and select properties. Change Build property from Resource to Content.

Now we finished and you can start your application with your new splash screen!

NOTE:

It is very important to ensure the name of the splash screen image file to be SplashScreenImage.jpg. This is the acceptable default name for a automatic splash screen in a windows phone application.

 

Limitation:

This splash screen is very limited to a static splash screen. In case you want to make a cool splash screen with updating status label about what is happening in the background of the application, you will be in a need to make a much more sophisticated one. For example if you are making a splash screen for a Twitter client app, you might need a splash screen that shows updating status like (Connecting Twitter, Updating Status, and so on).

 

First impression I got once I saw a demo about Windows Phone 7 for the first time, was that, “this is most original user experience we got ever since the first demo for Apple iPhone”. This user interface is built on a UI philosophy called Metro.   The Metro design principles center on a look that type to echo the visual language of airport and metro system. Your homepage is full of shortcuts for applications, your favorite applications. Not just that, but also every shortcut, known as Tile is informative and update-able. For example, application of Messages will have the popular conversion icon, plus the number of new unread messages.

All this Metro stuff is focusing on doing more with less through the phone home screen. Yet our focus for this post would be for the applications themselves. There is mainly three common interfaces you will find in most Winows Phone 7 applications:

  • Panorama UI
  • Pivot UI
  • Free-style UI

Free-style UI is all what you have used to do or design in the previous age! Our focus today would be on two new interfaces Panorama and Pivot.

Panorama

If your application got too much content to show to the user, this style would be your optimal choice. If the application will show too much non-structured content (like group of images and videos) to the user, it is much more lovely and user friendly to subdivided it to small groups of similar items. These groups would be spread widely throught the application interface, so user will navigate between virtual pages (divisions) right and left, which is far better than tracking items comparing to up-to-down style. Check next example:

Pivot

If your application is dealing with well-structured data like tweets from your friends on Twitter, or send(receive) messages from your Exchange Server like Outlook, this is the required UI style. Check next example:

NOTES:

  • You are totally free to use any of those two styles, for your own application.
  • you also free to combine both styles in the same application.

In next development post we will try to make sample application for Panorama and Pivot UI styles.

Some of the materials in this blog was based on “UI Design and Interaction Guide for Windows Phone 7 Series” documentation. You can download this documentation from here.

If you like to learn by the video tutorials, you will find this amazing tutorial, Windows Phone 7 Development for Absolute Beginners on Channel9 site of Microsoft.

Have a nice watch!

This is very classic. Whenever you try to learn about a new programming language or a new development tool, you create a “Hello, World” application.

Goals:

  1. Being familiar with the Microsoft Visual Studio 2010 Express for Windows Phone.
  2. Creating a simple  Hello World application to be familiar with the cycle of app development.

IDE

First, run the tool that you will develop the application. Start –> All Programs –> Microsoft Visual Studio 2010 Express for Windows Phone. I am assuming that you already had downloaded the required tool and installed it.

Visual Studio Windows Phone 2010 home screen.

To create a new project, click the New Project link in the home screen. Or from File menu, select New Project. New Project dialog window will pop up. make sure to select Silverlight for Windows Phone from Visual C# under installed Templates part of the window. Later we might make a post about creating XNA game application for windows Phone.

In the middle part of the New Project dialog, you will notice 5 different projects for Windows Phone 7. These types are like next:

  • Windows Phone Application: a standard standalone application. Make sure to select this template.
  • Windows Phone Databound Application.
  • Windows Phone Class Library: for resuble components to be used in many other applications. e.g. : Math library.
  • Windows Phone Panorama Application: specific Windows Phone 7 UI. we will have a detailed post about later.
  • Windows Phone Pivot Application: specific Windows Phone 7 UI. we will have a detailed post about later.
New Project window.

New Project window.

Now give a name for the application (HelloWorld),  select a location for the solution file to be saved.

Now the IDE will be shown in like next image.

First Form

You will notice that the left part of the IDE, is a phone theme contains a very initial form with an application name and page title. This is the Designer part. Here you can drag and drops controls from your toolbox and arrange them around your form space.You will love to deal with this part if you are experienced windows application designer. We will see that in a moment.

The middle part is a XAML part. It is is a declarative   XML-based language created by Microsoft which is used to initialize structured values and objects. You will love to create objects and deal with them using this part if you are HTML and JavaScript guru!

Now we want to add a label that will hold our welcome message. But there is not Label control in Silverlight. There is TextBlock. Drag and drop it to somewhere in the page.

After adding the TextBlock control, go to the XAML code. You will find in the content panel area, a new tag for a TextBlock has been added. find the attribute Name, and change it to lblMessage. After renaming the TextBlock control object, we want to set the Text property value to show “Hello, World!”. Right click the control in the designer and select Peroperties. In properties windows, select Text property and change the value in it to Hello, World!

Properties Window

Properties Window

NOTE: Whatever the property you change its value, you can do that from both properties window or XAML code editor.

Now you are ready to run your to run your first Windows Phone application. just a second before you hit the lovely green play button in your IDE task bar, select the appropriate running mode from the available two options :

  • Windows Phone 7 Device: in case you have a Windows Phone 7 hardware. You will be in a need to have a Zune software which is required to sync data between your PC and your phone.
  • Windows Phone 7 Emulator: Which will preferable selection as long as you write code and test it.
Emulator

Running Options

 

Hit the run button and here we are. Congrats for your very first Windows Phone!!

Hello World Application

Hello World Application

OKEY, Windows Phone 7 is cool. I believe I want to start to develop an application. Now what ??

If you are welling to design and develop an amazing game you will take the XNA way. Else, you will take the SilverLight way.

Before you start, you will need to make sure that your developing machine works on Windows Vista, Or 7. Not to mention, having the latest updates and service packs.

Now you will need to get the Tools.

Then get the Resources.

Now you get every thing we need to start. Let’s do it.

HTC HD 7

Source: Engadget