Question

我想在画布控件中缩放图像，保持画布的中心作为原点。最初我尝试使用Render变换它运行良好，但是在缩放后没有出现滚动条。我搜索了它并发现应该使用布局转换为了那个目的。我的问题是我现在在缩放后得到滚动条但缩放原点位于画布的左上角，我该如何将其设置为居中。

 <ScrollViewer HorizontalScrollBarVisibility="Auto"  VerticalScrollBarVisibility="Auto">
        <Canvas x:Name="grdMain" RenderTransformOrigin="0.5,0.5">

            <Image  Source="{Binding BmpImageSource,UpdateSourceTrigger=PropertyChanged}" x:Name="TargetImage" >
            </Image>



           <!-- <Canvas.RenderTransform>
                <TransformGroup>
                    <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}" />
                </TransformGroup>
            </Canvas.RenderTransform>-->
            <Canvas.LayoutTransform>
                <TransformGroup>
                    <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}" />
                </TransformGroup>
            </Canvas.LayoutTransform>



        </Canvas>
    </ScrollViewer>

有些建议说要在布局转换上设置centerX和centerY，但我的应用程序的大小是动态的，我可能没有固定中心点。

 <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}"  
         CenterX="250" CenterY="250"/>

Answer 1

有些建议说要在布局转换上设置centerX和centerY，但我的应用程序的大小是动态的，我可能没有固定中心点。

然后，您需要动态计算CenterX和CenterY属性的值。使用LayoutTransform时，您应该使用这些属性在控件的中心进行缩放。

例如，您可以处理Loaded的{{1}}事件，以便以编程方式应用Canvas：

LayoutTransform

<Canvas x:Name="grdMain" Loaded="grdMain_Loaded">...

通过布局变换将图像中心缩放为原点

1 个答案: