Making an App Catalog with ListBox for Windows Phone 8

All apps should include an about page as a way to engage with your users. If you’re part of DVLUP this is a basic requirement of most challenges. The about page should describe your app, you the author & include your contact details in case your users want to provide any feedback. Also it can be used to showcase your other apps. I earlier wrote an tutorial on using app catalog using Telerik Controls.

Making an App Catalog with Telerik RadControl Data Bound ListBox for Windows Phone 8

As the controls are not free, you all may not have access to it. In this tip I am providing you the source code of the project without using Telerik Controls. You can refer the previous post for the steps.

AppCatalog

Making an App Catalog with Telerik RadControl Data Bound ListBox for Windows Phone 8

All apps should include an about page as a way to engage with your users. If you’re part of DVLUP this is a basic requirement of most challenges. The about page should describe your app, you the author & include your contact details in case your users want to provide any feedback. Also it can be used to showcase your other apps, I’m going to show you a fun way of doing this.

Step 1: Create a new Telerik Windows Phone 8 Project.

The wizard will automatically add the required references & create an about page for you.

Step 2: In the About.xaml add the following namespaces to your page

At the top of About.xaml add the following references.

 

Step 3: Add the following code to your XAML for the RadDataBoundListBox

I’ve left the RadDataBoundListBox properties pretty much standard, I did however add a tap event handler, which occurs whenever an item in the RadDataBoundListBox is tapped.

ItemAddedAnimation – Is the animation that occurs when an item is added to the RadDataBoundListBox.

PanAndZoomImage – Is a Telerik image control, it features a busy indicator which the standard image control doesn’t (I’ll cover this control later on).

RadBusyIndicator is a Telerik control that indicates that the app is busy doing ‘something’ (I’ll cover this control later on).

StackVirtualizationStrategyDefinition – Is the way items are visualized in the RadDataBoundListBox, in this case its orientation is set to horizontal.

Step 4: Declare our Lists to hold our information

We’re using Lists as they’re easier to work with than Arrays.

 

Step 5: Add to our List of Objects & set the ItemsSource for the RadDataBoundListBox

In the for loop we’re creating a new Catalog object & adding it to the list, finally we set the RadDataBoundListBox ItemsSource to the List of Objects.

Step 6: Add the code for the tap event handler

First we get the index of the selected item in the RadDataBoundListBox, we then create a new WebBrowserTask. We set the Uri of the WebBrowserTask to app link from the List of Objects. Finally we call the WebBrowserTask, which will open up the link to our app.

That’s about it, this can be done dynamically where you host the information online so your app catalog is kept current.

Download AppCatalog.zip