[使用DeltaManipulation事件（收缩）缩小图像时图像消失]]

Question

我的要求是在WPF平台中进行缩放。为此，我根据自己的要求创建了一个简单的POC样本，可以将其复制。请在下面找到代码段

XAML：

<Grid>
    <Image x:Name="JPGImage"
           Source="TestImage.jpg"
           IsManipulationEnabled="True" 
           ManipulationDelta="Image_ManipulationDelta"
           ManipulationStarted="JPGImage_ManipulationStarted"
           ManipulationCompleted="JPGImage_ManipulationCompleted"/>
</Grid>
C＃：

private void Image_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
    System.Diagnostics.Debug.WriteLine(e.DeltaManipulation.Translation.X + " " + e.DeltaManipulation.Translation.Y);
    if (e.Manipulators.Count() > 1)
    {
        if (scale.ScaleX > 1.6 || scale.ScaleX < 0.5)
        {
            scale.ScaleX = 1;
            scale.ScaleY = 1;
            translation.X = 0;
            translation.Y = 0;
            this.JPGImage.RenderTransform = transformGroup;
        }
        else
        {
            if (isScale)
            {
                scale.ScaleX = previousCumlativeScale * e.DeltaManipulation.Scale.X;
                scale.ScaleY = previousCumlativeScale * e.DeltaManipulation.Scale.Y;
                var x = (e.ManipulationOrigin.X - previousXPosition) * (scale.ScaleX - 1);
                var y = (e.ManipulationOrigin.Y - previousYPosition) * (scale.ScaleY - 1);
                translation.X += x;
                translation.Y += y;
            }
            else
            {
                scale.ScaleX *= e.DeltaManipulation.Scale.X;
                scale.ScaleY *= e.DeltaManipulation.Scale.Y;
                translation.X += e.DeltaManipulation.Translation.X;
                translation.Y += e.DeltaManipulation.Translation.Y;
            }

            scale.CenterX = e.ManipulationOrigin.X;
            scale.CenterY = e.ManipulationOrigin.Y;
            this.JPGImage.RenderTransform = transformGroup;
        }

        previousCumlativeScale = scale.ScaleX;
        previousTranslateX = translation.X;
        previousTranslateY = translation.Y;
        previousXPosition = scale.CenterX;
        previousYPosition = scale.CenterY;
    }
    else
    {
        translation.X += e.DeltaManipulation.Translation.X;
        translation.Y += e.DeltaManipulation.Translation.Y;
    }
}
我的问题是

1. 如果我尝试使用捏缩小图像，则当其缩放值小于1时，图像会消失。

2. 缩放也不平滑

3. 此外，我已经在一定比例的缩放水平（如下所述）之后重新设置了缩放比例，因此图像无法正确重置。

C＃

         if (scale.ScaleX > 1.6 || scale.ScaleX < 0.5)
         {
            scale.ScaleX = 1;
            scale.ScaleY = 1;
            translation.X = 0;
            translation.Y = 0;
            this.JPGImage.RenderTransform = transformGroup;
         }
请从下面的链接中获取样本WPFZooming
我发现以下问题仅与github中的操纵事件有关https://github.com/Microsoft/dotnet/issues/575

您能帮我解决问题吗？。

提前感谢

Vignesh。

我的要求是在WPF平台中进行缩放。为此，我根据自己的要求创建了一个简单的POC样本，可以将其复制。请在XAML下面找到代码段：

不确定为什么您的代码看起来如此复杂。以下内容也适用，其中重点是处理Image元素的父元素上的ManipulationDelta：

<Canvas IsManipulationEnabled="True"
        ManipulationDelta="OnManipulationDelta">
    <Image Source="...">
        <Image.RenderTransform>
            <MatrixTransform x:Name="imageTransform"/>
        </Image.RenderTransform>
    </Image>
</Canvas>

使用此事件处理程序：

private void OnManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
    var origin = e.ManipulationOrigin;
    var delta = e.DeltaManipulation;
    var scale = (delta.Scale.X + delta.Scale.Y) / 2; // mean value

    var matrix = imageTransform.Matrix; // current transform matrix

    matrix.ScaleAt(scale, scale, origin.X, origin.Y);
    matrix.Translate(delta.Translation.X, delta.Translation.Y);

    imageTransform.Matrix = matrix; // new transform matrix
}
    

Answer 1

不确定为什么您的代码看起来如此复杂。以下内容也适用，其中重点是处理Image元素的父元素上的ManipulationDelta：

<Canvas IsManipulationEnabled="True"
        ManipulationDelta="OnManipulationDelta">
    <Image Source="...">
        <Image.RenderTransform>
            <MatrixTransform x:Name="imageTransform"/>
        </Image.RenderTransform>
    </Image>
</Canvas>