如何在 WP7 中放大和缩小图像？答案

【问题标题】：How to zoom in and zoom out Images in WP7?如何在 WP7 中放大和缩小图像？
【发布时间】：2011-06-08 08:59:35
【问题描述】：

我已经制作了一个显示图像的应用程序。现在我想实现放大和缩小功能（通过使用两个指尖），就像在原生 Windows 手机照片查看器应用程序中一样。关于如何继续的任何想法。

提前致谢。

【问题讨论】：

目前提供了两个不错的选择

标签： c# silverlight silverlight-4.0 windows-phone-7

【解决方案1】：

也许最方便的方法是包含Silverlight for Windows Phone Toolkit。这包含一个GestureService，这将有助于捏合和旋转触摸手势。您可以将其应用于这样的图像：-

 <Image Source="someSourceUrl" RenderTransformOrigin="0.5, 0.5" CacheMode="BitmapCache">
     <Image.RenderTransform>
         <CompositeTransform x:Name="transform" />
     </Image.RenderTransform>
     <toolkit:GestureService.GestureListener>
         <toolkit:GestureListener PinchStarted="OnPinchStarted" PinchDelta="OnPinchDelta" />
     </toolkit:GestureService.GestureListener>
 </Image>

然后在代码隐藏中：-

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

    private void OnPinchDelta(object sender, PinchGestureEventArgs e)
    {
        transform.Rotation = initialAngle + e.TotalAngleDelta;
        transform.ScaleX = initialScale * e.DistanceRatio;
        transform.ScaleY = initialScale * e.DistanceRatio;
    }

【讨论】：

感谢您的回答。但是我是在代码中动态加载图像。那么是否可以完全在代码中完成上述过程？
@Vaysage：您仍然可以将其用于动态加载的图像。通常对于动态图像，您会将BitmapImage 的新实例分配给现有Image 控件的Source 属性，而不是卸载和加载Image 元素的实例。此时，您还需要将变换上的 Rotation 设置为 0，并将 ScaleX 和 ScaleY 设置为 1。
我通过拖动控制扩展了它，现在我可以将图像拖出窗口（通过拖动和捏合）有什么想法可以避免这种情况吗？
只是好奇。 “initialScale”和“initialAngle”在哪里定义，它们是什么类型？
@Pretzel：您可以将它们定义为主机页面中的字段，它们的类型分别与Rotation 和ScaleX 相同，我认为是双打。

【解决方案2】：

查看 Laurent Bugnion 的多点触控示例 - http://multitouch.codeplex.com/

【讨论】：

【解决方案3】：

如果你想要支持多点触控的简单图像查看器，我建议你使用WebBrowser控件来显示图像。

默认支持多点触控缩放和平滑滚动。但是您必须将文件从项目文件夹复制到隔离存储。以下是我的做法：

<Grid x:Name="LayoutRoot" Background="Transparent">
    <phone:WebBrowser 
        Name="MyWebBrowserControl"
        HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0" />
</Grid>

IsolatedStorageFile isf = IsolatedStorageFile.GetUserStoreForApplication();

        // if image file does not exist in isolated storage, copy it to there~!
        if (!isf.FileExists(filename))
        {
            StreamResourceInfo sr = Application.GetResourceStream(new Uri(filename, UriKind.Relative));
            using (BinaryReader br = new BinaryReader(sr.Stream))
            {
                byte[] data = br.ReadBytes((int)sr.Stream.Length);

                using (BinaryWriter bw = new BinaryWriter(isf.OpenFile(filename, FileMode.OpenOrCreate)))
                {
                    bw.Write(data);
                    bw.Close();
                }

                br.Close();
            }
        }

        Dispatcher.BeginInvoke(() => { MyWebBrowserControl.Navigate(new Uri(filename, UriKind.Relative)); });

※您必须将图像文件的Build Action设置为Content

【讨论】：

我没有证据，但我相信如果您只使用它来查看图像，WebBrowser 控件将是一个资源密集型控件。也就是说，如果它完成了工作......
@DanielBallinger // 我已经申请并发布了（用这种方式）。当然，我知道有利有弊。实现可缩放的图像查看器非常容易，但它可能会占用大量资源。决定权在你。
这对于某些用例来说是一种有效的方法，不应该被立即解雇。