Using a MediaElement in Windows Phone App

I will assume that you have installed the tools for working like Visual Studio 2012 ( or 2013 ) and that you’re on Windows 8 at least ( or 8.1 )  .

In this workshop we will learn to use a MediaElement in our Windows Phone application .

We will begin with setting up our XAML code , we will use two buttons for a Playing and Stoping , and a slider for the volume and of course a MediaElement :

Let’s move now to the C# code and get our MediaElement to run , we will need aDispatcherTimer : it’s a timer which is processed at a specified interval of time and at a specified priority. Also we will ned to configure our MediaElement depending on the MediaOpened or Stopped , it will be like this :

We will set up now the source of our sound and code the eventhandlers for the click on the two buttons : 

We will be set up the code for the slider right now and control the volume with some C# code :

Run your project and you click run and the MediaElement will play the sound that you already used , you can use a local MP3 file also , you just need to set up the right path in the code .

Transfering multiple data between pages in Visual Studio

I will assume that you have installed the tools for working like Visual Studio 2012 ( or 2013 ) and that you’re on Windows 8 at least ( or 8.1 ) .

In this workshop we will be transfering multiple data between pages in our Windows Phone application . We will be using new elements in the XAML code and using C# Classes .

Go ahead and create a new project , then follow these steps :

We will be working with Angry Birds today and handel their transfer between pages , so we will create a C# class named Bird that we will use during all the workshop : Right click on the project –> Add –>Class

We will add now a new class called SharedInformation that will contain all the informations that pages will be sharing .

Now add a new page to your application : Right click on the project —>Add—>New Item —> Windows Phone Portrait Page , then name it SecondPage.xaml

We will start now handeling the transfer of the data :

We will add a new XAML element which is listbox

Then we need to add some C# code to be able to work with the listbox , let’s add this code in the MainPage.xaml.cs

Let’s explain now what we are doing :

This listbox will contain multiple images of angry birds , you will select more than one bird and navigate to the second page and in this second page you will find what you’ve already choosen .

So here’s how things work :

We are preforming a Binding on this listbox to get elements

The image we’re using has also a Binding to the proprety imagePath

The textblock is binded also to the proprety name .

The whole workshop is based on a single line of code that will handle the link and transfer of the data , this line of code is : birdList.datacontext= birds;

We will now add a big feature in Windows Phone which is the application bar , we will have a workshop about application bar and how we use it but it’s not a big problem you can just use the code written here and will understand the concept .

We’ve added some images in the Assets of the application and add an event on each click of each button of the application bar .

Now let’s add the code behind of these events .

In this event we will learn how to navigate between pages in Windows Phone , this navigation will happen with this line of code :

 NavigationService.Navigate(new Uri(“/SecondPage.xaml”, UriKind.RelativeOrAbsolute));

We will move now to the SecondPage.xaml and an event on the load of the application , we can add this using XAML :

You can notice in the last line that we’ve added Loaded which is an event for the phone application page load , we will add now the C# code of this event :

Before running this project , just make sure that you’ve added some pictures in the Assets because I’ve used the angry birds pictures here .

Save the project and run and enjoy transfering multiple data between these two pages .

Working with Row and Column Definitions in XAML

I will assume that you have installed the tools for working like Visual Studio 2012 ( or 2013 ) and that you’re on Windows 8 at least ( or 8.1 ) .

In this workshop we will be working with a big part for coding on Windows Phone which is the XAML code .  The XAML code helps us to handle everything that exists on the application like Buttons , TextBlocks , Images .

Here’s an example of XAML code that uses a Grid :

During this Workshop we learn together how to use all the space available in the screen of the Windows Phone and devide it into 4 parts . This will help us in developping any application to organize our contents .

Go Ahead and create a New Project , then follow these steps :

In the main Grid which is Content Panel add these lines :

With these lines we ‘ve made our Grid with 2 rows and 2 columns , we will see now how we can have access to each “box” of the Grid .

We will add a Button now with this code , I recommend you to type this code by yourself to experience the XAML , don’t preform a Drag and Drop :

You can notice that I gave the Button a name as Btn1 which is one of the best practises to organize our code behind and have accessto multiple Buttons .

Content will contain the content of the Button , we used 1 here .

Foreground is for the color of the content of the Button , I gave it here a StaticResource which is PhoneAccentBrush , this will help us to get the color of the theme on the Windows Phone ( you can check this if you have a device )

The important part here is Grid.Column and Grid.Row , I’ve given the Button a specific place in our Grid , it will be in the (0,0) position.

We will add now 3 other Buttons and change their position as usual :

We will work now on the code behind for each event  , we are trying to show a number for every Button clicked , we will add this code for each event now :

You can save your work and run the application now , you will see that on every click on a Button you will have its number shown . This helps us to learn how to devide the Grid and use multiple Button in one Grid using the XAMl code .

