User interaction
3 Sep 20203 minutes to read
Options such as zooming, panning, and selection enable the effective interaction on map elements.
Selection
Each shape in a map can be selected or deselected when interacted with shapes. Map shapes can be selected using the following two ways:
- Single Selection
- Multi Selection
The selected map shapes are differentiated by their fill. The SelectedShapeColor
of ShapeSettings
property gets or sets the selected shape color.
Single selection
Single selection allows you to select only one shape at a time. You can select the shape by tapping it. By default, the single selection is enabled when the EnableSelection
is set to true. You can also enable the single selection by setting the SelectionMode
property of ShapeFileLayer to “Single”. When selecting or tapping the rest of the area, the selected shape will be deselected.
SfMaps maps = new SfMaps(this);
maps.SetBackgroundColor(Color.White);
ShapeFileLayer layer = new ShapeFileLayer();
layer.Uri = "usa_state.shp";
layer.EnableSelection = true;
layer.SelectionMode = SelectionMode.Single;
ShapeSetting shapeSetting = new ShapeSetting();
shapeSetting.SelectedShapeColor = Color.DarkGreen;
layer.ShapeSettings = shapeSetting;
maps.Layers.Add(layer);
SetContentView(maps);
Multi selection
Multi selection allows you to select the multiple shapes at a time. You can select many shapes by tapping them. To enable this feature, set the SelectionMode
property to “Multiple” along with the EnableSelection
property.
IMPORTANT
Shapes cannot be selected when the
EnableSelection
property is set to false.
SfMaps maps = new SfMaps(this);
maps.SetBackgroundColor(Color.White);
ShapeFileLayer layer = new ShapeFileLayer();
layer.Uri = "usa_state.shp";
layer.EnableSelection = true;
layer.SelectionMode = SelectionMode.Multiple;
ShapeSetting shapeSetting = new ShapeSetting();
shapeSetting.SelectedShapeColor = Color.DarkGreen;
layer.ShapeSettings = shapeSetting;
maps.Layers.Add(layer);
SetContentView(maps);
Selected items
The SelectedItems property allows you to select the shapes without tapping or touching them.
To select a shape and deselect it from the same collection without tapping or touching, just add the shape that is to be selected to the selected items collection dynamically.
Zooming
The zooming feature enables you to zoom in and zoom out the map to show the in-depth information. The following properties are related to the zooming feature of maps control:
EnableZooming
property is used to control whether to perform zooming or not.
MinZoom
property sets the minimum level of zooming.
MaxZoom
property sets the maximum level of zooming.
SfMaps maps = new SfMaps(this);
maps.SetBackgroundColor(Color.White);
maps.EnableZooming = true;
maps.MinZoom = 1;
maps.MaxZoom = 10;
SetContentView(maps);
Panning
Panning feature allows moving the visible area of the map when it is zoomed in. To enable panning, you have to set EnablePanning
property to true.
SfMaps maps = new SfMaps(this);
maps.SetBackgroundColor(Color.White);
maps.EnablePanning = true;
maps.EnableZooming = true;
maps.MinZoom = 1;
maps.MaxZoom = 10;
SetContentView(maps);