Search
 Search
GET THE HOTEST NEWS ABOUT VISUAL WEBGUI.
CREATE LINE OF BUSINESS SILVERLIGHT APPLICATIONS IN NO TIME.
EVERY THING YOU NEED TO START DEVELOPING WITH VISUAL WEBGUI.
SEE VISUAL WEBGUI SHOW CASES FROM AROUND THE WORLD.
ALL THE RESOURCES YOU NEED TO START BUILDING VISUAL WEBGUI APPLICATIONS TODAY.
SHARE AND FIND VISUAL WEBGUI RESOURCES.
TALK WITH OTHER VISUAL WEBGUI DEVELOPERS.
 
Quick Starts

Current Articles | Categories | Search | Syndication

How to create a Visual WebGui Silverlight application  

Published on:  Monday, July 14, 2008
By:  Eyal.Albert
User Rating:  
Categories:   Silverlight

Users have accessed this article 1221 times.

How to create a Visual WebGui Silverlight application

In this “How to” we are going to learn how to create a Visual WebGui Silverlight Application.

This topic assumes that you have some basic knowledge of Visual WebGui and what is Visual WebGui over Silverlight.

After installing Visual WebGui we will open Visual Studio and create a new Visual WebGui Silverlight application.

image

We’ll open the Main form “Form1.cs” in designer mode. 

image

Now we’ll add a few Visual WebGui controls to display the richness of a Visual WebGui Silverlight application.

First we’ll add a TextBox. As you can see Visual WebGui design time mimics .Net Windows forms design time abilities.

image  image

Lets add a few more controls to our application. 

image

Next we’ll build the application to allow the VWG Silverlight packaging tool to build the application Silverlight packages. you will be prompted to set the solution that this project is related to.

image image

After selecting the solution you will see the Visual WebGui Silverlight Packaging tool that will allow you to modify the package structure of your application.
We can see the primary package (the orange folder) that will be download to the client at the initial connection and holds the base of the VWG Silverlight application. The rest of the minor packages will be download on a need to base according to user actions to save on communication.


image

Press ok and you can see the result of the packaging tool in the Web.Config file and the ClientBin folder.

<Themes Selected="Blend">

  <Theme Name="Default" Assembly="Gizmox.WebGUI.Themes.Vista" SilverlightAssembly="Gizmox.WebGUI.Silverlight.Themes.Default, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

  <Theme Name="Blend" Assembly="Gizmox.WebGUI.Themes.Vista" SilverlightAssembly="Gizmox.WebGUI.Silverlight.Themes.Blend, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

  <Theme Name="XP" Assembly="Gizmox.WebGUI.Themes.Vista" SilverlightAssembly="Gizmox.WebGUI.Silverlight.Themes.XP, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

</Themes>

<!--  WebGUI Silverlight Client Packages  -->

<SilverlightPackages primary="MyFirstApp">

  <SilverlightPackage name="MyFirstApp">

    <Assembly name="Gizmox.WebGUI.Silverlight.Common, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Gizmox.WebGUI.Silverlight.Controls, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Gizmox.WebGUI.Silverlight, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="System.Windows.Controls.Data, Version=2.0.5.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />

    <Assembly name="System.Windows.Controls.Extended, Version=2.0.5.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />

    <Assembly name="Gizmox.WebGUI.Silverlight.Themes.Default, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Gizmox.WebGUI.Silverlight.Themes.Blend, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Gizmox.WebGUI.Silverlight.Themes.XP, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

  </SilverlightPackage>

  <SilverlightPackage name="Gizmox.WebGUI.Silverlight.Controls.Extended">

    <Assembly name="Gizmox.WebGUI.Silverlight.Controls.Extended, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

  </SilverlightPackage>

  <SilverlightPackage name="Gizmox.WebGUI.Silverlight.Controls.Charts">

    <Assembly name="Gizmox.WebGUI.Silverlight.Controls.Charts, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Visifire.Charts, Version=1.0.11.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="Visifire.Commons, Version=1.0.11.0, Culture=neutral, PublicKeyToken=null" />

    <Assembly name="VisifireCharts, Version=1.0.11.0, Culture=neutral, PublicKeyToken=null" />

  </SilverlightPackage>

  <SilverlightPackage name="Gizmox.WebGUI.Silverlight.Controls.Office">

    <Assembly name="Gizmox.WebGUI.Silverlight.Controls.Office, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />

  </SilverlightPackage>

