Programming Silverlight with Dynamic Languages

Create a folder for your application.

In the application folder, create two folders named app and assets. Use the assets folder for bitmaps and additional XAML files.

Your application need not be limited to this simple folder structure. This is only a basic structure that Chiron.exe can use without specifying any special parameters. Your application program can access arbitrarily complex folder structures, and can contain any number of dynamic language code files.

In the app folder, create app.xaml. This file contains the root visual element for your application. A simple app.xaml file that is based on UserControl might look like this:

<UserControl
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   x:Class="System.Windows.Controls.UserControl"
   x:Name="Page" 
   >
   
   <TextBlock x:Name="TextBlock1" TextWrapping="Wrap" 
      Foreground="Black" Text="Click Me." />
</UserControl>

Basing the root visual element on UserControl is recommended. Use the View Source button at the beginning of this topic to see another example of app.xaml.

In the app folder, create a dynamic language source file that contains your application code. The following code shows a very simple application that responds to a mouse button event.

jsx

Import("System.Windows.*");
Import("System.Windows.Controls.*");

xaml = Application.Current.LoadRootVisual(new UserControl(), 'app.xaml')

xaml.TextBlock1.MouseLeftButtonUp += function (sender, args) {
    sender.FontSize *= 2
}

py

from System.Windows import Application
from System.Windows.Controls import UserControl

def OnClick (sender, args):
    sender.FontSize *= 2

scene = Application.Current.LoadRootVisual(UserControl(), 'app.xaml')
scene.TextBlock1.MouseLeftButtonUp += OnClick

rb

include System::Windows
include System::Windows::Controls

scene = Application.current.load_root_visual UserControl.new, 'app.xaml'

scene.find_name('TextBlock1').mouse_left_button_up do |sender, args|
   sender.font_size = sender.font_size * 2
end

The code calls the LoadRootVisual(DependencyObject, Uri) method to set the root visual object. An object of the correct type must be supplied. The DLR ensures that the correct method overload is used and provides the necessary code context.

Use the View Source button at the beginning of this topic to get the code for a more complex example that defines an App class.

In your application folder, create an HTML page to start your application. Use the View Source button to copy the Default.html file used by all three languages. If you follow the naming conventions in this procedure, you can use this Default.html file without any changes.

The most important line in Default.html is the line that specifies the app.xap file. This is the file that contains your source code and the DLR assemblies.

    <object data="data:application/x-silverlight," 
      type="application/x-silverlight-2-b1" 
      width="100%" height="100%">
      <param name="source" value="app.xap"/>

Default.html has other features, including a <div> for displaying error messages while you are debugging your application.

If you have not used Chiron.exe before, add it to the path.

Chiron.exe is located in the Tools folder of the SDK installation. If you used the default installation location, this folder is \Program Files\Microsoft SDKs\Silverlight\v2.0\Tools.

To run your application, use a Command Prompt window to run Chiron.exe with the /browser (/b) option. Run Chiron.exe from the application folder.

Chiron.exe serves your application folder in the browser.

Chiron.exe remains running in the Command Prompt window, displaying status messages.

In the browser, click Default.html to run the application.

Chiron.exe generates a .xap file on demand. Your Silverlight-based application opens. Click the text to increase the font size. Leave the browser open.

To show that the .xap file is generated on demand, edit the source file. Alter the line that increases the font size, so that it reduces the opacity instead:

jsx

sender.Opacity /= 2

py

sender.Opacity /= 2

rb

sender.opacity = sender.opacity / 2

In the browser, refresh the page.

Default.html requests app.xap, and Chiron.exe generates a new app.xap file. The application restarts. Click the control and notice that the opacity of the text now decreases. You can use this technique to edit and test your application repeatedly without having to restart Chiron.exe. In a later procedure you will see how to perform the same kind of iterative development while debugging with Visual Studio.

Close the browser.

In the Command Prompt window, press CTRL+C to stop Chiron.exe.

Use a Command Prompt window to run Chiron.exe with the /directory (/d) and /zipdlr (/z) options. Run Chiron.exe from the application folder, just as you did when you were developing and testing your application.

The /directory option specifies the directory containing the application entry point, and the /zipdlr option specifies the name of the .xap file. For the application developed in the preceding procedure the command looks like this:

Chiron.exe /directory:app /zipdlr:app.xap

Copy Default.html and app.xap to the desired location.

Use the import statement to load the clr module.

import clr

Use the clr.AddReference function to load assemblies and make their contents available for import.

clr.AddReference("MyAssembly, Version=1.0.0.0, Culture=neutral, PublicKeyToken=b17a5c561934e089")

Use the import statement to add namespaces to the current context or to load modules. You must import namespaces before you can use them.

import System.Windows
import System
import MyPythonModule

Use the from … import statement to add the contents of a namespace or module to the current context.

from System.Windows import *
from System.Windows.Controls import UserControl*

Use the AddReference function to load assemblies and to make their contents available for import.

AddReference("MyAssembly, Version=1.0.0.0, Culture=neutral, PublicKeyToken=b17a5c561934e089")

Use the Import function to import namespaces into the current context. You must import namespaces before you can use them.

Import("System.Windows")
Import("System")

Use the Import function to import the contents of a namespace into the current context.

Import("System.Windows.*")
Import("System.*")

Use the ImportAlias function to import a namespace or to type into the current context with an alias.

SW = ImportAlias("System.Windows")

Use the LoadModule and LoadModuleFromFile functions to load modules. The methods return the loaded module. The second parameter of LoadModuleFromFile specifies the type of the module, "js" or "py".

util = LoadModule("MyUtilities")
util = LoadModuleFromFile("MyUtilities", "py")

Use the require statement to load assemblies and to make their contents available for inclusion.

require MyAssembly

Use the include statement to add namespaces to the current context.

include System.Windows

Load the dynamic language files that you want to debug into Visual Studio, and set breakpoints.

From the application folder, run Chiron.exe with the /browser (/b) option to serve the directory in the browser.

In the browser, click Default.html to start the application.

Chiron.exe generates the .xap file on demand. The application startup code runs.

In Visual Studio, on the Debug menu, click Attach to Process.

Because your application is running in the browser, you must attach to the browser process in order to debug it.

In the Attach to Process dialog box, in the Available Processes list, in the Process column, click the appropriate instance of the browser to select it.

If you have other instances of the browser open, giving Default.html a title will make it easy to identify in the Title column.

Click Attach.

Switch to the browser and press F5 to refresh Default.html.

Your application is reloaded under the debugger, and you are now ready to debug. Any breakpoints you have set in your initialization code are hit when your application is reloaded.

Using a second instance of Visual Studio or another editor, make changes to your code and save them.

You cannot make changes to the code in the instance of Visual Studio that is attached to the browser process.

In the browser, refresh your HTML page.

Chiron.exe generates a new .xap file, and your application startup code runs. If you have breakpoints in your startup code, they are hit.

Visual Studio informs you that the source file has been modified, and asks whether you want to reload it. Click Yes to reload the file and continue your Visual Studio debugging session.

You can continue to switch between debugging and modifying your code without having to stop the browser or Chiron.exe.

When you are finished debugging, detach from the process. Close the browser, and use CTRL+C to stop Chiron.exe.