Working with ApplicationBar in Visual Studio 2013 in Windows Phone 8

create a new project (Windows Phone 8 Blank App Silverlight) , then follow these steps :

In the MainPage.xaml , go to the bottom of the page and add these lines of code and watch what’s happening :

We will add now for each button an event as we did in the previous workshops :

The most important thing in this workshop is to be able to handle the application bar not the events , as you can notice here I’ve added  two buttons and two menu items , you can add up to 4 buttons and assign them with application bar images and it will look like this :

If you’re wondering how to get these pictures , go to Program Files –>Microsoft SDK’s —>Windows Phone–>V8.0–>Icons and you will find Dark and Lignt icons there :

Choosers in Windows Phone 8 using Visual Studio 2013

I will assume that you have installed the tools for working like Visual Studio 2012 ( or 2013 ) and that you’re on Windows 8 at least ( or 8.1 ) .

You can use Choosers in your Windows Phone applications to enable users to perform common tasks. By using choosers , you help provide a consistent user experience throughout the Windows Phone platform. At the same time, by using choosers , you can distinguish your applications by providing additional functionality such us choosing an email , a phone number , or an address inside the application and much more .

Let’s learn now how to use this great tool  , Go ahead and create a new project , then follow these steps :

The first thing that we will do is to create four buttons in our application , you can write the XAML code or just preform a simple drag and drop , then let’s change the names of our buttons like we did in our previous workshops , and add to each one an new event handler :

Now , we will be working on the code behind of each event handler we already created , let’s start with the first one which is the Adress Chooser  :

This choosers will help us find the adress of each contact we have in our Windows Phone in order to use it inside your application for another feature , of course the contact you have chosen have to be a contact that already written his adress into his account , of course we will need the namespace of Tasks like we did in the workshop of launchers :

We will create an object of type AdressChooserTask and a new event to show in a MessageBox what’s the contact you have chosen

Let’s move now to the next chooser which is the camera capture . For example if you want to add a feature of taking a picture inside your application you will need to use this chooser to give the user a simple way to open the camera without leaving the application , we will create an object of type CameraCaptureTask :

Another important Chooser is the Email Chooser , you will be able to give your user the ability to choose an email of a contact in order to send him an email via the application for example , we will use now an object of type EmailAddressChooserTask :

Let’s move to the last chooser of our workshop which is the Phone Number chooser , your user can choose a contact and find its number ( if it’s added of course ) and use inside the application , our object now will be a PhoneNumberChooserTask :

There are other choosers that might be helpful for you in your application but I’ve chosen these one because they are the most common ones and we will use them in our next workshop to develop our first applicaiton together . You can find other choosers in MSDN here in this link .

Please note that the Camera chooser will not work on the emulator of course . Here are some screenshots of our workshop tested on a Nokia Lumia 920 :

Launchers in Windows Phone 8 using Visual Studio 2013

I will assume that you have installed the tools for working like Visual Studio 2012 ( or 2013 ) and that you’re on Windows 8 at least ( or 8.1 ) .

You can use Launchers in your Windows Phone applications to enable users to perform common tasks. By using Launchers, you help provide a consistent user experience throughout the Windows Phone platform. At the same time, by using Launchers, you can distinguish your applications by providing additional functionality.

Let’s learn now how to use this great tool  , Go ahead and create a new project , then follow these steps :

First thing that we will do is something that we’ve already done in the previous workshops ,let’s make our grid with 3 rows and 2 columns .

The Grid will look like this :

It’s time to add our buttons now just like how we did in a previous workshop , let’s follow some best practises and name them like this and add the event handlers :

We  will add now the code behind for each event :

Let’s start with our first launcher : WebBrowserTask

This launcher will help us open the browser in the Windows Phone , but make sure to add the namespace Microsoft.Phone.Tasks; be fore starting

The code for the WebBrowserTask is :

Let’s move now for the PhoneCallTask which is a launcher to make a phone call from the application :

We need to check a capability for this in the Manifest file : Id_Cap_PhoneDialer

Now we can add some C# code for the event :

Let’s try now another launcher which is EmailComposeTask :

This launcher will help us send an email via the linked inbox in the Windows Phone through the application

You can see that I’ve added the reciever , subject and my other email , you can get these parameters from textboxes if you want in your application

What about getting ratings for your application ? Yes it matters , and therefore we can use a launcher to help the user rate our application inside it not forcing him to leave it .

We will use the MarketPlaceReviewTask :

And what if you want to promote your other applications in the store for your user ? In fact yes you can , just another launcher , as simple as that :

Let’s use the MarketPlaceSearchTask :

And if you’re using internet connection in your application and you want to redirect your user to the WiFi settings without leaving the application , just use another launcher which is : ConnectionSettingsTask

Let’s explore now some results of our launchers from these screen shots :

You can now save your work and run the project , please note that the EmailComposeTask and MarketPlace launchers won’t work on the Emulator