放大画布的所有内容答案

【问题标题】：Zooming into all content of a Canvas放大画布的所有内容
【发布时间】：2015-05-14 11:22:33
【问题描述】：

我有这个 Xaml：

<Grid x:Name="DrawingGrid" Visibility="Collapsed">
        <AppBarButton x:Name="ExitDrawingButton" Icon="Cancel" Click="ExitDrawingButton_Click"></AppBarButton>
        <ScrollViewer x:Name="DScrollViewer" ManipulationMode="All"  MaxZoomFactor="2.0" MinZoomFactor="1.0" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden" DoubleTapped="DScrollViewer_DoubleTapped" Width="1140" Height="770">
            <Canvas x:Name="inkCanvas" Background="Transparent" Width="1140" Height="770">
                <StackPanel x:Name="DStackPanel" Orientation="Horizontal" Margin="0,0,0,0">
                    <Image x:Name="DImage0" HorizontalAlignment="Left"  Source="{Binding nextImage}" Width="570" Canvas.ZIndex="0"/>
                    <Image x:Name="DImage1" HorizontalAlignment="Left"  Source="{Binding nextImage}" Width="570" Canvas.ZIndex="0"/>
                </StackPanel>
            </Canvas>
        </ScrollViewer>
    </Grid>

我正在使用 CanvasManager.cs 类在Canvas 上绘图，它工作正常。现在我需要放大Canvas：将Canvas（墨水）和其中包含的内容（StackPanel + 图像）一起缩放。

在doubleTapping ScrollViewer 包含Canvas 我有这个方法：

 private async void DScrollViewer_DoubleTapped(object sender, DoubleTappedRoutedEventArgs e)
    {
        Point point = e.GetPosition(DScrollViewer);
        if (DScrollViewer.ZoomFactor == 1)
        {
            await Task.Delay(300);
            DScrollViewer.ChangeView(point.X, point.Y, 2.0F, false);
        }
        else
        {
            await Task.Delay(300);
            DScrollViewer.ChangeView(point.X, point.Y, 1.0F, false);
        }
    }

结果是：只有 Canvas（它的 Ink）在缩放，StackPanel 和它的图像留在原地，同样的比例，完好无损！

我做错了什么？

【问题讨论】：

我查看了您的演示，发现 Images 实际上位于不同的 ScrollViewer (LScrollViewer) 内，而 ScrollViewer (DScrollViewer) 负责缩放.这可能就是这些图像不受影响的原因。

标签： c# canvas windows-store-apps windows-8.1 scrollviewer

【解决方案1】：

您的错误是您为每个图像的宽度分配了一个恒定值 (Width="570")，因此除非您以编程方式更改其宽度，否则它永远不会放大或缩小。

更改图像宽度的最佳方法是为其绑定一个变量值，您可以创建一个转换器，将画布的宽度除以两个 (canvas.width / 2) 并将每个图像的宽度绑定到此转换器。 . 然后您的缩放将完美运行。

【讨论】：

不正确，我完全删除了图像的宽度，但我仍然遇到同样的问题。我认为 Canvas 隐藏了它下面的每个控件。