More work on WpfDrawingDocument

- Improved the WpfDrawingDrawing object implementation
- Added support for hit-testing by point and rectangle
- Added a sample, WpfTestSvgControl, for testing this feature
- Modified the codes to make the SetId value same as the SVG ID
- This is the first step in support for interactivities and resolve the issue #106

Samples/WpfTestSvgControl/App.xaml.cs

@@ -0,0 +1,12 @@
+using System;
+using System.Windows;
+
+namespace WpfTestSvgControl
+{
+    /// <summary>
+    /// Interaction logic for App.xaml
+    /// </summary>
+    public partial class App : Application
+    {
+    }
+}

Samples/WpfTestSvgControl/DebugPage.xaml

@@ -0,0 +1,14 @@
+<Page x:Class="WpfTestSvgControl.DebugPage"
+      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:local="clr-namespace:WpfTestSvgControl"
+      mc:Ignorable="d" 
+      d:DesignHeight="450" d:DesignWidth="800" Title="DebugPage">
+    <DockPanel LastChildFill="True">
+        <RichTextBox x:Name="debugBox" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10"  IsReadOnly="True" AllowDrop="False" VerticalScrollBarVisibility="Auto" IsUndoEnabled="False" HorizontalScrollBarVisibility="Auto">
+            <local:TraceDocument x:Name="traceDocument"/>
+        </RichTextBox>
+    </DockPanel>
+</Page>

Samples/WpfTestSvgControl/DebugPage.xaml.cs

@@ -0,0 +1,53 @@
+using System;
+
+using System.Windows.Controls;
+
+namespace WpfTestSvgControl
+{
+    /// <summary>
+    /// Interaction logic for DebugPage.xaml
+    /// </summary>
+    public partial class DebugPage : Page
+    {
+        private MainWindow _mainWindow;
+
+        public DebugPage()
+        {
+            InitializeComponent();
+        }
+
+        public MainWindow MainWindow
+        {
+            get {
+                return _mainWindow;
+            }
+            set {
+                _mainWindow = value;
+            }
+        }
+
+        public void Startup()
+        {
+            if (traceDocument != null)
+            {
+                traceDocument.Startup();
+            }
+        }
+
+        public void Shutdown()
+        {
+            if (traceDocument != null)
+            {
+                traceDocument.Shutdown();
+            }
+        }
+
+        public void PageSelected(bool isSelected)
+        {
+            if (isSelected)
+            {
+                debugBox.Focus();
+            }
+        }
+    }
+}

Samples/WpfTestSvgControl/DrawingHelpWindow.xaml

@@ -0,0 +1,25 @@
+<Window x:Class="WpfTestSvgControl.DrawingHelpWindow"
+        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+        xmlns:local="clr-namespace:WpfTestSvgControl"
+        mc:Ignorable="d"
+        Title="Quick Help - Drawing" Height="500" Width="750" Icon="App.ico" WindowStartupLocation="CenterOwner" ShowInTaskbar="False" ResizeMode="NoResize">
+    <Window.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <!-- 
+                Merge in the resource dictionary that contains the help text that is displayed in the window.
+                This is in a separate file to remove some of the clutter and simplify this file.
+                -->
+                <ResourceDictionary Source="DrawingPageHelp.xaml"/>
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </Window.Resources>
+
+    <!--
+    Some text that describes the input bindings.
+    -->
+    <FlowDocumentPageViewer Document="{StaticResource helpText}" Width="700" Background="White"/>
+</Window>

Samples/WpfTestSvgControl/DrawingHelpWindow.xaml.cs

@@ -0,0 +1,27 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Data;
+using System.Windows.Documents;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows.Media.Imaging;
+using System.Windows.Shapes;
+
+namespace WpfTestSvgControl
+{
+    /// <summary>
+    /// Interaction logic for DrawingHelpWindow.xaml
+    /// </summary>
+    public partial class DrawingHelpWindow : Window
+    {
+        public DrawingHelpWindow()
+        {
+            InitializeComponent();
+        }
+    }
+}

