wpf 的縮放和拖拽

主要實現的功能是將一個控件內的所有內容進行縮放（本例使用的是一個button和image控件）

其實原理也很簡單 wpf的viewbox控件可以實現這個功能

先上個效果圖 

 

 

主要代碼

 

<Window x:Class="Zoom.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="600" Width="800" Background="Black">
    <Grid>
        <Canvas Name="container" Cursor="ScrollAll" MouseWheel="StackPanel_MouseWheel">
            <Viewbox Width="500" Height="500"  Name="vb1" Stretch="Uniform" StretchDirection="Both"
                     HorizontalAlignment="Center" MouseLeftButtonDown="c_MouseLeftButtonDown" MouseMove="c_MouseMove" 
                    MouseLeftButtonUp="c_MouseUp">
                <StackPanel>
                    <Button Content="asdfas" Width="300" Height="200"/>
                    <Image Source="/Zoom;component/Images/Desert.jpg"/>
                </StackPanel>
            </Viewbox>
        </Canvas>
        
        <StackPanel Margin="10" HorizontalAlignment="Left" VerticalAlignment="Top" Orientation="Horizontal" DockPanel.Dock="Top">
                <Button Margin="10" Name="big" Click="Zoom_Big" HorizontalAlignment="Left" Cursor="Hand">
                    <Button.Template>
                        <ControlTemplate>
                            <Image x:Name="back" Source="/Zoom;component/Images/zoom_in.png" Width="32"/>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter TargetName="back" Property="Image.Source" Value="/Zoom;component/Images/zoom_in_h.png" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Button.Template>
                </Button>
                <Button Margin="10" Name="small" Click="Zoom_Small" HorizontalAlignment="Left" Cursor="Hand">
                    <Button.Template>
                        <ControlTemplate>
                            <Image x:Name="small_back" Source="/Zoom;component/Images/zoom_out.png" Width="32"/>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter TargetName="small_back" Property="Image.Source" Value="/Zoom;component/Images/zoom_out_h.png" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </StackPanel>
    </Grid>
</Window>

　　

 

后台代碼

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
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.Navigation;
using System.Windows.Shapes;

namespace Zoom
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        private bool isdrag = false;
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Zoom_Big(object sender, RoutedEventArgs e)
        {
            vb1.Width =vb1.Width* 1.1;
            vb1.Height = vb1.Height * 1.1;
        }

        private void Zoom_Small(object sender, RoutedEventArgs e)
        {
            vb1.Width =vb1.Width/1.1;
            vb1.Height = vb1.Height / 1.1;
        }

        private void StackPanel_MouseWheel(object sender, MouseWheelEventArgs e)
        {

        }
        
        private void c_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            isdrag = true;
        }
        private void c_MouseUp(object sender, MouseButtonEventArgs e)
        {
            isdrag = false;
        }
        private void c_MouseMove(object sender, MouseEventArgs e)
        {
            if(!isdrag) return;
            var control = (sender as UIElement);
            control.SetValue(Canvas.LeftProperty, e.GetPosition(container).X-control.DesiredSize.Width/2);
            control.SetValue(Canvas.TopProperty, e.GetPosition(container).Y-control.DesiredSize.Height/2);
            var vector= VisualTreeHelper.GetOffset(control);
            this.Title=vector.X+"/"+vector.Y;
        }
        

      }
}

　實例下載