WPF之Manipulation

需求:现,在窗口下有一个StackPanel控件.

　　1.可以拖动.

　　2.可以展开及收缩(不仅仅可以拖动还可以点击)

　　3.窗口向坐标轴一样分四个象限,在不同的区域停靠在不同的地方(四个角).

第一阶段:

　　我遇到的问题:

　　1.起初完成的时候发现StackPanel拖动的时候一直发疯一样的抖,

　　　解决方法:ManipulationStarting事件中,e.ManipulationContainer = this.myGrid,容器要父控件,我原先写成自己本身了.

　　2.为啥写了之后触控点不动?

　　　解决发发:查看构造函数中myStackPanel.RenderTransform = new MatrixTransform(),但是这样做会给后面留下新的问题,花了我一天时间找出这处.后面详述.

Xaml's code:

<Window x:Class="LearnWpf.ManipulationDemo"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ManipulationDemo" Height="300" Width="300">
    <Grid x:Name="myGrid">
        <StackPanel x:Name="myStackPanel"
                    Background="Red" Height="50" Width="50"
                    ManipulationStarting="StackPanel_ManipulationStarting"
                    ManipulationDelta="StackPanel_ManipulationDelta"
                    ManipulationCompleted="StackPanel_ManipulationCompleted"
                    />
    </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.Shapes;

namespace LearnWpf
{
    /// <summary>
    /// ManipulationDemo.xaml 的交互逻辑
    /// </summary>
    public partial class ManipulationDemo : Window
    {
        public ManipulationDemo()
        {
            InitializeComponent();
            myStackPanel.RenderTransform = new MatrixTransform();
            myStackPanel.IsManipulationEnabled = true;
        }

        private void StackPanel_ManipulationStarting(object sender, ManipulationStartingEventArgs e)
        {
            StackPanel element = (StackPanel)e.OriginalSource;
            e.ManipulationContainer = this.myGrid;
            e.Mode = ManipulationModes.All;
        }

        private void StackPanel_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
        {
            FrameworkElement element = (FrameworkElement)e.Source;
            Matrix matrix = ((MatrixTransform)element.RenderTransform).Matrix;
            ManipulationDelta deltaManipulation = e.DeltaManipulation;
            Point center = new Point(element.ActualWidth / 2, element.ActualHeight / 2);
            center = matrix.Transform(center);
            matrix.ScaleAt(deltaManipulation.Scale.X, deltaManipulation.Scale.Y, center.X, center.Y);
            matrix.RotateAt(e.DeltaManipulation.Rotation, center.X, center.Y);
            matrix.Translate(e.DeltaManipulation.Translation.X, e.DeltaManipulation.Translation.Y);
            ((MatrixTransform)element.RenderTransform).Matrix = matrix;
        }

        private void StackPanel_ManipulationCompleted(object sender, ManipulationCompletedEventArgs e)
        {

        }
    }
}

第二阶段:

<这里我想把它推上首页了,因为很多地方肯定没有做好,希望各位提提宝贵意见,还有一些问题想请教大家.还有很多地方注释没有完善

,因为我是现写的,请大家多多包容>

　　上一章,我们完成了触控条件下的操作,但是现在有一个问题:鼠标肿么办?

　　解决方案:利用MouseLeftButtonDown,MouseMove,MouseLeftButtonUp写.

　　还有需求中的要点击怎么办?

　　解决方案:这个我是要肿么办呢?决定用Touch事件做了.但是感觉又跟Manipulation重复了.详情请看代码.Touch事件和Manipulation事件重复了,没有注释掉,可以注释掉Manipulation事件,各位亲自理.

　　遇到问题:当鼠标和触摸两个事件一起发生时,会发生一起奇怪的现象,我做了处理,但是不能够解决,各位大大有什么看法?　　

<Window x:Class="LearnWpf.ManipulationDemo"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ManipulationDemo" WindowState="Maximized" Height="300" Width="300" MouseLeftButtonDown="Window_MouseLeftButtonDown" MouseMove="Window_MouseMove" MouseLeftButtonUp="Window_MouseLeftButtonUp">
    <Grid x:Name="myGrid">
        <StackPanel x:Name="myStackPanel"
                    Background="Red" Height="200" Width="200"
                    ManipulationStarting="StackPanel_ManipulationStarting" ManipulationDelta="StackPanel_ManipulationDelta" ManipulationCompleted="StackPanel_ManipulationCompleted"
                    TouchDown="myStackPanel_TouchDown" TouchMove="myStackPanel_TouchMove" TouchUp="myStackPanel_TouchUp"/>
    </Grid>
</Window>

