Metro App invoking WCF service , Simples WCF, Metro App Consuming WCF.

Metro App invoking WCF service

Hi All,

I created the very basic Metro App “Split application”. The post is can be segregated in two halves. The first one explains about the default coding which comes automatically when developer choose the template “SplitApplication” from visual Studio 2011, and second half talks about customization in data part of UI.

The first half of Story

 The default application creates data source in-memory and displays that. I consumed web service and created navigation page.

The Key learning’s are –

·         The source which is going to be binding either to dataGrid or ListView should be ObservabaleCollection

·         In GridView to make item clickable “IsItemClickEnabled” must be true.

·         Get ready to code async way.

Below is the diagram for default source code and application given –

The Flow of events for the sample split application is  ->

·         App.Xaml.cs loads the Items.xaml .

·         The item.xaml is bind to SourceData, which provides the ObservableCollection of Data.

·         GridView and ListView are in item.xaml are bind to ObservableCollections of SampleData. [The controls in xaml are using resource which are defined in StandarStyle.xaml inside common folder. The standard250X250Itemtemplate defines title and subtitle by default, modification in these resource  will have effect in display of controls.]

·         The GridView in item.xaml has IsItemClicabk true and event receiver is attached to “ItemClick’ which navigates and load to SplitPage.

My Experiment with custom WCFService

The second half of Story

Create one WCF service, which reads data from xml file and returns it.

Two public methods – GetAllBooks() and GetBookByID()

Create one page – myItems.

Goto App.xaml  write - _rootFrame.Navigate(typeof(myItems));

Add reference to custom web service.

Goto myItems.xaml.

Open “OnNaviagte”;

Bind your collection which returns ObservableCollection of object. [This will make changes to UI hence it must be in different thread] so the code is like –

Protected override void OnNavigatedTo(NavigationEventArgs e)

{

This.DefaultViewModel[“Items”] = e.Parameter;

BookStoreService.Service1Client  svr = new BookStoreService.Service1Client();

Svr.OpenAsync();

System.Threaading.Tasks.Task> result = svr.GetAllBookAsync();

Dispatcher.Invoke(Windows.UI.Core.CoreDispatcherPriority.Normal,(obj,invokeArgs) =>

{

itemGridView.ItemsSource = result.Result;

},this.null);

}

Go to Item_Click event. { this.Frame.Navigate(typeof(mySplitPage),e.Clickedtem));

From this code you got it J Add another page of type split and name it to myitemDetail.

 Do F5..You are done. !!