Articles → LIGHT SWITCH 2011 → Adding Silverlight Control In Lightswitch 2011
Adding Silverlight Control In Lightswitch 2011
Software Requirement
- Visual studio 2010 is installed on your machine.
- Visual Studio 2010 service pack 1 is installed on your machine.
- Microsoft Visual Studio Lightswitch 2011 is installed on your machine.
Prerequisite Knowledge
- What is Lightswitch?
- How to create buttons and how to write the button’s execute events?
- Basic programming in Silverlight.
- How to create the Lightswitch screens?
- How to create the Lightswitch tables?
Why Do We Need Custom Controls In Lightswitch?
Table Creation
Click to Enlarge
Login Screen
Click to Enlarge
Add Silverlight Library Project Type
- Right-click on the solution and click on "Add – New Project.."
- Select the "Silverlight Class Library" as project type.
- Enter "MyControl" in the Name field.
- Click on the "Ok" button.
- A pop-up message prompts up to select the Silverlight version
Click to Enlarge
- Select the Silverlight Version as Silverlight 4.
- Click "Ok".
Click to Enlarge
Add A Password Control
Click to Enlarge
<UserControl x:Class="MyControl.PasswordControl"
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="40" d:DesignWidth="210"><Grid x:Name="LayoutRoot" Background="White"><PasswordBox x:Name="PasswordCtrl" Width="200" Height="30"></PasswordBox></Grid></UserControl>
Add Binding To Password Control
<PasswordBox x:Name="PasswordCtrl" x:FieldModifier="public" Width="200" Height="30"
Password="{Binding Path=Screen.LoginInformationProperty.LoginPassword,Mode=TwoWay}"></PasswordBox>
Add A Custom Control In Lightswitch Screen
Click to Enlarge
Click to Enlarge
Click to Enlarge
Save Value In Database
Click to Enlarge
Output
Click to Enlarge