How to Localize a Silverlight Client Screen:Part 2

Localizing a Silverlight client screen - Part 2

In my previous article (http://www.c-sharpcorner.com/UploadFile/18ddf7/localizing-a-lightswitch-application-using-lightswitch-par/) I described how to create the LightSwitch HTML Application using Visual Studio 2012.

In this article I describe how to localize the Silverlight client screen.

Procedure for localizing the client screen

Step 1

Open the Screen Designer of DesktopClient (CreateNewEmployee).

prop0.jpg

Step 2

In the Screen Designer, choose "Rows Layout" | "New Employee" node.

Step 3

Open the Property Window for the "Rows Layout" | "New Employee" node. 

prop0.5.jpg

Step 4

In the Properties window, choose the Display Name property, and then enter "$(NewEmployee)".

The "$()" notation signifies that the value for the Display Name property is a resource identifier. At run time, LightSwitch will retrieve the actual value from a resource file.

prop1.jpg

Step 5

Now the screen designer will look as shown in the following:

prop3.jpg

Step 6

In the Screen Designer, choose the "Name" node.

Step 7

Open the Property Window for the Name.

disname.jpg

Step 8

In the Properties window, choose the "Display Name" property, and then enter "$(EmployeeName)".

prop4.jpg

Step 9

Now the screen designer will look as shown in the following:

prop5.jpg

Step 10

In the Screen Designer, choose the "Email" node.

Step 11

Open the Property Window for the Email.

dftemaipropl.jpg

Step 12

In the Properties window, choose the "Display Name" property, and then enter "$(EmployeeEmail)".

renameemailprop.jpg

Step 13

Now the screen designer will look like this as shown in the following:

scrdesemail.jpg

Step 14

In the Screen Designer, choose the "PhoneNo" node. 

Step 15

Open the Property Window for the PhoneNo.

defaultphnoprop.jpg

Step 16

In the Properties window, choose the Display Name property, and then enter "$(EmployeePhoneNo)".

renamephnoprop.jpg

Step 17

Now the screen designer will look like this as shown in the following:

srcdesphno.jpg

Step 18

In the Screen Designer, choose the "Jobprofile" node.

Step 19

Open the Property Window for the Jobprofile.

jobprofdftprop.jpg

Step 20

In the Properties window, choose the Display Name property, and then enter "$(EmployeeJobprofile)".

jobprofileprop.jpg

Step 21

Now the screen designer will look like as shown in the following:

srcdesjobpro.jpg

Step 22

In the Screen Designer, choose the "Experience" node.

Step 23

Open the Property Window for the Experience.

experienceprop.jpg

Step 24

In the Properties window, choose the Display Name property, and then enter "$(EmployeeExperience)".

empexperienceprop.jpg

Step 25

Now the screen designer will look like this as shown.

srcdesexper.jpg

Step 26

In the Screen Designer, choose the Text node.

text.jpg

Step 27

In the Screen Designer, open the shortcut menu for the Text node, and then choose "Edit Content".

editprofile.jpg

Step 28

In the Properties window, replace the existing text with "$(Text)".

$text.jpg

Step 29

Now the screen designer will look like as shown in the following:

srcdesigner$text.jpg

Step 30

As we run the application we will have:

Browse employee.jpg

Step 31

Click on the show employee list; we will see:

employeedata.jpg

Step 32

Enter the Value in the following fields:

output.jpg

Step 33

After inserting the data into the following fields, click on the save button and we get:

output1.jpg


Similar Articles