Binding Controls Using Designer in Windows Store Apps

}

Step 3

Click Build > Build Solution.

Step 4

Create the UI to show the bound data output; see:

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock x:Name="name" FontSize="30" Width="194" ></TextBlock>
<TextBlock x:Name="desig" FontSize="30" Width="194" ></TextBlock>
<TextBlock x:Name="sal" FontSize="30" Width="194"></TextBlock>
</StackPanel>
</Grid>

Step 5

To bind the property of the class file to the controls follow these steps.

Select the root Grid panel, which appears as [Grid] in the window.

With the Grid selected, click the New button next to the DataContext property in the Properties window.



In the Select Object dialog box, make sure that Show all assemblies is cleared, and then select EmployeeDetail under the projectName namespace, and then click OK.



Step 6

Select the TextBlock control, click the property marker to the right of the Text property under Common in the Properties window.



Click Create Data Binding from the open menu.



Select the desired property from the Path box you want to bind, and then click OK.



Step 7

Repeat Step 6 for the remaing textblocks in the UI element and select the desired property.

Step 8

Press F5 to start the app.

You will see that the values are bound to the controls.