Developing in Mixed Mode

This paragraph gets you started on using the ESL tools in mixed mode. The following areas are covered:

Import a silverlight project

  1. ESL can import directly a silverlight project created with Visual Studio or ESL.
    Right click the blank of Project Explorer, select Import.
  2. In the import dialog, expand the node Microsoft Silverlight and choose Silverlight Project, click Next.
  3. Make sure the option "Select root directory:" is selected. Then click Browse button, select the root directory of the silverlight project in your computer. click OK.
  4. Click Finish and open the XAML file, then you will see the project which imported is in the left Project Explorer. (The imported project here is a Button control with height=50, width=100, content="Click Me!" properties and named "Button" )

Designing UI with Expression Blend

Moreover, project created by ESL can be opened and edited with Expression Blend 2 for complicated design.

  1. In the project explorer, right click ButtonSample, select Open with->Open Expression Blend.
  2. Then the project opened in Expression Blend.
  3. Now, we can use the tool to design the UI facility. Focus on the button, hold down the upper left corner of the button, the sharp of the pointer become a curve, drag it following the clock direction. Please see below snapshot.
  4. Save(Shift+S) the file and close the Expression Blend. Eclipse will pop-up a File Changed dialog, click Yes.
  5. Now the code in Eclipse also changed.

Developing with Microsoft Visual Studio

Project created by ESL also can be opened and edited in Visual Studio.

  1. Right click the project name, select Open with->Open Visual Studio.
  2. Now you can developing in Visual Studio, we add an event handler to the button. When click the button, its content changes to "Clicked". Open file Page.xaml, find x:Name="Button" and press the space bar. An intelliSence menu will appear.
  3. Double click on Click, A New Event Handler will appear. Press the Tab button.
  4. The Event Handler name will generate automatically. Right click on the Click and select "Navigate to Event Handler".
  5. Set the Button.Content = "Clicked!" like following.

Building and Runing Application

  1. Get focus on the project, select Project->Build Project.
    Right click the project, select Run As->Silverlight Web Application.
  2. It runs like below.
  3. Click the button, the content changes to "Clicked!"