ManipulationDeltaEventArgs not firing for image element - WP8 - animation

Question

I have a list box defined as below in my xaml. Every item consists of a canvas with an image element inside it. I have declared ManipulationEvents for the image.
<ListBox x:Name="CategoryLB" SelectionChanged="CategoryClicked" Margin="0,131,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<Canvas Width='460' Height="130" Background="#FF0D6B97" Margin="10,10,10,10" >
<Image Width='480' Height="150" Source="{Binding Page}" Stretch="None" Opacity="1" CacheMode="BitmapCache"
ManipulationDelta="ImageManipulationDelta"
ManipulationCompleted="ImageManipulationCompleted"
ManipulationStarted="ImageManipulationStarted"/>
</Canvas>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The problem is ManipulationDelta is not fired at all. Only ManipulationStarted and ManipulationCompleted gets called and hence my animation does not get the translation values. Looks straightforward to me.
These are the ManipulationEvents
private void ImageManipulationStarted(object sender, ManipulationStartedEventArgs e)
{
FrameworkElement transformElement = ((FrameworkElement)sender) as FrameworkElement;
transformElement.SetHorizontalOffset(0);
}
private void ImageManipulationCompleted(object sender, ManipulationCompletedEventArgs e)
{
FrameworkElement transformElement = ((FrameworkElement)sender) as FrameworkElement;
if (Math.Abs(e.TotalManipulation.Translation.X) > transformElement.ActualWidth / 3)
{
if (e.TotalManipulation.Translation.X < 0.0)
{
ToDoItemDeletedAction(transformElement);
}
else
{
ToDoItemCompletedAction(transformElement);
}
}
else
{
ToDoItemBounceBack(transformElement);
}
}
private void ImageManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
FrameworkElement transformElement = ((FrameworkElement)sender) as FrameworkElement;
// handle the drag to offset the element
double offset = transformElement.GetHorizontalOffset().Value + e.DeltaManipulation.Translation.X;
transformElement.SetHorizontalOffset(offset);
}
Anything that Im missing here?

Answer 1

your code is all right but the problem is that the delta event will not fire on the emulator and i have tested your code both on emulator and device and its working fine on device so dont worry and test your code on device ....

Answer 2

i have done manipulation on image which goes something like this ..
I hope this might help you ..
<Image x:Name="imgViewer" CacheMode="BitmapCache" Source="/MetroImages/mapmetro.png" Stretch="Uniform">
<Image.RenderTransform>
<ScaleTransform x:Name="scaleTrans" ScaleX="2" ScaleY="2" CenterX="150" CenterY="200" />
</Image.RenderTransform>
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener
PinchStarted="GestureListener_PinchStart"
PinchDelta="GestureListener_PinchDelta"
PinchCompleted="GestureListener_PinchComplete"
DragStarted="GestureListener_DragStart"
DragDelta="GestureListener_DragDelta"
DragCompleted="GestureListener_DragCompleted"/>
</toolkit:GestureService.GestureListener>
</Image>
and then in eventhandlers
private readonly DispatcherTimer m_animationTimer = new DispatcherTimer() { Interval = TimeSpan.FromMilliseconds(10) };
private double _cx, _cy;
private void GestureListener_PinchStart(object sender, PinchStartedGestureEventArgs e)
{
Point p1 = e.GetPosition(imgViewer, 0);
Point p2 = e.GetPosition(imgViewer, 1);
scaleTrans.CenterX = (p1.X + ((p2.X - p1.X) / 2));
scaleTrans.CenterY = (p1.Y + ((p2.Y - p1.Y) / 2));
_cx = scaleTrans.ScaleX;
_cy = scaleTrans.ScaleY;
}
private void GestureListener_PinchDelta(object sender, PinchGestureEventArgs e)
{
// Compute new scaling factors
double cx = _cx * e.DistanceRatio;
double cy = _cy * e.DistanceRatio;
// If they're between 1.0 and 4.0, inclusive, apply them
if (cx >= 1.0 && cx <= 4.0 && cy >= 1.0 && cy <= 4.0)
{
if ((cy - 1) < 0.1 && (cx - 1) < 0.1)
cx = cy = 1;
scaleTrans.ScaleX = cx;
scaleTrans.ScaleY = cy;
}
}
private void GestureListener_PinchComplete(object sender, PinchGestureEventArgs e)
{
}
private void GestureListener_DragStart(object sender, DragStartedGestureEventArgs e)
{
}
private void GestureListener_DragDelta(object sender, DragDeltaGestureEventArgs e)
{
scaleTrans.CenterX = (scaleTrans.CenterX - e.HorizontalChange);
scaleTrans.CenterY = (scaleTrans.CenterY - e.VerticalChange);
if (scaleTrans.CenterX < 0)
{
scaleTrans.CenterX = 0;
}
else if (scaleTrans.CenterX > imgViewer.ActualWidth)
scaleTrans.CenterX = imgViewer.ActualWidth;
if (scaleTrans.CenterY < 0)
{
scaleTrans.CenterY = 0;
}
else if (scaleTrans.CenterY > imgViewer.ActualHeight)
scaleTrans.CenterY = imgViewer.ActualHeight;
}
private void GestureListener_DragCompleted(object sender, DragCompletedGestureEventArgs e)
{
}