Windows 8.1 Metro应用程序-缩小和缩放图像

本文关键字:缩小 缩放 图像 应用程序 Metro Windows | 更新日期: 2023-09-27 18:00:11

在Windows 8.1中,是否有任何方法可以实现XAML中的图像控件的缩放,我正在尝试Manipulation delta事件。但该事件没有被触发,我还尝试将ManipulationMode设置为"All"。

<Image x:Name="kn" ManipulationMode="All" ManipulationDelta="kn_ManipulationDelta" HorizontalAlignment="Center" VerticalAlignment="Center" Height="315" Width="360" RenderTransformOrigin="0.5, 0.5">
  <Image.RenderTransform>
  <CompositeTransform></CompositeTransform>
  </Image.RenderTransform>
</Image>

并且在cs文件中

private void kn_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
 UIElement element = sender as UIElement;
 CompositeTransform transform = element.RenderTransform as CompositeTransform;
 if (transform != null)
 {
 transform.ScaleX *= e.Delta.Scale;
 transform.ScaleY *= e.Delta.Scale;
 transform.Rotation += e.Delta.Scale / Math.PI;
 transform.TranslateX += e.Delta.Translation.X;
 transform.TranslateY += e.Delta.Translation.Y;
 }
}

有什么我必须设置的吗。或者我必须走另一条路?

Windows 8.1 Metro应用程序-缩小和缩放图像

您可以通过使用ScrollViewer控件包装图像来轻松实现这一点。

<ScrollViewer ZoomMode="Enabled">
    <Image ............ />
</ScrollViewer>

在XAML中,使您的代码如下所示。。

<ScrollViewer x:Name="scrl" ZoomMode="Enabled" HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" SizeChanged="OnSizeChanged" MinZoomFactor="1">
        <Canvas MaxWidth="1400" Background="AliceBlue" RenderTransformOrigin="0.5,0.5" x:Name="Main" DoubleTapped="Main_OnDoubleTapped">
            <Image Source="Assets/Floorplan.gif" Canvas.Left="358" Canvas.Top="84"></Image>
        </Canvas>
    </ScrollViewer>

然后在代码后面。。

 private void OnSizeChanged(Object sender, SizeChangedEventArgs args) {
        Main.Width = scrl.ViewportWidth;
        Main.Height = scrl.ViewportHeight;


    }

说明:你会看到,我把图像包在画布里,然后把画布包在滚动查看器里。然后滚动查看器中的事件为SizeChanged=OnSizeChanged。在画布后面的代码中,宽度和高度设置为滚动查看器的ViewportWidth和ViewportHeight。只需按照代码将图像更改为您想要的图像即可查看结果。希望这能解决你的问题。