Saturday 19 November 2011

WCF With Silverlight

Here is an example of WCF services with Silverlight performing some mathematical operations like addition, substraction, etc.

Lets begin :)

1) Open Visual Studio -> Click New Project -> Select Silverlight from Project Type and then Specify Name and Location from New Project Window.

2) In New Silverlight Application, Select Asp.Net Web Application Project As New Web Project Type -> Ok.

3) Open Expression Blend for designing UI of application, it is easy to create user interface in blend.

//MainPage.xaml



<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"  x:Class="SLMathsDummy.MainPage"
    d:DesignWidth="600" d:DesignHeight="500">
    
<Grid x:Name="LayoutRoot" Background="#FFF8D1D1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.373*"/>
            <ColumnDefinition Width="0.28*"/>
            <ColumnDefinition Width="0.347*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="0.144*"/>
            <RowDefinition Height="0.08*"/>
            <RowDefinition Height="0.08*"/>
            <RowDefinition Height="0.128*"/>
            <RowDefinition Height="0.08*"/>
            <RowDefinition Height="0.16*"/>
            <RowDefinition Height="0.328*"/>
        </Grid.RowDefinitions>

        <Button x:Name="btnAddition" HorizontalAlignment="Right" Margin="0,0,96,58" Width="75" Grid.Row="5" Content="Addition" FontWeight="Bold" VerticalAlignment="Bottom" Grid.Column="1">
            <Button.Foreground>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FFF00B0B" Offset="1"/>
                </LinearGradientBrush>
            </Button.Foreground>
        </Button>
       

<Button x:Name="btnSubstract" Margin="96,0,0,0" Grid.Column="1" Grid.Row="5" Content="Substract" FontWeight="Bold" VerticalAlignment="Top" Width="75" HorizontalAlignment="Left" d:LayoutOverrides="Width">
            <Button.Foreground>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FFF00B0B" Offset="1"/>
                </LinearGradientBrush>
            </Button.Foreground>
        </Button>
        
<Button x:Name="btnMultiply" Margin="0,0,93,2" Grid.Column="1" Grid.Row="5" Content="Multiply" FontWeight="Bold" VerticalAlignment="Bottom" Width="75" HorizontalAlignment="Right" d:LayoutOverrides="Width">
            <Button.Foreground>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FFF00B0B" Offset="1"/>
                </LinearGradientBrush>
            </Button.Foreground>
        </Button>
        
<Button x:Name="btnDivide" HorizontalAlignment="Left" Width="75" Grid.Column="1" Grid.Row="5" Content="Divide" FontWeight="Bold" VerticalAlignment="Bottom" Margin="93,0,0,0">
            <Button.Foreground>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FFF00B0B" Offset="1"/>
                </LinearGradientBrush>
            </Button.Foreground>
        </Button>
        
<TextBlock x:Name="txbFNumber" HorizontalAlignment="Right" Margin="0,8,4,16" Grid.Row="1" Text="First No :" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FFF80D0D"/>
       
<TextBlock x:Name="txbSNumber" HorizontalAlignment="Right" Margin="0,8,4,16" Grid.Row="2" Text="Second No :" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FFF21111"/>
      
<TextBlock x:Name="txbResult" HorizontalAlignment="Right" Margin="0,8,8,16" Grid.Row="4" Text="Result :" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FFFA0D0D" FontWeight="Bold"/>
       
<TextBlock x:Name="txbResultSet" HorizontalAlignment="Left" Margin="0,8,4,16" Grid.Column="1" Grid.Row="4" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FF102EEE" FontWeight="Bold"/>
        
<TextBox x:Name="txtFNo" Margin="8,8,0,8" Grid.Column="1" Grid.Row="1" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FF102EEE" Width="300"/>
       
<TextBox x:Name="txtSNo" Margin="8,8,0,8" Grid.Column="1" Grid.Row="2" TextWrapping="Wrap" d:LayoutOverrides="Height" Foreground="#FF102EEE" Width="300"/>
   
