Silverlight几何缩放问题

时间:2013-10-18 12:44:41

标签: silverlight geometry zoom

如何使用geometry和ScaleTransform在Silverlight中实现缩放到特定点?你能建议一些算法让我能做到吗?我的逻辑错了。我认为通过设置缩放的中心点我会遇到一些麻烦。

这是我在xaml文件中的几何数据

<Canvas x:Name="LayoutRoot"  Background="Orchid" MouseWheel="PathDraw_OnMouseWheel">
  <Path x:Name="PathDraw" Stroke="Brown"  StrokeThickness="1" Margin="200,200,0,0">
    <Path.Data>
      <RectangleGeometry x:Name="rect"  Rect="80 80 80 80"/>
    </Path.Data>
  </Path>
</Canvas>

以下是缩放逻辑。

private static int ZoomSteps = 0;

    private static double centerX = 0;
    private static double centerY = 0;
    private double zoomCoeff = 1.1;

    private void PathDraw_OnMouseWheel(object sender, MouseWheelEventArgs e)
    {
        double delta = e.Delta;
        if (scaleX != 1)
        {
            scaleX = delta >= 0 ? scaleX * zoomCoeff : (scaleX <= 1 ? 1 : scaleX / zoomCoeff);
            scaleY = delta >= 0 ? scaleY * zoomCoeff : (scaleY <= 1 ? 1 : scaleY/zoomCoeff);
        }
        else
        {
            scaleX = scaleY = delta >= 0 ? zoomCoeff : 1;
        }

        scale = new ScaleTransform { ScaleX = scaleX, ScaleY = scaleY,
                                     CenterX = e.GetPosition(PathDraw).X,
                                     CenterY = e.GetPosition(PathDraw).Y

        };
        rect.Transform = scale;
    }

由于

1 个答案:

答案 0 :(得分:0)

不是在路径上有一个边距,而是一个具有固有偏移(矩形左上角在80,80)的几何图形,你应该使用两个变换将缩放与平移分开:

<Canvas x:Name="LayoutRoot"  Background="AliceBlue" MouseWheel="PathDraw_OnMouseWheel">
    <Path x:Name="PathDraw" Stroke="Brown" StrokeThickness="1">
        <Path.Data>
            <RectangleGeometry x:Name="rect" Rect="0 0 80 80">
                <RectangleGeometry.Transform>
                    <TransformGroup>
                        <ScaleTransform x:Name="scaleTransform"/>
                        <TranslateTransform x:Name="translateTransform"
                                            X="100" Y="100"/>
                    </TransformGroup>
                </RectangleGeometry.Transform>
            </RectangleGeometry>
        </Path.Data>
    </Path>
</Canvas>

这样你的MouseWheel事件处理程序变得如此简单:

private double zoomCoeff = 1.1;

private void PathDraw_OnMouseWheel(object sender, MouseWheelEventArgs e)
{
    var deltaScale = (e.Delta > 0) ? zoomCoeff : (1d / zoomCoeff);
    var position = e.GetPosition((UIElement)sender);
    var dx = position.X - translateTransform.X;
    var dy = position.Y - translateTransform.Y;

    translateTransform.X = position.X - deltaScale * dx;
    translateTransform.Y = position.Y - deltaScale * dy;
    scaleTransform.ScaleX *= deltaScale;
    scaleTransform.ScaleY *= deltaScale;
}

您现在也可以在MouseMove处理程序中独立操作转换以拖动矩形。