Convert an Expression Blend Project to a Silverlight for Windows Embedded Application Template (Compact 7)

  • Article

3/12/2014

Windows Embedded Compact 7 offers two ways to create a Microsoft Silverlight for Windows Embedded application template.

  • If you have Platform Builder installed, you can import an Expression Blend project into an existing OS Design project.
  • If you do not have Platform Builder installed, you can create the project using the Windows Embedded Silverlight Tools. This method also requires that you install an SDK that was built from an OS Design project that included support for Silverlight for Windows Embedded.

The following procedures assume that you have Platform Builder installed.

Prerequisites

Install the Windows Embedded Silverlight Tools

Prepare an Expression Blend Project

The Windows Embedded Silverlight Tools installation includes a Silverlight for Windows Embedded Clock sample project, which provides the basis for the tutorials in this section.

To prepare the Silverlight for Windows Embedded Clock sample project

  1. Browse to the WindowsEmbeddedSilverlightClock sample folder located at %ProgramFiles%\Windows Embedded Silverlight Tools.

  2. Do one of the following:

    • If you have Expression Blend installed, you can copy the sample project to the C:\Users\[name]\Documents\Expression folder, as long as there are no spaces in the full name of the file path.
    • If you do not have Expression Blend installed, create a C:\ExpressionBlend working folder and copy the WindowsEmbeddedSilverlightClock sample project to it.

You will use the accompanying WindowsEmbeddedSilverlightClockUpdate folder later in this tutorial to apply updates. When you merge these updates into your sample project, you will overwrite some files. To avoid overwriting the original sample project, you create a working copy of the sample folder in C:\ExpressionBlend.

In the following steps, you create and run a Silverlight for Windows Embedded-based application, MyClock.exe, which is based on the Silverlight for Windows Embedded Clock sample project.

Include Silverlight for Windows Embedded in Your OS Design

Before you can run Silverlight for Windows Embedded-based applications in Windows Embedded Compact, you must include the native Silverlight for Windows Embedded runtime in your device image.

To include Silverlight for Windows Embedded in your OS Design

  1. Start Visual Studio.

  2. In Platform Builder, open the OS Design for your target device.

    If you do not have a device, you can use a virtual CEPC as your development target. For more information about Virtual CEPC, see Develop with Virtual CEPC. If you use a virtual CEPC for your development target, configure your OS design using the Enterprise Device Handheld template as explained in Create a Virtual CEPC OS Run-Time Image.

  3. In Platform Builder, open the Catalog Items View for your OS Design. If the Catalog Items View is not visible, follow these steps to make it visible:

    1. In Visual Studio, click the View menu.
    2. Select Other Windows, and then select Catalog Items View. The Catalog Items View pane appears in Visual Studio.

  4. Expand Core OS, **Windows Embedded Compact **, Shell and User Interface, and then **Microsoft Silverlight for Windows Embedded **.

  5. Under **Microsoft Silverlight for Windows Embedded **, select the check box for **Microsoft Silverlight for Windows Embedded **. This enables the Sysgen variable SYSGEN_XAML_RUNTIME in your OS Design.

  6. Expand Core OS, Core OS Services, and then Kernel Functionality.

  7. Under Kernel Functionality, verify that the check box for Target Control Support (Shell.exe) is selected. This enables you to use the Target Control functionality in Platform Builder to communicate with an attached device, such as a virtual CEPC.

  8. Build your OS Design.

Generate a Platform Builder Subproject From Your Expression Blend Project

To create an initial Microsoft Silverlight for Windows Embedded application template from an Expression Blend project, use the Windows Embedded Silverlight Tools Platform Builder Subproject Application Wizard. The Subproject Application Wizard generates a Platform Builder subproject from the resources and XAML files of the source Expression Blend project. After you incorporate this Platform Builder subproject into your OS Design, you can develop, test, and deploy the application as you would any other Windows Embedded Compact application.

When you import your Expression Blend project into a Platform Builder subproject, follow these guidelines.

  • Avoid making manual changes to the Expression Blend XAML files; always edit XAML files from within Expression Blend.
  • If your Expression Blend project contains user controls, ensure that each user control has a unique name, even across namespaces.
  • Verify that your Expression Blend project includes a default App.xaml file for the application class and MainPage.xaml (or Page.xaml) for the startup; do not rename these files.
  • Name all XAML elements that you will attach to event handlers. If you want Windows Embedded Silverlight Tools to generate empty stub code for your event handlers, you must explicitly name these XAML elements from within Expression Blend.
  • If you want to add XAML Resource Packager (XRPack) identifiers to user controls in your Expression Blend project, add these identifiers before you import the project. For more information about application packaging with XRPack, see XAML Resource Packager in the Windows Embedded Compact 7 documentation. For special XAML programming considerations related to XRPack, see XAML Markup Reference for XRPack.
  • Finalize the Expression Blend project name and location, XAML file names, the .csproj file name, and all namespace names before you start the Subproject Application Wizard. Changing the names or locations of any of these files and folders can break build dependencies between your subproject and the Expression Blend project.

