Using a Draw surface

With the Draw surface, you can easily capture geometries that are drawn by users of your application. Once you retrieve these geometries, you can add them to a graphics layer or use them as input for other operations such as identify or buffer. To use a Draw surface in your application, you must do the following:

• Set the symbols for the draw operations.
• Set the Draw surface's map.
• Implement logic to activate and deactivate the surface.
• Process the geometries that are drawn on the surface.

Creating an application with a Draw surface

The following steps walk you through using the Draw surface in a simple application that allows users to draw polygons on a map. All the .NET code (code-behind) shown is written in C#. To start, create a Silverlight application with a Map, GraphicsLayer, and SimpleFillSymbol as outlined in Creating a map, Creating a Graphics layer, and Managing graphic features. The XAML view of your application's main page (that is, MainPage.xaml) should include the following Grid:

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.Resources>
        <esri:SimpleFillSymbol x:Key="RedFillSymbol" Fill="#66FF0000" BorderBrush="Red" BorderThickness="2" />
        <esri:SimpleFillSymbol x:Key="BlueFillSymbol" Fill="#660000FF" BorderBrush="Blue" BorderThickness="2" />  
    </Grid.Resources>

    <esri:Map x:Name="MyMap" Background="White" Extent="-120, 20, -100, 40" >
        <esri:Map.Layers>
            <esri:ArcGISTiledMapServiceLayer ID="StreetMapLayer" 
                Url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
            <esri:GraphicsLayer ID="MyGraphicsLayer" />
        </esri:Map.Layers>
    </esri:Map>
</Grid>

Note:

To use the code in this topic, you need references to the following assemblies:

• ESRI.ArcGIS.Client
• System.Runtime.Serialization

Also include the following XML namespace declaration in your XAML:

xmlns:esri="http://schemas.esri.com/arcgis/client/2009"

1. Open the code-behind. Add using statements for the ESRI.ArcGIS.Client and ESRI.ArcGIS.Client.Symbols namespaces.

   using ESRI.ArcGIS.Client;
   using ESRI.ArcGIS.Client.Symbols;
   

2. In the constructor, create a new Draw object. Include the Map name in the Draw constructor.
   Draw MyDrawObject = new Draw(MyMap);
   

3. Specify the Draw surface's DefaultPolygonSymbol property to be the RedFillSymbol object defined in the Grid's resources.

   This sets the symbol that will be used to show polygons while they are being drawn.

   Draw MyDrawObject = new Draw(MyMap) 
   { 
       FillSymbol = LayoutRoot.Resources["RedFillSymbol"] as FillSymbol 
   };
   

4. Declare a handler for the surface's DrawComplete event. This event fires whenever a user finishes drawing a shape on the surface.
   Draw MyDrawObject = new Draw(MyMap) 
   { 
       FillSymbol = LayoutRoot.Resources["RedFillSymbol"] as FillSymbol
   }; 
   MyDrawObject.DrawComplete += MyDrawObject_DrawComplete;
   

5. Activate the Draw surface by specifying a DrawMode and setting IsEnabled to true. Usually, activation of a Draw surface is initiated by a user event (for example, a button click). When the Draw surface is active, click events result in geometries being drawn on the map. The DrawMode determines the type of geometry that's drawn.
   MyDrawObject.DrawMode = DrawMode.Polygon; 
   MyDrawObject.IsEnabled = true;
   

6. Implement a handler for the Draw surface's DrawComplete event. This handler is called when the user is done drawing a polygon. The handler's args parameter holds a reference to the user-drawn geometry.
   private void MyDrawObject_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args) 
   { 
   }
   

7. Create a Graphic. Assign the geometry drawn by the user and the BlueFillSymbol specified in the application's XAML to the Graphic.
   private void MyDrawObject_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args)
   {
       Graphic graphic = new Graphic() 
       { 
           Geometry = args.Geometry, 
           Symbol = LayoutRoot.Resources["BlueFillSymbol"] as FillSymbol
       };
   }
   

8. Retrieve the GraphicsLayer that is specified in the application's XAML.
   private void MyDrawObject_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args)
   {
       Graphic graphic = new Graphic() 
       { 
           Geometry = args.Geometry, 
           Symbol = LayoutRoot.Resources["BlueFillSymbol"] as FillSymbol 
       };
       GraphicsLayer graphicsLayer = MyMap.Layers["MyGraphicsLayer"] as GraphicsLayer;
   }
   

9. Add the Graphic to the GraphicsLayer. This will display the graphic on the map.
   private void MyDrawObject_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args)
   {
       Graphic graphic = new Graphic() 
       { 
           Geometry = args.Geometry, 
           Symbol = LayoutRoot.Resources["BlueFillSymbol"] as FillSymbol 
       };
       GraphicsLayer graphicsLayer = MyMap.Layers["MyGraphicsLayer"] as GraphicsLayer; 
       graphicsLayer.Graphics.Add(graphic);
   }
   

10. To disable the Draw surface, set the DrawMode to None and the IsEnabled property to false.

Geometries

In the application above, the Draw surface is used to draw polygons. To do this, a SimpleFillSymbol was bound to the Draw surface's DefaultPolygonSymbol property and a DrawMode of Polygon was used. The relationships between Symbol types and Draw surface properties for all the supported geometry types are summarized in the following table:

Draw Mode	Supported Symbol Types	Bound Property
Point	SimpleMarkerSymbol, TextSymbol, PictureMarkerSymbol	DefaultMarkerSymbol
Polyline	CartographicLineSymbol	DefaultLineSymbol
Polygon	SimpleFillSymbol	DefaultPolygonSymbol
Rectangle	SimpleFillSymbol	DefaultRectangleSymbol
Freehand	CartographicLineSymbol	DefaultLineSymbol