Creating a WPF Window that allows zooming and panning
You can get functionality out of a ScrollViewer and a ScaleTransform. Here's an example:
<Window x:Class="CSharpWpf.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- This ScrollViewer enables the panning -->
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<!-- This StackPanel is the container for the zoomable/pannable content. -->
<!-- Any container control (StackPanel, DockPanel, Grid, etc) may be used here. -->
<StackPanel HorizontalAlignment="Left" VerticalAlignment="Top">
<!-- This ScaleTransform implements the zooming and is bound the Value of the ZoomSlider -->
<StackPanel.LayoutTransform>
<ScaleTransform ScaleX="{Binding ElementName=ZoomSlider, Path=Value}" ScaleY="{Binding ElementName=ZoomSlider, Path=Value}" />
</StackPanel.LayoutTransform>
<!-- Here is your custom content -->
<Button>Foo</Button>
<Button>Bar</Button>
</StackPanel>
</ScrollViewer>
<!-- This Slider controls the zoom level -->
<Slider x:Name="ZoomSlider" Orientation="Horizontal" Grid.Row="1" Minimum="0.0" Maximum="8.0" LargeChange="0.25" SmallChange="0.01" Value="1.0" />
</Grid>
</Window>
This might be a good candidate for a Viewbox
.
See here: http://msdn.microsoft.com/en-us/library/system.windows.controls.viewbox(v=vs.110).aspx
Basically, you can Wrap the entire contents of the Window into a Viewbox
like so:
<Window>
<Viewbox>
<!-- content here -->
</Viewbox>
</Window>
and then bind to the Viewbox
control's width and height to simulate the zooming. For a quick test, you could just listen to scroll wheel events via code-behind, name the Viewbox control, and access the Viewbox directly at change the values there.
Edit: here's a scenario I just found to get you started. They are using an image, but it's the exact same concept that I described above.
http://www.c-sharpcorner.com/uploadfile/yougerthen/working-with-wpf-viewbox-control/
Edit2: Quick working example using mouse-scroll
Xaml:
<Window x:Class="WpfApplication2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow"
MouseWheel="MainWindow_OnMouseWheel">
<Grid>
<Viewbox x:Name="ZoomViewbox" Stretch="Fill">
<StackPanel>
<Label Content="Label" HorizontalAlignment="Left" VerticalAlignment="Top"/>
<Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" />
</StackPanel>
</Viewbox>
</Grid>
</Window>
C#:
using System.Windows;
using System.Windows.Input;
namespace WpfApplication2
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
ZoomViewbox.Width = 100;
ZoomViewbox.Height = 100;
}
private void MainWindow_OnMouseWheel(object sender, MouseWheelEventArgs e)
{
UpdateViewBox((e.Delta > 0) ? 5 : -5);
}
private void UpdateViewBox(int newValue)
{
if ((ZoomViewbox.Width >= 0) && ZoomViewbox.Height >= 0)
{
ZoomViewbox.Width += newValue;
ZoomViewbox.Height += newValue;
}
}
}
}