Getting started in Expression Blend

Microsoft Expression Studio is a suite of professional design tools for creating expressive user experiences while delivering great functionality for your clients across standards-based websites, cross-platform Silverlight experiences, and rich Windows applications. One of those tools is Expression Blend, which provides an interactive, aesthetic environment to create Silverlight, Windows Presentation Foundation (WPF), and Windows Phone applications. To get started, install Expression Blend 4 for a true visual design-time experience when building ArcGIS API for Silverlight applications. Use the tutorials and reference materials on the Expression Blend website to develop your skill set.

The ArcGIS API for Silverlight provides a set of integrated features in Expression Blend that enable a developer to drag, drop, and interact with controls, actions, and behaviors on an interactive design surface. A set of dialog boxes and property pages are included to design and configure components for applications.

The following screen shot shows the areas of interest in the Expression Blend 4 integrated development environment (IDE) interface with respect to the ArcGIS API for Silverlight. In general, controls, behaviors, and actions in the Core library and controls in the Toolkit library are included in the Assets panel. The Artboard provides an interactive surface to modify these controls at design time, and each ArcGIS control has a set of property dialog boxes, some of which are unique to the control. For example, in the Map control's Properties panel there is a Map Settings category where you can set the initial extent, add layers, define resolution limits, and so on.

TipTip:

To modify some properties, click the Advanced Options box next to the property name or setting to display a popup menu.

Expression Blend layout

Do the following steps to begin working with the ArcGIS API for Silverlight in Expression Blend:

Getting started path

  1. Install prerequisites, then download and install the ArcGIS API for Silverlight. See Installation for details.
  2. In Expression Blend 4, create a new Silverlight application project with a host web application by taking the following steps:
    1. On the File menu, click New Project to open the New Project dialog box.
    2. In the Project types tree, select Silverlight.
    3. Select the Silverlight Application + Website project type.
    4. In the Name box, type a name for the project.
    5. In the Location box, type the name of the folder where you want to store the project.
    6. From the Language drop-down list, select either Visual C# or Visual Basic.
    7. Click OK.
  3. Show the Assets panel available in Expression Blend by clicking the Assets button in the Tools panel on the left side of the IDE. Expand the Controls category and select the ESRI collection. The core library contains a Map control. See the following screen shot:
    Expression Blend
  4. Select the Map control in the Assets panel and drag it onto the UserControl surface on the Artboard. The Objects and Timeline panel shows the hierarchy of XAML contents (for example, elements). The Map control is in the Grid (LayoutRoot), which is in a UserControl.
    NoteNote:

    A reference to the ESRI.ArcGIS.Client assembly is added to your project when you put the Map on the Artboard.

  5. Ensure the Map control is selected in the Objects and Timeline panel, and select the Selection tool from theTools panel. In the Artboard, use the mouse to resize the Map to the size of the UserControl. In the Properties panel, expand the Layout category, and click the arrow icons next to the Width and Height attributes. This enables automatic sizing of the Map control to its container. See the following screen shot:
    Expression Blend Map control
  6. In the Objects and Timeline panel, select the UserControl that contains the Map control. In the Properties panel, expand the Layout category, and click the arrow icons next to the Width and Height attributes. This automatically adjusts the size of the UserControl to the size specified in the host page. In the Artboard, you can use the design-time resizing handles to set the controls' size in design-view without changing runtime properties. See the following screen shot:
    Expression Blend
  7. Select the Map control in the Objects and Timeline panel. In the Properties panel, expand the Map Settings category and click the ellipsis button next to the Layers (Collection) property. See the following screen shot:
    Screen shot of the
    A Layer Collection Editor dialog box appears. Click the Add another item button to add a new item (layer). A Select Object dialog box appears with a list of layer types in the ArcGIS API for Silverlight. Select ArcGISTiledMapServiceLayer to add a cached ArcGIS Server map service to the map and click OK.
  8. Properties for the the newly-added ArcGISTiledMapServiceLayer display in the Layer Collection Editor dialog box. Expand the Common Properties category and click the arrow next to the Url property to open a Property Dialog Editor dialog box that contains a Service Browser.
    Screen shot of the arrow beside the Url property.
    The Service Browser enables you to add an ArcGIS Server REST catalog endpoint (for example, http://serverapps.esri.com/arcgis/rest), browse cached map services, and define the service you want to use for your layer. A connection to ArcGIS Online (http://services.arcgisonline.com/arcgis/rest) is already provided via the arcgis online item. A preview window at the bottom of the Service Browser provides an interactive map that displays the selected service.

    Expand the arcgis online connection, and select the ESRI StreetMap World 2D service. Click OK to define the layer's Url property and close theProperty Dialog Editor dialog box. Click OK again to close the Layer Collection Editor dialog box. See the following screen shot:

    Expression Blend
  9. Press F5 to compile the code and run your application. Your Silverlight application will be hosted by an internal web development server. The browser opens and the map fills the browser window.
    Screen shot of the running application.
    TipTip:

    If the map is blank, make sure the Silverlight application has the permissions to access the ArcGIS Server site. To access an ArcGIS Server site on a different domain than the Silverlight application host site, the ArcGIS Server site must enable remote access to services. This is accomplished using a clientaccesspolicy.xml or crossdomain.xml. In most cases, place the XML file at the root of your website (for example, for IIS, c:\inetpub\wwwroot\). ArcGIS Online already hosts both files to support cross domain access for all Silverlight clients. For more information, see FAQs in this Help system.

For more information

For additional details on the structure and panels of Expression Blend, see Expression Blend user interface reference.

See Creating a map and Adding layers for more information about the components presented in this tutorial.

To explore ArcGIS API for Silverlight components in action, see the Interactive SDK samples.

For tips on discovering ArcGIS Server map services, see ArcGIS Server services.

6/23/2013