How to Create a Web Application in Silverlight Using F#

Introduction

Today I am discussing that how you can create a simple web application in Silverlight using F#. We are creating a web application in F# but we also need to add a C# silverlight application for this. We need a F# silverlight library template, a C# silverlight application template and a little bit of code. Just follow the steps given below.

Step 1: Firstly open a new project in F# using Visual Studio 2010. Slecct F# silverlight library template and give name to it like below image.

Step 2: Select Silverlight Version 4 from the add Silverlight Class Library window like below image.

Step 3: Now Write below code in Module1.fs File.

namespace MyFSharp
 
type FirstApp() =
    static member FilterOutZs (strs:seq<string>) =
        seq { for s in strs do
                if not(s.StartsWith("Z")) then
                    yield s }

Step 4: Now right click on Solution in solution Explorer and click on add new Project. Select C# Silverlight application project like below Image.

Step 5: Now uncheck the checkbox in New Silverlight application dialog box and select Silverlight Version 4 and press Ok like below image.

Step 6: When you will add C# Silverlight Application your Solution Explorer will look like below image.

Step 7: Now Click on MainPage.xaml and write below code.

<UserControl x:Class="SilverlightApplication1.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"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
 
    <Grid x:Name="LayoutRoot" Background="White">
        <TextBlock x:Name="TextBl" MouseEnter="TheText_MouseEnter"/>
    </Grid>
</UserControl>

Step 8: Now right click on Mainpage.xaml file and select view code your MainPage.xaml.cs file will open.

Step 9: Now write below code in MainPage.xaml.cs

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;
 
namespace SilverlightApplication1
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }
        private void TheText_MouseEnter(object sender, MouseEventArgs e)
        {
            this.TextBl.Text =
                string.Join(" ", MyFSharp.FirstApp.FilterOutZs(
                    new[] { "ZZZ", "Silverlight", "ZZZ", "Application", " In F#", "ZZZ" }).ToArray());
        }
    }
}

Step 10: Now right click on C# silverlight application in Solution Explorer and click on add Reference. Select Project tab and select Your F# project name which will appear under Project tab and press ok like below Image.

Step 11: Right click on C# silverlight application in Solution Explorer. Select "set as start page' and press F5 to run the application.

Output

Summary

In this article I have discussed that how you can create a simple web application in silverlight using F#.