How to bind ListBox to data in Windows phone application – Introduction

As an application developer, you can create ListBox controls without specifying the contents of each ListBoxItem separately. You can use data binding to bind data to the individual items.

In this post, I will explain with the help of an example how to create a ListBox that populates the ListBoxItem elements by data binding to a data source.

Suppose you want to display a list of students with their marks in a windows phone app. If we specify the contents of each item separately it would take a lot of time. So we make a use of data binding. The steps that need to be followed are

1. Create a new project ListboxBinding.

2. Then open the MainPage.xaml and remove the XAML code for the StackPannel named TitlePanel and replace it with the following code so as to change the page name and application name .

3. Now add the following Xaml code in the Grid named ContentPanel so as to create a list box in the page having the name mylistbox and bind the target Textblocks nameblock and marksblock with data source name and marks respectively.

 


 

4. Now open the page MainPage.xaml.cs.

5. Create a public class called Resultclass having the two properties name and marks.

6. Then add the following code consisting of two global arrays for sample data to be used inside listbox named mylistbox.

 

7. Then we can add the following data into the listbox in two ways.

First method:

First method is to create a Separate list for the Listbox and adding the items into that list. After that set the itemsource property of the Listbox to that of list created.

We can do this with the help of following code.

Second method: In second method instead of making a separate listbox we can directly add the items into the listbox. We can do this with the help of following code.
If you face any problems while understanding the above code you can refer to the following blog post to understand the basics of data binding.

http://www.windowsapptutorials.com/windows-phone/data-binding-in-windows-phone-app-one-way-binding/

8. Now call any one of the following method in the Constructor of the MainPage .Both will give the same list as the Output when you will run the application.

Suppose I call the firstmethod. Then the Constructor of the MainPage will look like


9. Now run the application on Emulator. You will see the following list created on the MainPage .


10. If you want to know more about the Listbox selected item you can refer to the following blog post

How to work with ListBox selected item in Windows phone application

11. I hope this post will be helpful to you. Download the project zip file from the link given below.

Download Full Project file ListboxBinding.zip

Checkout a related post on using ListView in android.

Using ListView in Android

How to implement trial functionality in windows phone app

This topic describes how to implement a trial experience in your Windows Phone app.
The purpose of a trial experience is to give the user an opportunity to try your app before they commit to buying it. In a trial experience, you typically offer a limited version of your app, for example, by disabling features, by disabling levels in a game, or by setting a time limit on using the app. The limitation you choose for your app is entirely up to you.

 

I will be demonstrating this with the help of an example. Suppose there are two pages in an application out of which only one can be opened in trial version that is first page .

In full version of the application you can open both the pages that is first page and second page.

The steps to followed to implement trail functionality are

 

1. First create a blank project and name it Trialapp.

2. Then open App.xaml.cs and add the following using directive to the top of the page

  3. In the App class, declare the following local static variable. The LicenseInformation class enables an app to determine if it is running under a trial license.
 
 
4. In the same App class in App.xaml.cs, add the following read-only property and local variable. This property is used to cache the license information while the app is running. The app uses the property whenever the current license information needs to be checked.

     

5.In the following sections, the license information will be checked in the Application_Launching and Application_Activated event handlers. Since this logic is used in two locations, we wrap it for convenience into its own method. In the App class located in App.xaml.cs, add the following method.    


 

6. Then open the MainPage.xaml and remove the XAML code for the Grid named LayoutRoot and replace it with the following code.


 
 


 

7. Then add two more pages to the application and name it Firstpage.xaml and Secondpage.xaml.

 


 

8. Open the Page Firstpage.xaml and change the application name to trial app and page name to first page. Similarly do it for Secondpage.xaml and change the page name to Second page.

 


 

9. In the MainPage.xaml.cs  code-behind file, add the following methods.


 

10. Now run the application in debug state you will see that the app runs in trial mode as the value of _isTrial in App.xaml.cs is true. The following screen will appear before you and the second button will be disabled.

 


 

11. Now when you will change the value of _isTrial to false the app will run as full version.

 


 

12. While submitting the app to store you need to tick the checkbox of trial functionality in your app. You can do this easily. Go to your dashboard. Select your app. Go to the app info page and check the checkbox.

 


 

 

Note: If you forget to check this checkbox you app will be available in full version to all the users in the marketplace.

 

13. You can download the Project zip file from the link given below.

 

Download full project trialapp.zip

 


How to integrate a Toolkit or Third party SDK with windows phone app using NuGet Package Manager

Toolkit provides the developer community with new components, functionality, and an efficient way to help shape product development. Certain controls and features are not provided by Microsoft for which we basically use Third party SDK.

We can integrate them with our project in a easy way with the help of NuGet Package Manager. Here are certain steps which needs to be followed for adding a toolkit or Third Party SDK.

1. There are two ways by which you can open the NuGet Package Manager window in your app.

Method 1

First one is to go to the menu bar and click on Project->Manage NuGet Packages

Method 2

Second way is to go to the Solution Explorer Window and right click on the project name and Choose Manage NuGet Packages.

2. Then the following screen appears before you.

3. Here you can search online for the toolkit or the SDK you wish to add and install it easily. For example I wish to add Windows Phone toolkit I can easily do it through this method.

4. Another method to install a SDK or toolkit is by directly adding their .dll file in the project. We can do this by going to Solution explorer window.

Then go to the References option given under the project . Right click on it and then choose the option add reference.


