Silverlight 3 - ScaleTransform或其他方法放大Canvas？ [英] Silverlight 3 - ScaleTransform or other method to zoom in a Canvas?

问题描述

我需要能够使用鼠标滚轮放大和缩小Canvas。我已经成功设置鼠标滚轮处理程序，我目前正在使用ScaleTransform应用缩放;然而，缩放不是以直观的方式进行的。

I need to be able to zoom in and out of a Canvas using the mousewheel. I have successfully set up the mouse wheel handlers and am currently using a ScaleTransform to apply the zoom; however, the scaling is not done in an "intuitive" way.

我试图完成与MultiScaleImage，Google地图/地球或Adobe Acrobat Reader相同的缩放风格，图像，与控件。转换不需要是平滑或动画（除非是更容易的方法），但功能需要相同。

I'm trying to accomplish the same style of "zooming" as you can see in MultiScaleImage, Google Maps/Earth, or Adobe Acrobat Reader--but NOT with an image, with a control. The transition doesn't need to be "smooth" or animated (unless it's an easier approach), but the functionality needs to be the same.

任何想法或想法都会受到高度赞赏和预先感谢！

Any thoughts or ideas would be highly appreciated and thanks in advance!

编辑：使用动画平滑缩放：

I've managed to "smooth" the zoom using animation:

<Canvas.Resources>
            <Storyboard x:Name="ZoomStoryboard">
                <DoubleAnimation x:Name="ZoomAnimationX"
                                 Storyboard.TargetName="Workspace"
                                 Storyboard.TargetProperty="Canvas.RenderTransform.ScaleTransform.ScaleX"
                                 Duration="0:0:0.2"/>
                <DoubleAnimation x:Name="ZoomAnimationY"
                                 Storyboard.TargetName="Workspace"
                                 Storyboard.TargetProperty="Canvas.RenderTransform.ScaleTransform.ScaleY"
                                 Duration="0:0:0.2"/>
            </Storyboard>
        </Canvas.Resources>

使用以下代码：

_Zoom += (args.Delta / 7);
if (_Zoom < 0.15)
    _Zoom = 0.15;
ZoomAnimationX.To = _Zoom;
ZoomAnimationY.To = _Zoom;
ZoomStoryboard.Begin();
ZoomScale.Text = _Zoom.ToString("0.00") + "x";
_PreviousMousePosition = _CurrentMousePosition

但是，问题仍然出现，左下角，而不是像谷歌地图的缩放是周围的鼠标的网站。

However, the issue still arises that it is zooming out of the top-left corner, as opposed to sites like Google Maps where the zoom is "around" the mouse.

推荐答案

您需要使用加权平均值作为基于鼠标位置的缩放中心。换句话说，保持最新的缩放中心（或者如果您还没有将其设置为当前鼠标位置），并保持缩放中心的计算次数（在第一次缩放后为1） 。每次重新计算缩放中心时，请增加该变量。

You need to use a weighted average as the zoom center based on the mouse position. In other words, keep the latest zoom center (or if you don't have one yet just set it to the current mouse position) and keep the number of times the zoom center was calculated (after the first zoom, that would be 1). Than each time you recalculate the zoom center, increment that var.

示例代码关注 - deltaZoom是缩放量，centerX和centerY是当前缩放中心， ZoomSteps是我们放大的次数，mouseX和mouseY是当前的鼠标位置：

Example Code Follows - deltaZoom is how much you're zooming, centerX and centerY are the current zoom center, ZoomSteps is the number of times we've zoomed, and mouseX and mouseY are the current mouse position:

_Zoom += deltaZoom;
        if (_Zoom <= 0)
            _Zoom = 0.1;

        if (deltaZoom >= 0)
        {
            if (_ZoomSteps == -1)
            {
                _CenterX = 0;
                _CenterY = 0;
                _ZoomSteps = 0;
            }
            else
            {
                _CenterX = (_CenterX * Math.Abs(_ZoomSteps) + mouseX) / (Math.Abs(_ZoomSteps + 1));
                _CenterY = (_CenterY * Math.Abs(_ZoomSteps) + mouseY) / (Math.Abs(_ZoomSteps + 1));
                _ZoomSteps++;
            }
        }
        else
        {
            if (_ZoomSteps == 1)
            {
                _CenterX = 0;
                _CenterY = 0;
                _ZoomSteps = 0;
            }
            else
            {
                _CenterX = (_CenterX * Math.Abs(_ZoomSteps) - mouseX) / (Math.Abs(_ZoomSteps - 1));
                _CenterY = (_CenterY * Math.Abs(_ZoomSteps) - mouseY) / (Math.Abs(_ZoomSteps - 1));
                _ZoomSteps--;
            }
        }

        ZoomAnimationX.To = _Zoom;
        ZoomAnimationY.To = _Zoom;
        CenterAnimationX.To = Math.Abs(_CenterX);
        CenterAnimationY.To = Math.Abs(_CenterY);
        ZoomStoryboard.Begin();

编辑，以便您可以降低到1.0以下的缩放级别，但仍然有一些问题（ZoomStep = -1 ，0或1有时会导致奇怪的摇晃）。

Edited so that you can drop below 1.0 zoom level but there are still some problems (ZoomStep = -1, 0 or 1 sometimes cause weird shakes).

这篇关于Silverlight 3 - ScaleTransform或其他方法放大Canvas？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！