StezPet
StezPet

Reputation: 2450

Implementing multi touch and Pinch and zoom in windows phone 8

how i can implement pinch to zoom and multi-touch features in windows phone 8. In my application i add 3 image containers in a grid and i need to perform the above mentioned operation on my image. Please any one help me to implement the functionality in my application. Thanks in advance.

Stez

Upvotes: 3

Views: 2667

Answers (2)

Vovich
Vovich

Reputation: 321

my solution which works for both WP7.5 and WP8:

XAML code

<StackPanel  x:Name="Scroll" Margin="0">
                    <Image  CacheMode="BitmapCache" Name="FrontCover"   Source="{Binding FullCover}"  >
                        <Image.RenderTransform>
                            <CompositeTransform x:Name="transform" ScaleX="1" ScaleY="1"  />
                        </Image.RenderTransform>
                        <toolkit:GestureService.GestureListener>
                            <toolkit:GestureListener   PinchDelta="OnPinchDelta" PinchStarted="OnPinchStarted" DragDelta="OnDragDelta"  />
                        </toolkit:GestureService.GestureListener>
                    </Image>
            </StackPanel>

 double initialScale;

    private void OnPinchStarted(object sender, PinchStartedGestureEventArgs e)
    {
        initialScale = transform.ScaleX;
    }

    private void OnPinchDelta(object sender, PinchGestureEventArgs e)
    {
        var curZoom = initialScale * e.DistanceRatio;
        if (curZoom >= 1 && curZoom <= 3)
        {
            transform.ScaleX = curZoom;
            transform.ScaleY = curZoom;

        }
    }

    private void OnDragDelta(object sender, DragDeltaGestureEventArgs e)
    {
        transform.CenterX = (transform.CenterX - e.HorizontalChange);
        transform.CenterY = (transform.CenterY - e.VerticalChange);

        if (transform.CenterX < 0)
            transform.CenterX = 0;
        else if ( transform.CenterX > Scroll.ActualWidth)
            transform.CenterX = Scroll.ActualWidth;
        else if (transform.CenterX > (FrontCover.Height * transform.ScaleX))
            transform.CenterX = FrontCover.Height * transform.ScaleX;

        if (transform.CenterY < 0)
            transform.CenterY = 0;
        else if (transform.CenterY > Scroll.ActualHeight)
            transform.CenterY = Scroll.ActualHeight;
        else if (transform.CenterY > (FrontCover.Height * transform.ScaleY))
            transform.CenterY = FrontCover.Height * transform.ScaleY;

    }

Think it should help others

Upvotes: 1

ColinE
ColinE

Reputation: 70122

Try the following library from codeplex:

https://multitouch.codeplex.com/

It performs the calculations required to scale / rotate an image when it is pinched.

Upvotes: 2

Related Questions