Then the following windows will appear before you.

Here you can add the extension dll files or you can choose it from your computer with the help of Browse option.

5. If you face any error while installation of the toolkit or SDK. The possible error might be that your NuGet Package is not up to date. You need to update the NuGet Package Manager before you add any toolkit or SDK. You can easily update it by going on the header menu and Choosing Tools->Extensions and Updates.

6. Then choose the update option in the Window that appears before you and see whether your NuGet package Manager is up to date or not.


In the above Windows there is no update for NuGet Package Manger.

Data binding in Windows Phone app – One way binding

Data binding provides a simple way for Windows Phone apps to display and interact with data. In simple terms it provides a link between the target and source. For example if we consider a Textblock and a data source whose object needs to update the value of text in Textblock we can use data binding.

 

We will now explain One way data binding in which bindings update the target with the source data when the binding is created.

Here source is a object of the class which needs to update the text property of Textblock (target).

 

The steps that need to be followed are

 

1. First of all create a blank project and name it Databinding .

 


 

2. Replace the Xaml code of the Stackpanel named Titlepanel with the following code given below.

 


 

Code:

<StackPanel x:Name=”TitlePanel” Grid.Row=”0″ Margin=”12,17,0,28″>

<TextBlock Text=”Databinding” Style=”{StaticResource PhoneTextNormalStyle}” Margin=”12,0″/>

<TextBlock Text=”One way” Margin=”9,-7,0,0″ Style=”{StaticResource PhoneTextTitle1Style}”/>

</StackPanel>

 

3. Add a Textblock named myblock to the given page . And bind the text property of the Textblock with mytext which is the property of the Sample class which will be explained further.

 



 

Add the code given below to the Grid named ContentPanel given on the page

Code:

<TextBlock x:Name=”myblock” HorizontalAlignment=”Left” Margin=”63,80,0,0″ TextWrapping=”Wrap” Text=”{Binding mytext}” VerticalAlignment=”Top” Height=”57″ Width=”330″ FontSize=”28″/>

 

4. Open the Page MainPage.xaml.cs and Create a Public class having the name Sampleclass with a single property mytext.

 


 

Code:

public class Sampleclass

{

public string mytext { get; set; }

}

 

5. Add the function given below to the MainPage.xaml.cs .

 

Code:

public void initialize()

{

Sampleclass obj = new
Sampleclass();

obj.mytext = “One way data binding”;

myblock.DataContext = obj;

}

 

In the first line of the function we are creating a object of Sampleclass called obj. In the second line we are setting the mytext property of the object to “One way data binding”.

In the third line we set the source of the myblock by setting up its Datacontext property to obj.

 

6. We then call this function in the constructor of the MainPage.

 


 

7. Now when we run the application we will see that the Content of myblock will be “One way data binding” as shown below.

 


 

8. I hope this post will be helpful to you.Download the project zip file from the link given below.

 

Download full project

How to change the App name and Tile name of your Windows phone app

1. After opening your project you can go to the Solution explorer window given on the right hand side as shown below.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

2.  Choose the properties option in the list given in the solution explorer.


 

 

 

 

 

 

 

 

 

 

 

 

3. Then under the properties menu click on WMAppManifest.xml.

4. The following window will appear before you.

Note: The window displayed will be different for different versions of Visual Studio. The one displayed below is for Visual Studio 2012


 

5. Now you can see the Display Name option. It is the name of your windows phone app by which it will be known in the windows phone market. You can change it accordingly. By default the name of the project is the name of the app.


6. By using Tile Title option you can change the title of your application tile that will be pinned to start screen.


 

7.  I hope this post will be helpful to you.

How to create your first Windows Phone app

Getting started with app development is the toughest part. There are chances that you may not find the right resources or end up getting struck on the most basic things. Sometimes tutorials don’t cover what they feel is obvious. We will be assuming in each of our articles that this topic is completely new for you. That way experienced developers could skip some steps while beginners won’t miss out the basics.

1. First of all create a new blank project and name it myfirstapp.

 

 

2. Then the following screen appears before you.

 


 

3. Then change the name of the application from my application to myfirstapp and page name to first page in Xaml code as shown below.

 


 

4. Then drag a Button control and Textblock control from the toolbox given on left hand side.

 


 

5. After that the following screen appears before you.

 


 

6. Now give a name to the Textblock that is myblock in xaml window.

 


 

Code:

<Grid x:Name=”ContentPanel” Grid.Row=”1″ Margin=”12,0,12,0″>

<TextBlock x:Name=”myblock” HorizontalAlignment=”Left” Margin=”111,56,0,0″ TextWrapping=”Wrap” Text=”TextBlock” VerticalAlignment=”Top” Height=”48″ Width=”230″/>

<Button Content=”Button” HorizontalAlignment=”Left” Margin=”127,367,0,0″ VerticalAlignment=”Top” Width=”201″/>

</Grid>

 

7. Now double click on the button you created. The following screen will appear before you.

 


 

8. Add the following code in the Button_Click_1 event handler function.

 

Code:

myblock.Text = “Hello world”;

 

9. Now the page will have the following view.

 


 

10. Now click on the Emulator option given in the header menu.

 


 

11. If the emulator is not starting you can choose any other option from the list.

 


 

12. After the emulator has started and you can click on the button in your app.

 

11

 

13. You will see that the text of textblock has changed to Hello world.

 

12

 

14. You have successfully created your first application. You can get the project zip from the link below.

 

Download full project