Silverlight 3 - ScaleTransform 或其他放大画布的方法?

Posted

技术标签:

【中文标题】Silverlight 3 - ScaleTransform 或其他放大画布的方法?【英文标题】:Silverlight 3 - ScaleTransform or other method to zoom in a Canvas? 【发布时间】:2010-11-05 01:08:00 【问题描述】:

我需要能够使用鼠标滚轮放大和缩小画布。我已经成功设置了鼠标滚轮处理程序,并且目前正在使用 ScaleTransform 来应用缩放;但是,缩放不是以“直观”的方式完成的。

我正在尝试实现与您在 MultiScaleImage、Google Maps/Earth 或 Adob​​e Acrobat Reader 中看到的相同样式的“缩放”——但不是使用图像和控件。过渡不需要“平滑”或动画(除非它是一种更简单的方法),但功能需要相同。

任何想法或想法将不胜感激,并提前致谢!

编辑:我已经设法使用动画“平滑”缩放:

<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

但是,问题仍然存在,即它正在缩小左上角,而不是像谷歌地图这样的网站,缩放是“围绕”鼠标进行的。

【问题讨论】:

【参考方案1】:

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

示例代码如下 - deltaZoom 是您缩放的程度,centerX 和 centerY 是当前的缩放中心,ZoomSteps 是我们缩放的次数,mouseX 和 mouseY 是当前的鼠标位置:

_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 有时会导致奇怪的抖动)。

【讨论】:

以上是关于Silverlight 3 - ScaleTransform 或其他放大画布的方法?的主要内容,如果未能解决你的问题,请参考以下文章

Silverlight 3 - ScaleTransform 或其他放大画布的方法?

Silverlight 3:调整屏幕分辨率的技巧

第 3 方 Silverlight 网格控制

Silverlight 3 中 ItemContainerStyle 中的数据绑定问题

带有 WCF 服务的 Silverlight 3 -

在 Silverlight 3 中截取当前用户控件或任何 GUI 的屏幕截图