Perform the following steps to create a Platform Builder subproject for the MyClock application.

To create the initial MyClock subproject from the Silverlight for Windows Embedded Clock sample

  1. Create an empty folder called MyClock to hold your Platform Builder subproject. For example, if the name of your OS Design is VCEPC, create a MyClock folder in this location:

    C:\WINCE700\OSDesigns\VCEPC\MyClock

  2. With your OS Design project open, click **Windows Embedded Silverlight Tools ** on the Tools menu, and then click Create Platform Builder Subproject.

  3. When the Create Platform Builder Subproject dialog box appears and displays the Overview, click Next.

  4. In the Project Name dialog box, type "MyClock" for the name.

  5. Browse to the location of your empty Platform Builder subproject MyClock folder (for example,

    C:\WINCE700\OSDesigns\VCEPC\MyClock).

    Click Next.

  6. In the Project Selection dialog box, click Browse, and then navigate to the .csproj file of the Silverlight for Windows Embedded Clock sample that you copied to C:\ExpressionBlend earlier. This file is at the following location:

    C:\ExpressionBlend\WindowsEmbeddedSilverlightClock\WindowsEmbeddedSilverlightClock.csproj

  7. Select the .csproj file, and then click Open.

  8. In the Project Selection dialog box, under Project Contents, verify that the Project Selection dialog box displays MainPage.xaml, and then click Next.

  9. Verify that the Validation dialog box shows No Errors Reported to indicate that Windows Embedded Silverlight Tools imported the Expression Blend project successfully.

    If the error message The project file you selected is either invalid or corrupt appears, Windows Embedded Silverlight Tools was unable to create a Platform Builder subproject from the Expression Blend project. For more information about resolving validation errors, see Troubleshoot the Clock Application.

  10. Click Finish to view the Summary Report Change Log.

    Important

    After you have created a Platform Builder subproject, do not move or rename the associated Expression Blend project folder, XAML files, or .csproj file. Your Platform Builder subproject depends upon the .csproj and XAML files of the associated Expression Blend project.

Add the Subproject to Your OS Design

To build and test the application template that the Subproject Application Wizard produced, you must add the generated Platform Builder subproject to your OS Design.

To add the MyClock subproject to your OS Design

  1. Open your OS Design project in Platform Builder.

  2. On the Project menu, click Add Existing Subproject.

  3. In the new Windows Explorer window, browse to the location of your MyClock project (for example, C:\WINCE700\OSDesigns\VCEPC\MyClock\MyClock).

  4. Select the .pbpxml file associated with the MyClock subproject, MyClock.pbpxml. Click Open.

Build the Application Template

Once you have incorporated this subproject into your OS Design, you can compile and link the generated application template to run on your target device.

To build MyClock.exe

  1. Select your OS Design in Platform Builder. In the Solution Explorer pane, expand Subprojects to view all subprojects.

  2. Locate and right-click the MyClock subproject that you created earlier, and then click Build.

  3. Verify that the output window displays the following message:

    C:\WINCE700\OSDesigns\VCEPC\MyClock\MyClock\sources - 0 error(s), 0 warning(s)
    ======== Build: 1 succeeded or up-to-date, 0 failed, 0 skipped ========

Run the Application Template

When the subproject builds successfully, you can run the resulting application, MyClock.exe, on your target device by performing the following steps.

To run MyClock.exe on your target device

  1. Connect and boot up your device in Platform Builder. If you are using virtual CEPC, be sure that your virtual CEPC is running and connected to Platform Builder as described in Download and Run a Virtual CEPC OS Run-Time Image.

  2. On the Target menu, click Run Programs.

  3. In the Run Program dialog box, under Available Programs, select MyClock.exe and then click Run.

  4. Verify that your target device displays the face of the Silverlight for Windows Embedded clock with stationary hour, minute, and second hands pointing downward at six o’clock, as shown in the following figure.

    Running the Application Template

    Running the Application Template

The hands of MyClock do not yet move; you will add functionality later in this tutorial so that MyClock can display the current time.

The Subproject Application Wizard creates enough C++ code in the application template to do the following:

  • Initialize the Windows Embedded Compact Silverlight for Windows Embedded runtime.
  • Instantiate XAML-declared objects in the Silverlight for Windows Embedded runtime.

Although the C# code-behind files of the source Expression Blend project contain functionality to animate the hands of the clock, Windows Embedded Silverlight Tools does not port this code for you. In the next section, you will add C++ code to animate the hands of MyClock.exe so that it can keep time.

Next Steps

Develop Your Application by Adding C++ Code

See Also

Concepts

Getting Started with Silverlight for Windows Embedded