Microsoft Visual Studio LightSwitch has just been released as public beta and it claims to be the “SIMPLEST WAY TO BUILD BUSINESS APPLICATIONS FOR THE DESKTOP, WEB AND CLOUD”. That’s quite a bold statement and it certainly deserves a closer lock. And while we’re at it we will of course have a look at the use of Bing Maps in LightSwitch projects – both for desktop and web applications. Yes, that’s right! At the end of this you will see the Bing Maps Silverlight Control in a desktop application:
You will find the download of LightSwitch here. On MSDN you will also find a couple of “How Do I?” videos, tutorials and a great training kit. I will come back to this training kit a little bit later. If you already have Visual Studio 2010 installed, LightSwitch will snuggle into the existing environment, otherwise it will create a new installation of Visual Studio 2010.
The First Steps
Once you installed LightSwitch you will find a new template for VB.NET and C# development in your Visual Studio:
Let’s start our journey by creating a new project. I choose the Visual Basic template but you will find out shortly that it doesn’t really matter because you can do a lot of things without writing any code at all.
Once the project is created the designer prompts you to start off with a data source.
We can either create a new table which would then be stored in SQL Server Express or connect to an external database. Let’s go the whole way and create a table. In this table we will be storing address information. We can enter the name of the table in the header and then just add the columns we need:
For each of the columns we can set properties such as the
- data types
- requirement to enter data
- a display name that we will see in the UI
- the visibility in the UI
- the integration in a full text search that will automatically be available in the UI
- data validation rules
We can also populate “Choice Lists” with data that will be available throughout the application for use in ComboBoxes. Let’s use a “Choice List” for the column CountryRegion in the table above and also modify the property “Display Name“ as appropriate.
Once we’re happy with our table, we right-click in the “Solution Explorer” on “Screens” and select “Add Screen” from the context menu.
In the dialog that pops up we can select from various screen-types. We select for this example the “List and Details Screen” and our data set as screen data.
Once we click OK we will see the screen in the designer view:
We see that the display-names are picked up from the table design and that the wizard also automatically recognized fields with choice lists and created a ComboBox for us.
Let’s it F5 to see what we achieved so far and enter some data:
Notice the button at the top-right corner. While the application runs you can switch into the “Customization Mode” and make some changes. Yes, that’s right. To change the design of the screen you don’t even need to stop the application and you can look at all changes in a real-time preview of the screen in the top-right corner.
Isn’t that great? Without writing a single line of code we have created a database and a front-end to view, add, edit and delete data.