Tips and Tricks for Getting the Most Out of Screens in Visual Studio LightSwitch
- Adding Labels and Descriptive Text
- Adding Static Images to a Screen
- Implementing a Home Screen
- Interacting with LightSwitch Controls at Runtime
- Summary
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
One of the biggest benefits of building applications with Visual Studio LightSwitch is that it generates the user interface for you, including labels, data-bound fields, commands, and controls. You can rearrange the positions of controls on the screen, and you can determine a number of properties for setting up the appropriate layout. If you're an experienced developer coming from a different development environment, you might need to set up additional requirements such as displaying text messages, implementing a home screen, or interacting with controls at runtime. This article shows a number of handy tips and tricks that you can use to create even more powerful and interesting screens.
Adding Labels and Descriptive Text
LightSwitch automatically adds label and text box controls to display data-bound information coming from the data source for both single entities and entity collections. This is a tremendous benefit because it saves the developer from having to select and add the appropriate controls. However, in LightSwitch every label or text box control is data-bound. Unlike in other development environments, such as Microsoft Access or Visual Studio 2010, you can't show a text message inside an unbound control.
For instance, you might want to show warning messages, advice, or welcome text in your controls. To accomplish this goal in LightSwitch, you use local properties, which are basically data items associated to the selected screen and representing a piece of information that isn't related to the bound data source. Think of a local property as a variable of a given type.
Let's try an example. Suppose you want to display a warning message inside a screen. Follow these steps:
- Open the screen designer for the screen and click Add Data Item. This action opens the Add Data Item dialog.
- Select the Local Property item.
- Specify the data type in the Type combo box (see Figure 1) and a name for the property. For this example, use a String type, enter WarningMessage as the property name, and then click OK. At this point, the new data item appears with the list of other data items and methods.
- Drag the property from the list of data items onto the designer's surface and release it under the Screen Command Bar element. Since the property will only be used to display some text, you can replace the default Text Box with a Label, as shown in Figure 2.
- Go to the Properties window, where you can fine-tune the appearance of your label.
- Change the value of the Label Position property from Left-aligned to None. This change ensures that the name of the label will not be shown.
- Change the value of the Font Style property from Normal to Warning. As Figure 3 shows, you can select from a number of font styles. When you select Warning, your text message will be displayed in red and boldfaced (assuming that you're using the default LightSwitch theme).
)
)
)
So far you've prepared a label to display text, but the dialog offers no way to assign text to the label at design time. The only way to perform this assignment is by writing code, so click the Write Code button in the upper-right corner of the screen designer. You can write the label assignment in a couple of different method hooks:
- Created. Write the assignment inside Created when your text is a message that doesn't take information from the screen's data source. This is exactly our case.
- InitializeDataWorkspace. If you need to display some text that's constructed with information coming from the screen's data source, write the assignment inside InitializeDataWorkspace.
Listing 1 shows how to perform the assignment. (In your code, replace ScreenName with the name of the screen you're creating.)
Listing 1—Assigning the content of an informative label.
Private Sub ScreenName_Created()
Me.WarningMessage = "Warning: the application is going to handle your information."
End Sub
This is nothing but a variable assignment. If you run the application, you'll see how the text message appears, as represented in Figure 4.
)
In this case the screen shows no data, but in a data-bound screen the data controls would appear under the warning message.