Question

我想制作一个小银色应用程序，它显示一个相当大的图像，可以通过滚动鼠标放大，然后用鼠标平移。它类似于谷歌地图中的功能，我不想使用deepzoom。

这是我目前所拥有的。请记住，这是我的第一个silverlight应用程序：这个应用程序只是让我看到它是一个建立在一个网站的好方法。所以它是一个演示应用程序，因此有不好的变量名称。

初始图像宽度为1800px。

    private void sc_MouseWheel(object sender, MouseWheelEventArgs e)
    {
        var st = (ScaleTransform)plaatje.RenderTransform;
        double zoom = e.Delta > 0 ? .1 : -.1;
        st.ScaleX += zoom;
        st.ScaleY += zoom;
    }

这可行，但可以使用一些平滑，它位于左上角，不居中。

平移是这样的：发现它@ Pan & Zoom Image 并将其转换为以下内容以在silverlight中工作

    Point start;
    Point origin;
    bool captured = false;

    private void plaatje_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        plaatje.CaptureMouse();
        captured = true;
        var tt = (TranslateTransform)((TransformGroup)plaatje.RenderTransform)
            .Children.First(tr => tr is TranslateTransform);
        start = e.GetPosition(canvasje);
        origin = new Point(tt.X, tt.Y);
    }

    private void plaatje_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
    {
        plaatje.ReleaseMouseCapture();
        captured = false;
    }

    private void plaatje_MouseMove(object sender, MouseEventArgs e)
    {
        if (!captured) return;

        var tt = (TranslateTransform)((TransformGroup)plaatje.RenderTransform).Children.First(tr => tr is TranslateTransform);
        double xVerschuiving = start.X - e.GetPosition(canvasje).X;
        double yVerschuiving = start.Y - e.GetPosition(canvasje).Y;
        tt.X = origin.X - xVerschuiving;
        tt.Y = origin.Y - yVerschuiving;
    }

因此缩放不平滑且平移无效，因为当我点击它时，图像会消失。

Answer 1

我注意到的第一件事是：

var st = (ScaleTransform)plaatje.RenderTransform;

和

(TransformGroup)plaatje.RenderTransform

。所以在一个处理程序中，你将“plaatje.RenderTransform”转换为ScaleTransform，而另一个则转换为TransformGroup？这可能会导致异常，使您的图像消失。

对于缩放部分，您可能想尝试将要缩放的对象的 RenderTransformOrigin （“plaatje”？）设置为“0.5,0.5”，这意味着UI元素的中心。因此，图像将围绕其中心点而不是左上角进行缩放。

干杯，亚历克斯

使用鼠标滚轮滚动并使用平移缩放图像

1 个答案: