Custom Zoom Box

This sample demonstrates how use use a control template for the Map to define a custom zoom box style.

XAML

<UserControl x:Class="ArcGISWPFSDK.LocalCustomZoomBox"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:esri="http://schemas.esri.com/arcgis/client/2009">
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.Resources>
            <Style x:Key="MyMapStyle" TargetType="esri:Map">
                <Setter Property="IsTabStop" Value="true"/>
                <Setter Property="ZoomDuration" Value="0:0:.75"/>
                <Setter Property="PanDuration" Value="0:0:.75"/>
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="ZoomFactor" Value="2"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="esri:Map">
                            <Border BorderBrush="{TemplateBinding BorderBrush}" 
                                    BorderThickness="{TemplateBinding BorderThickness}" 
                                    Background="{TemplateBinding Background}">
                                <Grid>
                                    <Grid x:Name="RootElement" Height="Auto" Width="Auto"/>
                                    <Rectangle x:Name="ZoomBox" Fill="#55C0C0C0" Stroke="Black" StrokeDashArray="10"  
                                               StrokeThickness="1" Visibility="Collapsed"/>
                                </Grid>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <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" Offset="0.16"/>
                <GradientStop Color="#FF3D7FAC" Offset="0.502"/>
                <GradientStop Color="#FF88C5EF" Offset="0.984"/>
            </LinearGradientBrush>
        </Grid.Resources>
        <esri:Map Style="{StaticResource MyMapStyle}" WrapAround="True" Extent="-15000000,2000000,-7000000,8000000" Background="#FFE3E3E3" MinimumResolution="2445.98490512499">
            <esri:ArcGISLocalTiledLayer ID="BaseMap" Path="..\\Data\\TPKs\\Topographic.tpk"/>
        </esri:Map>
        <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,10,10,0" >
            <Rectangle Fill="{StaticResource PanelGradient}" Stroke="Gray"  RadiusX="10" RadiusY="10" Margin="0,0,0,5">
                <Rectangle.Effect>
                    <DropShadowEffect/>
                </Rectangle.Effect>
            </Rectangle>
            <Rectangle Fill="#FFFFFFFF" Stroke="DarkGray" RadiusX="5" RadiusY="5" Margin="10,10,10,15" />
            <TextBlock x:Name="ResponseTextBlock" Text="To zoom-in, press and hold the Shift key then click and hold the left mouse button and drag the mouse cursor over the map to define a zoom box.  To zoom-out, press and hold the Ctrl and Shift keys then click and hold the left mouse button and drag the mouse cursor over the map to define a zoom box.  Release the left mouse button to start zooming in\out." 
                       Width="200" TextAlignment="Left" Margin="30,20,20,30" TextWrapping="Wrap" Foreground="Black"/>
        </Grid>
    </Grid>
</UserControl>

C#

using System.Windows.Controls;

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

VB.NET

Imports System.Windows.Controls

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