</SilverlightPackages>

image

The packaging tool from now will run is silent mode and will not be visible to you when you compile. Every change you make and new projects that you will add will be included into the project in the primary package. At this point we’ll not go into the process of configuring the package structure of a Visual WebGui Silverlight application we’ll have a full “How To” about that.  But if you need to change the structure you can run the tool manually from the programs in the start menu and select the project you need to edit.

image

Now we can run our Visual WebGui application but first let set the application entry point.
Right click on the project and select properties.

image

Go to the Web tab and set the start action to “Specific Page” and add you main form with the Visual WebGui silverlight extension “ swgx “.

image 

Now we can run our application Visual WebGui Silverlight application in explorer.

image

 And we can also view our application in FireFox

image

We can easily change the theme of our application by editing our web.config file. In the Theme section in the web.config file will change the select them from default to xp.

<Themes Selected="XP">

 

And refresh our application

 

 image

In this “How to” we’ve seen that Visual WebGui framework enables developers to create cross browser Silverlight applications while using visual studio .Net windows forms design time abilities.

We’ve also seen how easy it is to apply different themes in our Silverlight Visual WebGui application

-- Eyal Albert @ Eyal.Albert (at) Gizmox.com

Rating
Comments
By Victor @ Sunday, July 20, 2008 9:45 PM
Hi

The examples look very nice but don't work for me.

How do I add extra themes?

I followed the example and can only select the Default theme which is the only entry created in web.config

If I try adding the extra themes to the config file it gets overwritten when I compile

I added a reference to Vista theme but this did not help

Thanks

Victor

By Eyal.Albert @ Monday, July 21, 2008 1:40 AM
Hi,
Version 6.1.1 holds just the default theme and not as this example shows.
We plan to release another theme very soon.
If you want to change a theme you can create your own theme by adding a silverlight theme project to your solution and changing it to your need.
I will post another "how to" create your own theme later on this week.
Thanks,
Eyal Albert

By Eyal.Albert @ Monday, July 21, 2008 1:40 AM
Hi,
Version 6.1.1 holds just the default theme and not as this example shows.
We plan to release another theme very soon.
If you want to change a theme you can create your own theme by adding a silverlight theme project to your solution and changing it to your need.
I will post another "how to" create your own theme later on this week.
Thanks,
Eyal Albert

By Visual WebGui @ Thursday, July 31, 2008 2:14 AM
Comments from the following blog entry: How to embed HTML inside a Visual WebGui Silverlight application, located at: http://weblogs.asp.net/visualwebgui/archive/2008/07/31/how-to-embed-html-inside-a-visual-webgui-silverlight-application.aspx

By Visual WebGui @ Wednesday, August 06, 2008 1:54 AM
Comments from the following blog entry: How to create your own Visual WebGui Silverlight theme, located at: http://weblogs.asp.net/visualwebgui/archive/2008/08/06/how-to-create-your-own-visual-webgui-silverlight-theme.aspx

By Visual WebGui @ Tuesday, August 26, 2008 2:27 AM
Comments from the following blog entry: How to display dynamic images stored in a database in a Visual WebGui application, located at: http://weblogs.asp.net/visualwebgui/archive/2008/08/26/how-to-display-dynamic-images-stored-in-a-database-in-a-visual-webgui-application.aspx

By Visual WebGui @ Tuesday, August 26, 2008 2:31 AM
Comments from the following blog entry: How to use Visual WebGui client client invocation, located at: http://weblogs.asp.net/visualwebgui/archive/2008/08/26/how-to-use-visual-webgui-client-client-invocation.aspx

Click here to post a comment
Copyright © 2005-2008 Visual WebGui®   Terms Of Use  Privacy Statement
Visual WebGui is copyright 2005-2008 by Gizmox