24

我有一个 Windows 通用应用程序,我在其中使用 DirectX 渲染场景。我想使用 Scrollviewer,因此我在 Scrollviewer 后面渲染我的场景,并希望根据 Scrollviewer 计算场景转换。到目前为止它工作正常,尤其是翻译和滚动。但是当我放大时,场景会在两种特殊情况下跳跃:

  1. 场景有足够的空间并且居中,现在需要滚动。
  2. 反方向。

我或多或少使用以下代码:

float zoom = scrollViewer.ZoomFactor;

float inverseZoom = 1f / scrollViewer.ZoomFactor;

float scaledContentW = Document.Size.X * scrollViewer.ZoomFactor;
float scaledContentH = Document.Size.Y * scrollViewer.ZoomFactor;

float translateX;
float translateY;

if (scaledContentW < scrollViewer.ViewportWidth)
{
    translateX = ((float)scrollViewer.ViewportWidth * inverseZoom - Document.Size.X) * 0.5f;
}
else
{
    translateX = -inverseZoom * (float)scrollViewer.HorizontalOffset;
}

if (scaledContentH < scrollViewer.ViewportHeight)
{
    translateY = ((float)scrollViewer.ViewportHeight * inverseZoom - Document.Size.Y) * 0.5f;
}
else
{
    translateY = -inverseZoom * (float)scrollViewer.VerticalOffset;
}

float visibleX = inverseZoom * (float)scrollViewer.HorizontalOffset;
float visibleY = inverseZoom * (float)scrollViewer.VerticalOffset; ;

float visibleW = Math.Min(Document.Size.X, inverseZoom * (float)scrollViewer.ViewportWidth);
float visibleH = Math.Min(Document.Size.Y, inverseZoom * (float)scrollViewer.ViewportHeight);

Rect2 visibleRect = new Rect2(visibleX, visibleY, visibleW, visibleH);

transform =
    Matrix3x2.CreateTranslation(
        translateX,
        translateY) *
    Matrix3x2.CreateScale(zoom);

你可以在这里得到一个例子:https ://github.com/SebastianStehle/Win2DZoomTest

为了确保我的眼睛没有被打破,我正在四处放大并将翻译和缩放值写入文件。在这里你可以看到它:

https://www.dropbox.com/s/9ak6ohg4zb1mnxa/Test.png?dl=0

列的含义如下:

第 1 列:变换矩阵的计算缩放值 (M11) = ScrollViewer.ZoomFactor 第 2 列:矩阵的计算 x 偏移量(见上文) 第 3 列:矩阵 * 向量 (500, 500) 结果的 x 值,这里:列 1 * 500 + 列 2

您会看到,矩阵值看起来不错,但是在应用转换时,您会在几毫秒内向右跳动。一种理论是,视口可能会因为滚动条变得可见而改变。但这种情况并非如此。我还在这里尝试了固定值,使滚动条可见,甚至为滚动查看器创建了一个自定义模板,根本没有滚动条。

顺便说一句:这是一个交叉帖子,我在这里也问过这个问题:https ://github.com/Microsoft/Win2D/issues/125

4

1 回答 1

6

您会看到这种行为,因为当您缩放大于ScrollViewer的大小时,缩放中心点会移动。要解决此问题,您只需订阅ScrollViewer'sLayoutUpdated事件并在处理程序内部,手动将其内容保持在中心。

    private void ScrollViewer_LayoutUpdated(object sender, object e)
    {
        this.ScrollViewer.ChangeView(this.ScrollViewer.ScrollableWidth / 2, this.ScrollViewer.ScrollableHeight / 2, this.ScrollViewer.ZoomFactor, true);
    }

这应该可以修复Win2DRectangle中绘制的两个s上的跳跃运动。


更新

只是为了证明我的观点,跳跃行为很可能是由于内容大小超过ScrollViewer. 所以我写了一些代码来在屏幕上记录这些值,如下所示 -

...
this.Test1.Text += ((float)translateX).ToString() + " ";
this.Test2.Text += ((float)translateY).ToString() + " ";

session.Transform =
    Matrix3x2.CreateTranslation(
        (float)translateX,
        (float)translateY) *
    Matrix3x2.CreateScale((float)zoom);

在此处输入图像描述

现在看看上图中的数字。我所做的是尝试放大直到出现跳跃的场景。看到突出显示的翻译 y值了吗?它略大于其先前的值,这与下降趋势相反。

因此,要解决此问题,您需要能够跳过由ScrollViewer.

于 2015-08-20T03:59:19.640 回答