CSharp Code 
 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.Shapes;
 
 namespace LearnWpf
 {
     /// <summary>
     /// ManipulationDemo.xaml 的交互逻辑
     /// </summary>
     public partial class ManipulationDemo : Window
     {
         FrameworkElement frameworkElement; //想要操纵的元素
         bool isFrameworkElementSelect; //想要用鼠标移动的元素是否被选中
         bool isMouse = false; //鼠标操作中
         bool isTouch = false; //触摸操作中
         public ManipulationDemo()
         {
             InitializeComponent();
             frameworkElement = this.myStackPanel;
             myStackPanel.RenderTransform = new MatrixTransform();
             myStackPanel.IsManipulationEnabled = true;
         }
 
         private void StackPanel_ManipulationStarting(object sender, ManipulationStartingEventArgs e)
         {
             frameworkElement = (FrameworkElement)e.OriginalSource;
             e.ManipulationContainer = this.myGrid;
             e.Mode = ManipulationModes.All;
             frameworkElement.Opacity = 0.5;
         }
 
         private void StackPanel_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
         {
             FrameworkElement element = (FrameworkElement)e.Source;
             Matrix matrix = ((MatrixTransform)element.RenderTransform).Matrix;
             ManipulationDelta deltaManipulation = e.DeltaManipulation;
             Point center = new Point(element.ActualWidth / 2, element.ActualHeight / 2);
             center = matrix.Transform(center);
             matrix.ScaleAt(deltaManipulation.Scale.X, deltaManipulation.Scale.Y, center.X, center.Y);
             matrix.RotateAt(e.DeltaManipulation.Rotation, center.X, center.Y);
             //matrix.Translate(e.DeltaManipulation.Translation.X, e.DeltaManipulation.Translation.Y);
             ((MatrixTransform)element.RenderTransform).Matrix = matrix;
         }
 
         private void StackPanel_ManipulationCompleted(object sender, ManipulationCompletedEventArgs e)
         {
             frameworkElement.Opacity = 1;
         }
 
         #region 坐标的相关变量定义
         double dx; //x轴方向的每次移动的距离
         double dy; //y轴方向每次移动的距离
 
         double tdx; //x轴方向的每次移动的总距离
         double tdy; //y轴方向的每次移动的总距离
 
         double opx; //旧的x轴的值
         double opy; //旧的y轴的值
 
         double npx; //新的x轴的值
         double npy; //新的y轴的值
         #endregion
 
         #region Touch事件
         private void myStackPanel_TouchDown(object sender, TouchEventArgs e)
         {
             if (isMouse) return;
             isTouch = true;
 
             tdx = 0;
             tdy = 0;
 
             Point p = e.GetTouchPoint(this).Position;
             opx = p.X;
             opy = p.Y;
         }
         private void myStackPanel_TouchMove(object sender, TouchEventArgs e)
         {
             if (isMouse) return;
 
             Point p = e.GetTouchPoint(this).Position; 
             npx = p.X;
             npy = p.Y;
             dx = npx - opx;
             dy = npy - opy;
             opx = npx;
             opy = npy;
 
             tdx += Math.Abs(dx);
             tdy += Math.Abs(dy);
             Move(dx, dy);
         }
         private void myStackPanel_TouchUp(object sender, TouchEventArgs e)
         {
             if (isMouse) return;
 
             if (tdx < 5 || tdy < 5)
             {
                 Click();
             }
 
             isTouch = false;
         }
         #endregion
 
         /// <summary>
         /// 移动frameElement方法
         /// </summary>
         /// <param name="dx"></param>
         /// <param name="dy"></param>
         private void Move(double dx,double dy) 
         {
             Matrix matrix = ((MatrixTransform)frameworkElement.RenderTransform).Matrix;
             matrix.Translate(dx, dy);
             this.frameworkElement.RenderTransform = new MatrixTransform(matrix);
         }
 
         /// <summary>
         /// Click触发的方法
         /// </summary>
         private void Click()
         {
             MessageBox.Show("U hurt me");
         }
 
         private void Window_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
         {
             if (isTouch) return;
             isMouse = true;
 
             tdx = 0;
             tdy = 0;
 
             frameworkElement.Opacity = 0.5;
             frameworkElement = (FrameworkElement)e.OriginalSource;
             isFrameworkElementSelect = true;
             Point p = e.GetPosition(this);
             opx = p.X;
             opy = p.Y;
            
         }
 
         private void Window_MouseMove(object sender, MouseEventArgs e)
         {
             if (isTouch) return;
             
             if (isFrameworkElementSelect)
             {
                 Point p = e.GetPosition(this);
                 npx = p.X;
                 npy = p.Y;
                 dx = npx - opx;
                 dy = npy - opy;
                 opx = npx;
                 opy = npy;
 
                 tdx += Math.Abs(dx);
                 tdy += Math.Abs(dy);
                 Move(dx, dy);
             }
         }
 
         private void Window_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
         {
             if (isTouch) return;
 
             frameworkElement.Opacity = 1;
             isFrameworkElementSelect = false;
             if (tdx < 5 || tdy < 5)
             {
                 Click();
             }
 
             isMouse = false;
         }
     }
 }

11/15/2012 初次整理