在 Wp7 中滚动缩放图像时长宽比发生变化

Question

我在滚动查看器中有一个图像。该图像上实现了捏入和捏出功能。 但是在滚动缩放的图像时，纵横比会发生变化，图像会失真。 在 xaml 之后：

 <ScrollViewer HorizontalScrollBarVisibility="Auto"  VerticalScrollBarVisibility="Auto" Name="scroller" >
            <Image  Name="image_new"   Visibility="Visible"    CacheMode="BitmapCache"   >
                <Image.RenderTransform >
                <CompositeTransform x:Name="transform"/>
                </Image.RenderTransform >
                <toolkit:GestureService.GestureListener>
                    <toolkit:GestureListener  Flick="OnFlick" PinchStarted="OnPinchStarted" PinchDelta="OnPinchDelta"  DoubleTap="Onimage_doubletap" Tap="Onimage_singletap" />

                </toolkit:GestureService.GestureListener>

            </Image>
        </ScrollViewer>

.cs 文件中的方法是：

  private void OnPinchStarted(object sender, PinchStartedGestureEventArgs e)
    {

        Point point0 = e.GetPosition(image_new, 0);
        Point point1 = e.GetPosition(image_new, 1);
        Point midpoint = new Point((point0.X + point1.X) / 2, (point0.Y + point1.Y) / 2);
        image_new.RenderTransformOrigin = new Point(midpoint.X / image_new.ActualWidth, midpoint.Y / image_new.ActualHeight);
        initialScale = transform.ScaleX;

    }

    private void OnPinchDelta(object sender, PinchGestureEventArgs e)
    {

        transform.ScaleX = Math.Max(Math.Min(initialScale * e.DistanceRatio, 3.0), 0.5);
        transform.ScaleY = Math.Max(Math.Min(initialScale * e.DistanceRatio, 3.0), 0.5);

    }

Answer 1

我认为这里的问题是您正在更改每个捏合手势的 RenderTransformOrigin，这会导致失真。我会尝试将 RenderTransformOrigin 固定在 0.5,0.5 以确保您获得均匀的比例。

我假设您正在移动原点以尝试放大/缩小用户开始手势的图像部分。为了实现这一点，我认为您需要使用户能够在放大后平移图像。

另外一点，比例因子总是相同的，所以你应该只计算一次，然后将它分配给 ScaleX 和 ScaleY。