Hi,
I am developing the "touch application", where the user can drag and drop from the tool box and after dropping, they can move it around the canvas. (like moving from one position to another position (Translation) and rotating it etc.)
For drag and drop, I am using "Touch Down" and "Drop" events, and for the moving it around, i am using
Manipulations events.
I am using Matrix Transformation, for supporting rotation, translation in the canvas.
While dropping, will get only Mouse Coordinates from the parameter "e" in the Drop Event handlers.
But I have to convert the mouse coordinate points into the equivalent Matrix value, then only, I can able to bind it to the exact location.
Note: I am not using Canvas.Left and Canvas.Right to display the items. It is having the Matrix transform, and so if i get the matrix value, then I can easily do it.
I have searched to do the Drag and drop with the help of manipulation events, But I am unable to do!.
The code which i have used is given below:-
<StackPanel IsManipulationEnabled="True" Tag="{Binding}" TouchDown="StackPanel_TouchDown" /><ItemsControl ItemsSource="{Binding DataContainer}" x:Name="MainDataContentHolder" ><ItemsControl.ItemsPanel><ItemsPanelTemplate><Canvas x:Name="canvMain" Drop="canvMain_Drop" AllowDrop="True" ></Canvas></ItemsPanelTemplate></ItemsControl.ItemsPanel><ItemsControl.ItemTemplate><DataTemplate><Image Loaded="TargetImage_Loaded" Source="{Binding ImagePath}" Tag="{Binding}" IsManipulationEnabled="True" StylusSystemGesture="TargetImage_StylusSystemGesture" ManipulationInertiaStarting="TargetImage_ManipulationInertiaStarting" ManipulationStarting="TargetImage_ManipulationStarting" ManipulationDelta="TargetImage_ManipulationDelta"><Image.RenderTransform><MatrixTransform x:Name="MatrixRotationTransform" /></Image.RenderTransform></Image></DataTemplate></ItemsControl.ItemTemplate></ItemsControl>
private void StackPanel_TouchDown(object sender, TouchEventArgs e) { StackPanel senderObj = sender as StackPanel; if (senderObj != null) { DragDrop.DoDragDrop(senderObj, senderObj.Tag, DragDropEffects.Copy); } e.Handled = true; } private void canvMain_Drop(object sender, DragEventArgs e) { double XPos = e.GetPosition(GlobalImageContainer).X; double YPos = e.GetPosition(GlobalImageContainer).Y; Point targetPoint = new Point(XPos, YPos); Holder targetImage = e.Data.GetData(typeof(Holder)) as Holder;
//How to achieve it here***
if (targetImage != null) { (DataContext as MainVM).AddToMainContainer(targetImage.ImagePath, targetImage.ImageName, XPos, YPos); } } /*Since I am adding data to the “DataContainer” and it is bounded, The image will be created , and so, it will automatically launch the Image_Loaded event. There I have to calculate the Matrix value instead of the given Mouse X and Y coordinates. */ private void TargetImage_Loaded(object sender, RoutedEventArgs e) { Image targetImg = sender as Image; if (targetImg != null) { Holder targetData = targetImg.Tag as Holder; if (targetData != null) {
MatrixTransform matTrans = targetImg.RenderTransform as MatrixTransform; if (matTrans != null) { matTrans.Matrix = new Matrix(targetData.M11, targetData.M12, targetData.M21, targetData.M22, targetData.OffSetX, targetData.OffSetY); } } } }
Here is the snap, of what I am doing.
I can get this transformation value inside the "Manipulation Delta" event handlers , but this is hooked only after the drag and drop. I have also tried to achieve the drag and drop using the manipulations but i am unable.
If i have done it, then all values i can get from the "Manipulation Delta" event handler as told earlier.
May I kindly know how to achieve this,or is there any other way to get the matrix value or is there any way to achieve the drag and drop instead of "Touch Down" and "Drop" and by using the Manipulation events.?
Thanks in advance.
NANDAKUMAR.T