Telerik RadExpander in SilverLight 5


Introduction

 

Today, In this article let's play around with another interesting concept of Telerik RadControls.

 

Question:  What is RadExpander?

 

In simple terms "It is a light-weight control which wraps up the user content acting as a placeholder. It enables navigation when required".

 

I think we are now good to go and implement this wonderful concept.

 

Step 1: The complete code of IService1.cs looks like this:
 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Runtime.Serialization;

using System.ServiceModel;

using System.ServiceModel.Web;

using System.Text;

namespace WcfRadControls

{// NOTE: You can use the "Rename" command on the "Refactor" menu to change the interface name "IService1" in both code and config file together.[ServiceContract]public interface IService1{[OperationContract]double add(double a, double b);[OperationContract]double sub(double a, double b);[OperationContract]double mul(double a, double b);[OperationContract]double div(double a, double b);}

}


Step 2: The complete code of Service1.svc.cs looks like this:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Runtime.Serialization;

using System.ServiceModel;

using System.ServiceModel.Web;

using System.Text;

namespace WcfRadControls

{// NOTE: You can use the "Rename" command on the "Refactor" menu to change the class name "Service1" in code, svc and config file together.public class Service1 : IService1{public double add(double a, double b){return a + b;}public double sub(double a, double b){return a - b;}public double mul(double a, double b){return a * b;}public double div(double a, double b){return a / b;}   }

}

 

Step 3: The complete code of Web.Config looks like this:
 

<?xml version="1.0"?>

<configuration>

<system.web>

<compilation debug="true" targetFramework="4.0" />

</system.web>

<system.serviceModel>

<behaviors>

<serviceBehaviors>

<behavior>

<!-- To avoid disclosing metadata information, set the value below to false and remove the metadata endpoint above before deployment -->

<serviceMetadata httpGetEnabled="true"/>

<!-- To receive exception details in faults for debugging purposes, set the value below to true.  Set to false before deployment to avoid disclosing exception information -->

<serviceDebug includeExceptionDetailInFaults="false"/>

</behavior>

</serviceBehaviors>

</behaviors>

<serviceHostingEnvironment multipleSiteBindingsEnabled="true" />

</system.serviceModel>

<system.webServer>

<modules runAllManagedModulesForAllRequests="true"/>

</system.webServer>

</configuration>
 

Step 4: The complete code of ClientAccessPolicy.xml looks like this:
 

<?xml version="1.0" encoding="utf-8"?>

<access-policy>

<cross-domain-access>

<policy>

<allow-from http-request-headers="SOAPAction">

<domain uri="*"/>

</allow-from>

<grant-to>

<resource path="/" include-subpaths="true"/>

</grant-to>

</policy>

</cross-domain-access>

</access-policy>
 

Step 5: The complete code of MainPage.xaml looks like this:


<
UserControl x:Class="RadControlsApp.MainPage"

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"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">

 <Grid x:Name="LayoutRoot"Width="500"Height="450"Background="LightCyan">

 <TextBlock Grid.Row="1"Height="23"HorizontalAlignment="Left"Margin="72,61,0,0"Name="textBlock1"
   FontFamily="Verdana"FontSize="15"Text="Please Enter First Number: "VerticalAlignment="Top"Width="214" />

<TextBox Grid.Row="1"Height="23"HorizontalAlignment="Left"Margin="320,60,0,0"
   Name
="textBox1"VerticalAlignment="Top"Width="120" />

 <TextBlock Grid.Row="1"Height="23"HorizontalAlignment="Left"Margin="58,121,0,0"FontFamily="Verdana"FontSize="15"
   Name
="textBlock2"Text="Please Enter Second Number: "VerticalAlignment="Top"Width="228" />

 <TextBox Grid.Row="1"Height="23"HorizontalAlignment="Left"Margin="320,120,0,0"
    Name
="textBox2"VerticalAlignment="Top"Width="120" />

<telerik:RadExpander HorizontalAlignment="Center"ExpandDirection="Down"Header="Arthmetic Operations"FontFamily="Verdana"FontSize="15" Margin="92,192,74,23" Width="334" Grid.RowSpan="2">

            <StackPanel Orientation="Vertical" Background="LightGoldenrodYellow">

                <TextBlock Name="textBlockAdd"FontFamily="Verdana"FontSize="12"Margin="5" />

                <TextBlock Name="textBlockSub"FontFamily="Verdana"FontSize="12"Margin="6" />

                <TextBlock Name="textBlockMul"FontFamily="Verdana"FontSize="12"Margin="7" />

                <TextBlock Name="textBlockDiv"FontFamily="Verdana"FontSize="12"Margin="8" />

            </StackPanel>

        </telerik:RadExpander>

        <Button Content="Arthmetic Operation"FontFamily="Verdana"FontSize="12"Background="DeepSkyBlue"Height="23" HorizontalAlignment="Left" Margin="320,163,0,0" Name="button1" VerticalAlignment="Top" Width="133" Click="button1_Click"/>

    </Grid>

</UserControl> 


Step 6: The complete code of MainPage.xaml.cs looks like this:
 

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

using RadControlsApp.ServiceReference1;

using Telerik.Windows.Controls;

namespace RadControlsApp

{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }
        private void add_Call(object sender, addCompletedEventArgs e)

        {

            textBlockAdd.Text = "Addition Result is: " + e.Result.ToString();

        }
        private void sub_Call(object sender, subCompletedEventArgs e)

        {

            textBlockSub.Text = "Subtraction Result is: " + e.Result.ToString();

        }
        private void mul_Call(object sender, mulCompletedEventArgs e)

        {

            textBlockMul.Text = "Multiplication Result is: " + e.Result.ToString();

        }
        private void div_Call(object sender, divCompletedEventArgs e)

        {

            textBlockDiv.Text = "Division Result is: " + e.Result.ToString();

        }
        private void button1_Click(object sender, RoutedEventArgs e)

        {

            if (string.IsNullOrEmpty(textBox1.Text) || string.IsNullOrEmpty(textBox2.Text))

            {

                textBlockAdd.Text = "";

                textBlockSub.Text = "";

                textBlockMul.Text = "";

                textBlockDiv.Text = "";

                RadWindow.Alert("Please Enter Some Values");

            }

            else

            {

                objClient.addCompleted += new EventHandler<addCompletedEventArgs>(add_Call);

                objClient.addAsync(Convert.ToDouble(textBox1.Text), Convert.ToDouble(textBox2.Text));

                objClient.subCompleted += new EventHandler<subCompletedEventArgs>(sub_Call);

                objClient.subAsync(Convert.ToDouble(textBox1.Text), Convert.ToDouble(textBox2.Text));

                objClient.mulCompleted += new EventHandler<mulCompletedEventArgs>(mul_Call);

                objClient.mulAsync(Convert.ToDouble(textBox1.Text), Convert.ToDouble(textBox2.Text));

                objClient.divCompleted += new EventHandler<divCompletedEventArgs>(div_Call);

                objClient.divAsync(Convert.ToDouble(textBox1.Text), Convert.ToDouble(textBox2.Text));

                textBox1.Text = "";

                textBox2.Text = "";

            }

        }

         #region Instance Variables

        Service1Client objClient = new Service1Client();

        #endregion

    }

}
 

Step 7: The output of the application looks like this:


Output1.png

Step 8: The output of the arthmetic operation application looks like this:

Output2.png


Output3.png

 I hope this article is useful for you ...I look forward for your comments and feedback....Thanks Vijay Prativadi

Next Recommended Readings
MVC Corporation
MVC Corporation is consulting and IT services based company.