How to create Silverlight applications
In this tutorial we will show you how to create a Silverlight application from a
sample Microsoft database AdventureWorks using Xomega.Net for Visual Studio and
open source Xomega Framework.
With just several simple steps we will generate a powerful search form that allows
searching records in a given table by any criteria using various operators. We will
also generate a details form that allows viewing, editing and deleting selected
records as well as creating new records.
Before running this tutorial please make sure that you have the AdventureWorks database
set up and the Xomega.Net for Visual Studio 2010 or 2008 installed with a valid
license. You also need to verify that you have
Silverlight 3.0 SDK installed if you are planning to target .Net Framework
3.5 (or if you have VS2008) and
Silverlight 4.0 SDK (included in
VS2010 Service Pack 1) if you target .Net Framework 4.0.
1. Create a new solution for an Xomega Silverlight
To do that you need to add a new project in Visual Studio, expand the Xomega templates
and pick the Xomega Silverlight Solution template. You can target .NET framework
4, which will use Silverlight 4 or .NET framework 3.5, which will use Silverlight 3.
Specify the name for the solution, which should not contain spaces or any other
illegal characters to make things go smoother. In our tutorial we will just use
the default name MyProject1.
Click OK to create a solution. You will have five projects in the solution as follows.
Build the model project and make sure there are no errors. Reload all the corresponding
projects as prompted. Next build the entire solution and make sure that there are
2. Import model from the database.
Select the generator for importing the model from a database in the model project
(Generators > Model Enhancements > Import from Database) and open the properties
for this generator (hit F4 or Enter). Open the database connection configuration
dialog for the Database Connection parameter and click the Configure button.
Select SQL Native Client in the Provider tab and click Next. Specify the connection
information for the AdventureWorks sample database, test the connection, and click
OK if the test was successful.
Click Next on the Database Connection Configuration dialog to review a list of tables
and possibly exclude some of the tables from the model. We will import all tables
in this tutorial, so you'll need to just click Next again, review the connection
summary and click Finish, which will save this connection as a default for the model
Now you can run the generator by selecting the Generate option from the context
The files with the object definitions based on each database table will be added
to the model project under the Import folder.
Note: you can also watch
our video tutorial on how to import from database and further enrich the
3. Generate CRUD operations.
In this step you need to pick the object, for which you want to create the standard
Create/Read/Update/Delete (CRUD) operations as well as a Read List operation to
read a list of objects based on a number of criteria. In this tutorial we will use
the Error Log object, for which we will generate the presentation and the service
layers. Generate the model CRUD operations for the error log object by selecting
the corresponding menu option from the context menu.
Make sure that the error_log.xom now contains operations as part of the object definition.
Note: you can also watch
our video tutorial on how to define and customize the service layer.
4. Build the model.
In this step you need to build the model project to run all model generators that
are included in the model build (i.e. the Include in Build parameter is set to true).
Wait till the build finishes and reload all the projects as prompted.
Generate the classes for the entity data model by selecting the EntityModel.edmx
file and running the custom tool on it.
Make sure that the EntityModel.Designer.cs appears under the EntityModel.edmx file.
5. Generate service implementations.
The service structures and interfaces for the error log operations should be generated
whenever the model project is built as they are regenerable. Xomega also provides
a generator to create the initial implementation for those interfaces that uses
LINQ over the entity model and Xomega Framework base classes. This generator is
not supposed to be a rerunnable after you start making manual edits and therefore
it is not included in the build by default.
Generate the initial service implementation for the error log operations by selecting
the corresponding option from the context menu for the error_log.xom file.
The error log service implementation class should be added to the Entities project.
6. Add Silverlight service references.
One Silverlight idiosyncrasy is that it only allows asynchronous WCF communication
and therefore can use only asynchronous WCF services, which are not generated by
Xomega directly. Therefore, there is an extra step of adding a service reference
for Silverlight applications. Right-click on the References node of the Silverlight
project and select the Add Service Reference context menu.
In the dialog that comes up you can click the Discover button to display the services
defined in the solution. Pick the ErrorLogService and set the namespace to be the
name of the service appended with the Ref suffix. It is important to follow this
naming convention, since the generators use it to be able to invoke the services.
Click OK and make sure that the service reference has been added to the project.
If you have VS2008 and get an error at this point, you may need to delete the service
reference, restart the Visual Studio and repeat this step.
Note: You will have to update each service reference through a context menu whenever
you change any model operations or structures, which affect the service layer.
7. Generate search and details pages.
Right click on the error_log.xom file and run the generators for the Silverlight
search page and the Silverlight details page.
Select the Silverlight project in the solution explorer and click the Show All Files
button. You should now see a Gen folder that contains the details form and the search
form based on the Read List operation. Include these files in the project.
Note: before you start manually editing these forms you will want to rename these
files and classes and move them to the appropriate location to prevent Xomega generators
from cleaning them up accidentally.
8. Start the application.
Edit the MainPage.xaml file of the Silverlight project to make the source URI point
to the search form XAML file.
Make sure that the Silverlight.Web project is set to be the startup project for
the solution. Make the TestPage of that project to be the start page by selecting
the corresponding context menu.
Build the solution and start the application. You should see the error log search
page come up.
You can run the search using a number of criteria and operators. If you have records
in the database table, you will be able to see them in the results grid and view
the details by clicking the Details button. If you don't have any records yet, you
can create new ones by clicking the New button in the search form.
The required fields will be highlighted in bold. The form will also display any
validation errors and will prompt for unsaved changes if you try to close it without
saving. After you save the form, the updated data will be displayed in the results
grid of the search form.