Samples/WpfTestSvgControl/DrawingPage.xaml

@@ -0,0 +1,169 @@
+<Page x:Class="WpfTestSvgControl.DrawingPage"
+    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:svg="http://sharpvectors.codeplex.com/runtime/"
+    xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"
+    xmlns:avalonEdit="http://icsharpcode.net/sharpdevelop/avalonedit"
+    xmlns:local="clr-namespace:WpfTestSvgControl"    
+    mc:Ignorable="d" 
+    Title="DrawingPage" Background="White"
+    FocusManager.FocusedElement="{Binding ElementName=zoomPanControl}">
+    <Page.Resources>
+        <!-- UI commands. -->
+        <RoutedUICommand x:Key="Commands.ZoomOut" />
+        <RoutedUICommand x:Key="Commands.ZoomIn" />
+        <RoutedUICommand x:Key="Commands.Fill" />
+        <RoutedUICommand x:Key="Commands.ZoomReset" />
+        <RoutedUICommand x:Key="Commands.UndoZoom" />
+        <RoutedUICommand x:Key="Commands.RedoZoom" />
+        <RoutedUICommand x:Key="Commands.Panning" />
+
+        <!-- This converts from a scale value to a percentage value.
+        It is used to convert the value of 'ContentScale' to the percentage zoom level that is displayed in the UI. -->
+        <local:ZoomPanScaleConverter x:Key="scaleToPercent"/>
+    </Page.Resources>
+
+    <Page.InputBindings>
+        <!-- Bind keys to commands. -->
+        <KeyBinding Key="Subtract" Modifiers="Control" Command="{StaticResource Commands.ZoomOut}"/>
+        <KeyBinding Key="OemMinus" Modifiers="Control" Command="{StaticResource Commands.ZoomOut}"/>
+        <KeyBinding Key="Add" Modifiers="Control" Command="{StaticResource Commands.ZoomIn}"/>
+        <KeyBinding Key="OemPlus" Modifiers="Control" Command="{StaticResource Commands.ZoomIn}"/>
+        <KeyBinding Key="Z" Modifiers="Control" Command="{StaticResource Commands.UndoZoom}"/>
+        <KeyBinding Key="Y" Modifiers="Control" Command="{StaticResource Commands.RedoZoom}"/>
+    </Page.InputBindings>
+
+    <Page.CommandBindings>
+        <!-- Bind commands to event handlers. -->
+        <CommandBinding Command="{StaticResource Commands.ZoomOut}" Executed="OnZoomOut" CanExecute="OnCanZoomOut"/>
+        <CommandBinding Command="{StaticResource Commands.ZoomIn}" Executed="OnZoomIn" CanExecute="OnCanZoomIn"/>
+        <CommandBinding Command="{StaticResource Commands.Fill}" Executed="OnZoomFit" CanExecute="OnCanZoomFit"/>
+        <CommandBinding Command="{StaticResource Commands.ZoomReset}" Executed="OnZoomReset" CanExecute="OnCanZoomReset"/>
+        <CommandBinding Command="{StaticResource Commands.UndoZoom}" Executed="OnUndoZoom" CanExecute="OnCanUndoZoom"/>
+        <CommandBinding Command="{StaticResource Commands.RedoZoom}" Executed="OnRedoZoom" CanExecute="OnCanRedoZoom"/>
+        <CommandBinding Command="{StaticResource Commands.Panning}" Executed="OnPanMode" CanExecute="OnCanPanMode"/>
+    </Page.CommandBindings>
+
+    <Grid x:Name="drawingGrid">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="*"/>
+            <RowDefinition Height="16"/>
+            <RowDefinition Height="286"/>
+        </Grid.RowDefinitions>
+
+        <DockPanel LastChildFill="True">
+            <ToolBar DockPanel.Dock="Top" Height="36">
+                <ToolBar.Resources>
+                    <Style TargetType="{x:Type Image}">
+                        <Style.Triggers>
+                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, AncestorLevel=1}, Path=IsEnabled}" Value="False">
+                                <Setter Property="Opacity" Value="0.30" />
+                            </DataTrigger>
+                        </Style.Triggers>
+                    </Style>
+                </ToolBar.Resources>
+                <Button Click="OnOpenFileClick" ToolTip="Open SVG File">
+                    <StackPanel Orientation="Horizontal">
+                        <Image Source="{svgc:SvgImage Source=/Images/Open.svg, AppName=WpfTestSvgControl}" Height="24" Width="24"/>
+                        <TextBlock Margin="3,0,0,0" VerticalAlignment="Center">Open</TextBlock>
+                    </StackPanel>
+                </Button>
+                <Button Click="OnOpenFolderClick" ToolTip="Open SVG Folder" Visibility="Collapsed">
+                    <StackPanel Orientation="Horizontal">
+                        <Image Source="{svgc:SvgImage Source=/Images/OpenFolder.svg, AppName=WpfTestSvgControl}" Height="24" Width="24"/>
+                        <TextBlock Margin="3,0,0,0" VerticalAlignment="Center">Select Folder</TextBlock>
+                    </StackPanel>
+                </Button>
+                <Separator/>
+                <Button Command="{StaticResource Commands.UndoZoom}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Undo">
+                    <Image Source="{svgc:SvgImage Source=/Images/Undo.svg, AppName=WpfTestSvgControl}" Height="24" Width="24"/>
+                </Button>
+                <Button Command="{StaticResource Commands.RedoZoom}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Undo">
+                    <Image Source="{svgc:SvgImage Source=/Images/Redo.svg, AppName=WpfTestSvgControl}" Height="24" Width="24"/>
+                </Button>
+                <Button Command="{StaticResource Commands.ZoomIn}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Zoom In">
+                    <Image Source="{svgc:SvgImage Source=/Images/ZoomIn.svg, AppName=WpfTestSvgControl}" Height="24" Width="24" />
+                </Button>
+                <Button Command="{StaticResource Commands.ZoomReset}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Reset Zoom">
+                    <Image Source="{svgc:SvgImage Source=/Images/ZoomReset.svg, AppName=WpfTestSvgControl}" Height="24" Width="24" />
+                </Button>
+                <Button Command="{StaticResource Commands.ZoomOut}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Zoom Out">
+                    <Image Source="{svgc:SvgImage Source=/Images/ZoomOut.svg, AppName=WpfTestSvgControl}" Height="24" Width="24" />
+                </Button>
+                <Separator/>
+
+                <!--This is the label that shows what the current zoom level is while zooming in and out.-->
+                <TextBlock MinWidth ="24" VerticalAlignment="Center" HorizontalAlignment="Right" TextAlignment="Right"
+                    Text="{Binding ElementName=zoomPanControl, Path=ContentScale, Converter={StaticResource scaleToPercent}}"/>
+                <TextBlock VerticalAlignment="Center" Text="%"/>
+
+                <!--Slider to change the current zoom level.-->
+                <Slider x:Name="zoomSlider" Width="250" Padding="0" LargeChange="20" SmallChange="0.1" TickFrequency="20" TickPlacement="TopLeft" 
+                    Maximum="{Binding ElementName=zoomPanControl, Path=MaxContentScale, Converter={StaticResource scaleToPercent}}"
+                    Minimum="{Binding ElementName=zoomPanControl, Path=MinContentScale, Converter={StaticResource scaleToPercent}}"
+                    Value="{Binding ElementName=zoomPanControl, Path=ContentScale, Converter={StaticResource scaleToPercent}}"/>
+                <!--The fill button.  Causes the content to be scaled so that it fits in the viewport.-->
+                <Button Command="{StaticResource Commands.Fill}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Zoom to Fit the view">
+                    <StackPanel Orientation="Horizontal">
+                        <Image Source="{svgc:SvgImage Source=/Images/ZoomToFit.svg, AppName=WpfTestSvgControl}" Height="24" Width="24" />
+                        <TextBlock Margin="3,0,0,0" VerticalAlignment="Center">Fit</TextBlock>
+                    </StackPanel>
+                </Button>
+                <Separator/>
+                <ToggleButton x:Name="tbbPanning" IsChecked="true" Command="{StaticResource Commands.Panning}" CommandTarget="{Binding ElementName=zoomPanControl}" ToolTip="Toggle Panning">
+                    <Image Source="{svgc:SvgImage Source=/Images/Panning.svg, AppName=WpfTestSvgControl}" Height="24" Width="24" />
+                </ToggleButton>
+                <Separator/>
+                <Button x:Name="tbbShowHelp" Click="OnShowHelp" ToolTip="Show Quick Help">
+                    <Image Source="{svgc:SvgImage Source=/Images/Information.svg, AppName=WpfTestSvgControl}" Height="24" Width="24"/>
+                </Button>
+            </ToolBar>
+
+            <!-- Wrap the ZoomAndPanControl in a ScrollViewer.
+            When the scaled content that is displayed in ZoomAndPanControl is larger than the viewport onto the content
+            ScrollViewer's scrollbars can be used to manipulate the offset of the viewport. -->
+            <ScrollViewer x:Name="canvasScroller" CanContentScroll="True"
+                VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" AllowDrop="True" Background="LightGray">
+                <!-- This is the control that handles zooming and panning. -->
+                <svg:ZoomPanControl x:Name="zoomPanControl" HorizontalAlignment="Center" VerticalAlignment="Center"
+                    MouseDown="OnZoomPanMouseDown" MouseUp="OnZoomPanMouseUp" MouseDoubleClick="OnZoomPanMouseDoubleClick"
+                    MouseMove="OnZoomPanMouseMove" MouseWheel="OnZoomPanMouseWheel">
+                    <Grid x:Name="theGrid">
+                        <!-- This Canvas is the content that is displayed by the ZoomPanControl.
+                        Width and Height determine the size of the content. -->
+                        <svg:SvgDrawingCanvas x:Name="svgViewer" Background="White"/>
+
+                        <!--
+                        This Canvas and Border are used as a very simple way to render a drag rectangle that the user
+                        uses to specify an area to zoom in on.
+                        -->
+                        <Canvas x:Name="dragZoomCanvas" Visibility="Collapsed">
+                            <Border x:Name="dragZoomBorder" BorderBrush="Black" BorderThickness="1" Background="Silver" 
+                                    CornerRadius="1" Opacity="0" />
+                        </Canvas>
+                    </Grid>
+                </svg:ZoomPanControl>
+            </ScrollViewer>
+        </DockPanel>
+
+        <local:GridExpander x:Name="rightSplitter" Grid.Row="1" Height="14" HorizontalAlignment="Stretch" VerticalAlignment="Center" 
+                      BorderThickness="1" BorderBrush="LightGray" Background="LightGray"/>
+
+        <DockPanel x:Name="viewerFrame" LastChildFill="True" Grid.Row="2">
+            <TabControl>
+                <TabItem Header="Element Drawing">
+                    <ScrollViewer x:Name="imageScroller" CanContentScroll="False" Padding="4"
+                    VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Background="White">
+                        <Image x:Name="elementImage" Stretch="None" />
+                    </ScrollViewer>
+                </TabItem>
+                <TabItem Header="Element XML">
+                    <avalonEdit:TextEditor x:Name="textEditor" FontFamily="Consolas" FontSize="12pt" IsReadOnly="True" Language="XML"/>
+                </TabItem>
+            </TabControl>
+
+        </DockPanel>
+    </Grid>
+</Page>