带 Canvas 的 ScrollViewer，自动调整画布大小以适应内容（包括负空间）

Question

我在滚动查看器中有一个画布。 为了能够使用滚动查看器，我重写了 Canvas 的 MeasureOverride 方法以返回所有子项的大小。

这工作得很好，只是画布只能包含正空间中的项目，以便滚动查看器正常工作。

我希望用户能够拖动元素，而不受它们必须位于画布原点的正侧的限制。

所以基本上我希望能够将元素定位在任何地方，例如 (-200, 10) 或 (500, -20) ，并且能够从最左边的元素 (-200) 滚动到最右边的元素 (500) ，并从上到下。

让事情变得复杂的是，可以使用 LayoutTransform 缩放画布，并且我想在滚动条中包含视图区域，因此滚动条不仅考虑子项的最小/最大边界，而且还考虑子项的最小/最大边界。 /当前视图区域的最大值。

有人知道如何进行这项工作吗？

Answer 1

今天我只解决了这个问题:)
很高兴分享有效的代码：

public void RepositionAllObjects(Canvas canvas)
{
    adjustNodesHorizontally(canvas);
    adjustNodesVertically(canvas);
}

private void adjustNodesVertically(Canvas canvas)
{
    double minLeft = Canvas.GetLeft(canvas.Children[0]);
    foreach (UIElement child in canvas.Children)
    {
        double left = Canvas.GetLeft(child);
        if (left < minLeft)
            minLeft = left;
    }

    if (minLeft < 0)
    {
        minLeft = -minLeft;
        foreach (UIElement child in canvas.Children)
            Canvas.SetLeft(child, Canvas.GetLeft(child) + minLeft);
    }
}

private void adjustNodesHorizontally(Canvas canvas)
{
    double minTop = Canvas.GetTop(canvas.Children[0]);
    foreach (UIElement child in canvas.Children)
    {
        double top = Canvas.GetTop(child);
        if (top < minTop)
            minTop = top;
    }

    if (minTop < 0)
    {
        minTop = -minTop;
        foreach (UIElement child in canvas.Children)
            Canvas.SetTop(child, Canvas.GetTop(child) + minTop);
    }
}

现在调用 RepositionAllObjects 方法根据需要重新对齐对象。

当然，您需要拥有自己的从 Canvas 派生的画布。并且此方法是必需的（如果您愿意，您可以调整它）：

    public static Rect GetDimension(UIElement element)
    {
        Rect box = new Rect();
        box.X = Canvas.GetLeft(element);
        box.Y = Canvas.GetTop(element);
        box.Width = element.DesiredSize.Width;
        box.Height = element.DesiredSize.Height;
        return box;
    }

    protected override Size MeasureOverride(Size constraint)
    {
        Size availableSize = new Size(double.PositiveInfinity, double.PositiveInfinity);
        double minX = 900000; //some dummy high number
        double minY = 900000; //some dummy high number
        double maxX = 0;
        double maxY = 0;

        foreach (UIElement element in this.Children)
        {
            element.Measure(availableSize);

            Rect box = GetDimension(element);
            if (minX > box.X) minX = box.X;
            if (minY > box.Y) minY = box.Y;
            if (maxX < box.X + box.Width) maxX = box.X + box.Width;
            if (maxY < box.Y + box.Height) maxY = box.Y + box.Height;
        }

        if (minX == 900000) minX = 0;
        if (minY == 900000) minY = 0;

        return new Size { Width = maxX - minX, Height = maxY - minY };
    }

现在，您需要做的就是将此画布包装在滚动查看器中。

希望有帮助！

Answer 2

我认为 ScrollViewer 假设原点位于 (0, 0) ——毕竟，没有办法告诉它； Canvas 是唯一知道指定非零原点的面板。

一个简单的选择可能是忘记 ScrollViewer，并实现您自己的平移功能 - 可能通过拖动，或者可能在视图左侧有一个大的“向左滚动”按钮，在右侧有一个“向右滚动”按钮等等——并通过内容的转换来实现它。

但如果您需要坚持使用经典的滚动条隐喻，我认为您可以制作自己的面板（或也覆盖 ArrangeOverride，这相当于同一件事）并偏移所有位置 - 使它们从零开始。因此，如果您在 (20, -20) 处有一个元素，在 (0, 5) 处有另一个元素，则需要将所有元素向下偏移 20，以使其适合从零开始的空间；当您布置孩子时，第一个将位于 (20, 0)，第二个将位于 (0, 25)。

但现在滚动很奇怪。如果用户一直滚动到底部，并将某些内容拖离底部边缘，视图将保持不变；与右边相同。但是，如果它们一直滚动到顶部，并将某些内容拖离顶部边缘，突然所有内容都会向下跳跃，因为 ScrollViewer 的 VerticalOffset 之前为零，现在仍然为零，但由于布局偏移，零意味着不同的东西。

您也许可以通过绑定 Horizo​​ntalOffset 和 VerticalOffset 来解决滚动问题。如果您的 ViewModel 自动修复了这些属性（并触发了 PropertyChanged< /a>) 每当控件移动到“负”时，您就可以使视图滚动到相同的逻辑内容，即使您现在告诉 WPF 的布局引擎一切都在其他地方。即，您的 ViewModel 将跟踪逻辑滚动位置（零，在将元素拖动为负之前），并将从零开始的滚动位置报告给 ScrollViewer （因此在拖动之后，您将告诉 ScrollViewer 它的 VerticalOffset 现在是 20 ）。