使用带有Canvas作为ItemsPanel的ItemsControl和ScrollViewer

Question

我有一个ItemsControl，我将ItemsPanel设置为Canvas。Canvas需要能够根据我放入其中的内容动态调整大小，并且当内容超出控件边界时，我需要能够滚动。问题是我无法使内容滚动。我将滚动条可见性设置为自动，这样当内容超出边缘时就不会看到滚动条弹出。

我尝试将ItemsControl放在ScrollViewer中，并尝试在ItemsControl的模板中使用ScrollViewer。

以下是ScrollViewer内部的ItemsControl:

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
    <ItemsControl ItemsSource="{Binding Tiles}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

        <ItemsControl.ItemContainerStyle>
            <Style>
                <Setter Property="Canvas.Left" Value="{Binding Left}" />
                <Setter Property="Canvas.Top" Value="{Binding Top}" />
            </Style>
        </ItemsControl.ItemContainerStyle>

        <ItemsControl.ItemTemplateSelector>
            ...
        </ItemsControl.ItemTemplateSelector>
    </ItemsControl>
</ScrollViewer>

下面是带有ScrollViewer的模板：

<ItemsControl ItemsSource="{Binding Tiles}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Canvas.Left" Value="{Binding Left}" />
            <Setter Property="Canvas.Top" Value="{Binding Top}" />
        </Style>
    </ItemsControl.ItemContainerStyle>

    <ItemsControl.Template>
        <ControlTemplate>
            <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
                <ItemsPresenter />
            </ScrollViewer>
        </ControlTemplate>
    </ItemsControl.Template>

    <ItemsControl.ItemTemplateSelector>
        ...
    </ItemsControl.ItemTemplateSelector>
</ItemsControl>

这篇MSDN文章看起来很有前途，但是在我的代码中实现它，甚至用Canvas代替WrapPanel明确地实现它都没有效果（或者说，我无法让它工作）。

我也看了这篇文章，但解决方案对我不起作用，因为我需要Canvas能够随内容大小调整（否则滚动条总是可见的）。

提前感谢你的帮助！

- Ian Wold

Answer 1

如果没有显式设置，画布的宽度/高度将从ItemsControl继承。您期望的“动态调整大小”行为不是默认情况下面板大小和布局的工作方式。

您有以下选项：

1. 显式设置ItemsControl的宽度/高度。
2. 显式设置画布的宽度/高度。

- Michael G

---

啊，这正是我担心的事情。也许如果我在添加内容时计算画布内容的大小，并以此方式更新宽度/高度，那么它可能会起作用？编辑：确实如我所需，它可以工作。感谢你帮忙解决这个问题，迈克尔！ - Ian Wold