Navigation Actions

This sample demonstrates the Pan To, Zoom To, and Zoom To Full Extent actions. To use each of these actions, simply click the corresponding item from the menu in the upper right corner of the application. The Zoom To action zooms to a specified geometry. The Pan To action pans to a specified geometry. The Zoom to Full Extent action zooms to the full extent of the specified map. In the sample XAML, the actions are attached to Buttons inside the Grid that comprises the menu. The key elements in the XAML are these Button elements and the actions they contain. Examining these, you can see that these actions can be easily attached to a button's click event in XAML. The Zoom To and Pan To actions require the name of the Map control to navigate and a geometry to navigate to. The Zoom to Full Extent action only requires the name of the target Map control.

XAML

<UserControl x:Class="ArcGISWPFSDK.LocalNavigationActions"    
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:esri="http://schemas.esri.com/arcgis/client/2009"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity">
    <Grid x:Name="LayoutRoot" >
        <Grid.Resources>
            <DropShadowEffect x:Key="dropShadow" BlurRadius="10" ShadowDepth="10" 
                              Direction="-45" Color="Black" Opacity="0.5" />
            <LinearGradientBrush x:Key="PanelGradient" EndPoint="0.5,1" StartPoint="0.5,0">
                <LinearGradientBrush.RelativeTransform>
                    <TransformGroup>
                        <ScaleTransform CenterY="0.5" CenterX="0.5"/>
                        <SkewTransform CenterY="0.5" CenterX="0.5"/>
                        <RotateTransform Angle="176" CenterY="0.5" CenterX="0.5"/>
                        <TranslateTransform/>
                    </TransformGroup>
                </LinearGradientBrush.RelativeTransform>
                <GradientStop Color="#FF145787"/>
                <GradientStop Color="#FF3D7FAC" Offset="0.184"/>
                <GradientStop Color="#FF88C5EF" Offset="0.984"/>
            </LinearGradientBrush>
            <Style x:Key="CommonBorder" TargetType="Border">
                <Setter Property="BorderBrush" Value="White" />
                <Setter Property="BorderThickness" Value="1" />
                <Setter Property="CornerRadius" Value="5" />
                <Setter Property="Background" Value="{StaticResource PanelGradient}" />
                <Setter Property="Opacity" Value="1" />
            </Style>            
        </Grid.Resources>
        <esri:Map x:Name="MyMap" WrapAround="True" Extent="-15000000,2000000,-7000000,8000000" MinimumResolution="2445.98490512499" >
            <esri:ArcGISLocalTiledLayer ID="MyBaseLayer" Path="..\\Data\\TPKs\\Topographic.tpk"/>
        </esri:Map>
        <Grid HorizontalAlignment="Right" VerticalAlignment="Top" Width="Auto" Height="Auto" Margin="10" >
            <Border Style="{StaticResource CommonBorder}" Padding="10,3,10,10" Effect="{StaticResource dropShadow}">
                <StackPanel>
                    <TextBlock Text="Navigation Actions" Foreground="White" FontSize="14" FontWeight="Bold" Margin="4" />
                    <Button Content="Pan To" Margin="2" >
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Click">
                                <esri:PanToAction
                                    TargetName="MyMap">
                                    <esri:PanToAction.Geometry>
                                        <esri:MapPoint X="-12340000" Y="4340000" />
                                    </esri:PanToAction.Geometry>
                                </esri:PanToAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                    <Button Content="Zoom To" Margin="2">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Click">
                                <esri:ZoomToAction
                                    TargetName="MyMap">
                                    <esri:ZoomToAction.Geometry>
                                        <esri:Envelope XMin="-14930991.170" YMin="3611744.037" XMax="-11348896.882" YMax="5340571.181" />
                                    </esri:ZoomToAction.Geometry>
                                </esri:ZoomToAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                    <Button Content="Zoom To Full Extent" Margin="2">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Click">
                                <esri:ZoomToFullExtentAction                                    
                                    TargetName="MyMap" />
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                </StackPanel>
            </Border>
        </Grid>
    </Grid>
</UserControl>

C#

using System.Windows.Controls;

namespace ArcGISWPFSDK
{
    public partial class LocalNavigationActions : UserControl
    {
        public LocalNavigationActions()
        {
            InitializeComponent();
        }
    }
}

VB.NET

Imports System.Windows.Controls


Namespace ArcGISWPFSDK
    Partial Public Class LocalNavigationActions
        Inherits UserControl
        Public Sub New()
            InitializeComponent()
        End Sub
    End Class
End Namespace