Simple WCF Service in Windows Store Apps

In this article we create a simple WCF service for Windows Store apps using C#.

Introduction

In this article we create a simple WCF service for Windows Store apps using C#. In Windows Store apps consumption of a WCF service is different from web applications and Windows applications because in Windows Store apps everything is asynchronous. So you need to make an async call to the service. When you add a reference Visual Studio automatically creates an async function for you. Before the async call the "await" keyword must be used.

If you notice we have used the await keyword before making a call to the service. Since the service is called using await, the function inside, that we are calling the service, must be async. On the click event of the button.

How to create a WCF Service for Windows Store Apps

Step 1

Open Visual Studio 2012 and create a new project. In the new project select WCF then "WCF Service Application" and the click on "OK".

Start-VS-2012-Windows-Store-Apps.jpg

Step 2

In "IService.cs" we declare the interface. If you want to change the name of interface then double-click on the interface name (IService.cs) then right-click then select "Refactor" -> "Rename".

Refactor-Windows-Store-Apps.jpg

Step 3

After changing the name of the interface in "IService.cs" replace all the code with the following code.

using System;

using System.Collections.Generic;

using System.Linq;

using System.Runtime.Serialization;

using System.ServiceModel;

using System.ServiceModel.Web;

using System.Text;

 

namespace ServiceApp

{
   [
ServiceContract]

    public interface ICalculation

    {

        [OperationContract]

        int Sum(int num1, int num2);

 

        [OperationContract]

        int Sub(int num1, int num2);

 

        [OperationContract]

        int Multi(int num1, int num2);

 

        [OperationContract]

        int Dive(int num1, int num2);

    }

}

Step 4

In "Service.cs" replace all the code with the following code. In "Services.cs" we declare the services class.

using System;

using System.Collections.Generic;

using System.Linq;

using System.Runtime.Serialization;

using System.ServiceModel;

using System.ServiceModel.Web;

using System.Text;

 

namespace ServiceApp

{

    public class Service1 : ICalculation

    {

        public int Sum(int num1, int num2)

        {

            return num1 + num2;

        } 

        public int Sub(int num1, int num2)

        {

            return num1 - num2;

        }

        public int Multi(int num1, int num2)

        {

            return num1 * num2;

        }

        public int Dive(int num1, int num2)

        {

            return num1 / num2;

        }

    }

}

Step 5

Now press F5 to run it and host it in the local server; the WCF service that was created. After running, the following output will be shown. Copy to the service URL.

Coply-URL-Windows-Store-Apps.jpg

Step 6

Now open VS2012 and create a new project and this time select "Windows Store" then "Blank app".

New-Windows-Store-Apps.jpg

Step 7

In this step add a service reference to the "Windows Store apps". To do that right-click on your project and select "Add Service Reference" and then paste your service URL and click on "Go". Then find the service and click on "OK".

Add-Servicess-Windows-Store-Apps.jpg

Step 8

In this step add the reference as in the following. Such as "ProjectName.ServicesReference1". My project name is "MyApp" so we add "MyApp.ServicesReference1".

using MyApp.ServiceReference1;

Step 9

After adding the reference go to "MainPage.xaml". The "MainPage.xaml" is as in the following code.

<Page

    x:Class="MyApp.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:MyApp"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d">

 

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" RenderTransformOrigin="0.498,0.389">

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="501*"/>

            <ColumnDefinition Width="0*"/>

            <ColumnDefinition Width="0*"/>

            <ColumnDefinition Width="865*"/>

        </Grid.ColumnDefinitions>

        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Enter First Number" VerticalAlignment="Top" FontSize="20" Grid.Column="3" Margin="10,139,0,0" Width="159" Height="48"/>

        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Enter Second Number" VerticalAlignment="Top" FontSize="20" Grid.Column="3" Margin="10,207,0,0" Width="126" Height="48"/>

        <TextBox HorizontalAlignment="Left" x:Name="Textbox1" TextWrapping="Wrap" Text="Enter First Number" VerticalAlignment="Top" Grid.Column="3" Margin="136,207,0,0" Width="204" Height="32"/>

        <TextBox HorizontalAlignment="Left" x:Name="Textbox2" TextWrapping="Wrap" Text="Enter Second Number" VerticalAlignment="Top" Grid.Column="3" Margin="136,139,0,0" Width="204" Height="32"/>

        <TextBox HorizontalAlignment="Left" x:Name="Textbox3" TextWrapping="Wrap" Text="Your Result" VerticalAlignment="Bottom" Grid.Column="3" Margin="136,-37,0,773" Width="204" Height="32" RenderTransformOrigin="0.529,1.521"/>

        <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="You Result" VerticalAlignment="Top" FontSize="20" Grid.Column="3" Margin="10,286,0,0" Height="24" Width="107"/>

        <Button Content="Sum" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="3" Margin="93,360,0,0" Height="38" Width="64" Click="Button_Click_2"/>

        <Button Content="Sub" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="2" Margin="10,360,0,0" Height="38" Width="60" Grid.ColumnSpan="2" Click="Button_Click_1"/>

        <Button Content="Multi" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="3" Margin="183,360,0,0" Height="38" Width="70" Click="Button_Click_3"/>

        <Button Content="Dive" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Column="3" Margin="276,360,0,0" Height="38" Width="64" Click="Button_Click_4"/>

    </Grid>

</Page>

Step 10

The "MainPage.xaml.cs" is as in the following code. In this code we add "async" to every button click event and "await" with every method call.

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using Windows.Foundation;

using Windows.Foundation.Collections;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Data;

using Windows.UI.Xaml.Input;

using Windows.UI.Xaml.Media;

using Windows.UI.Xaml.Navigation;

using MyApp.ServiceReference1;

 

namespace MyApp

{

    public sealed partial class MainPage : Page

    {

        public MainPage()

        {

            this.InitializeComponent();

        }


         CalculationClient Serv = new CalculationClient();

 

        protected override void OnNavigatedTo(NavigationEventArgs e)

        {

        } 

        private async void Button_Click_1(object sender, RoutedEventArgs e)

        {

            int result = await Serv.SumAsync(Int32.Parse(Textbox1.Text), Int32.Parse(Textbox2.Text));

            Textbox3.Text = result.ToString();

        } 

        private async void Button_Click_2(object sender, RoutedEventArgs e)

        {

            int result = await Serv.SubAsync(Int32.Parse(Textbox1.Text), Int32.Parse(Textbox2.Text));

            Textbox3.Text = result.ToString();

        } 

        private async void Button_Click_3(object sender, RoutedEventArgs e)

        {

            int result = await Serv.MultiAsync(Int32.Parse(Textbox1.Text), Int32.Parse(Textbox2.Text));

            Textbox3.Text = result.ToString();

        } 

        private async void Button_Click_4(object sender, RoutedEventArgs e)

        {

            int result = await Serv.DiveAsync(Int32.Parse(Textbox1.Text), Int32.Parse(Textbox2.Text));

            Textbox3.Text = result.ToString();

        }

    }

}

Step 11

Now run your project. The output will be as in the following.

Result-Windows-Store-Apps.jpg