</Grid>
</UserControl>

Note : Don't worry for namespace that are in <UserControl>, they will appear automatically when you drag controls in design interface.

4) Click on Add -> New Item -> Select Silverlight-enabled WCF service. Default its name is Service1.svc.





5) //Service1.svc.cs

Replace existing Operation Contract DoWork() by following codes.

 [OperationContract]
        public int Addition(int num1, int num2)
        {
            return num1+num2;
        }

        [OperationContract]
        public int Substract(int num1, int num2)
        {
            return num1-num2;
        }

        [OperationContract]
        public int Multiply(int num1, int num2)
        {
            return num1*num2;
        }

        [OperationContract]
        public int Divide(int num1, int num2)
        {
            return num1/num2;
        }

 6) Add Service Reference



7) //MainPage.xaml.cs

private void btnAddition_Click(object sender, RoutedEventArgs e)
{
            int num1, num2;
            ServiceReference1.SLWCFAddServiceClient addService = new  ServiceReference1.SLWCFAddServiceClient();
            addService.AdditionCompleted += new EventHandler<SLWCFAdd.ServiceReference1.AdditionCompletedEventArgs>(addService_AdditionCompleted);
            num1 = Convert.ToInt32(txtFNo.Text.ToString());
            num2 = Convert.ToInt32(txtSNo.Text.ToString());
            addService.AdditionAsync(num1, num2); 
}


public void addService_AdditionCompleted(object s, ServiceReference1.AdditionCompletedEventArgs e)
        {
            txbResultSet.Text = e.Result.ToString();
        }

       
private void btnSubstract_Click(object sender, RoutedEventArgs e)
        {
            int num1, num2;
            ServiceReference1.SLWCFAddServiceClient subService = new SLWCFAdd.ServiceReference1.SLWCFAddServiceClient();
            subService.SubstractCompleted +=new EventHandler<SLWCFAdd.ServiceReference1.SubstractCompletedEventArgs>(subService_SubstractCompleted);
            num1 = Convert.ToInt32(txtFNo.Text.ToString());
            num2 = Convert.ToInt32(txtSNo.Text.ToString());
            subService.SubstractAsync(num1, num2);
        }

       
public void subService_SubstractCompleted(object s, ServiceReference1.SubstractCompletedEventArgs e)
        {
            txbResultSet.Text = e.Result.ToString();
        }

       
private void btnMultiply_Click(object sender, RoutedEventArgs e)
        {
            int num1, num2;
            ServiceReference1.SLWCFAddServiceClient multiService = new SLWCFAdd.ServiceReference1.SLWCFAddServiceClient();
            multiService.MultiplyCompleted += new EventHandler<SLWCFAdd.ServiceReference1.MultiplyCompletedEventArgs>(multiService_MultiplyCompleted);
            num1 = Convert.ToInt32(txtFNo.Text.ToString());
            num2 = Convert.ToInt32(txtSNo.Text.ToString());
            multiService.MultiplyAsync(num1, num2);
        }

 public void multiService_MultiplyCompleted(object s, ServiceReference1.MultiplyCompletedEventArgs e)
        {
            txbResultSet.Text = e.Result.ToString();
        }

private void btnDivide_Click(object sender, RoutedEventArgs e)
        {
            int num1, num2;
            ServiceReference1.SLWCFAddServiceClient divService = new SLWCFAdd.ServiceReference1.SLWCFAddServiceClient();
            divService.DivideCompleted += new EventHandler<SLWCFAdd.ServiceReference1.DivideCompletedEventArgs>(divService_DivideCompleted);
            num1 = Convert.ToInt32(txtFNo.Text.ToString());
            num2 = Convert.ToInt32(txtSNo.Text.ToString());
            divService.DivideAsync(num1, num2);
        }

public void divService_DivideCompleted(object s, ServiceReference1.DivideCompletedEventArgs e)
        {
            txbResultSet.Text = e.Result.ToString();
        }


8) Run the application.





No comments:

Post a Comment