使用 Gridsplitter-Functionality 排列项目的 Itemscontrol

Question

我需要一个水平或垂直堆叠项目的布局。每个项目应该由一个拆分器分隔，因此用户可以更改大小（如 VisualStudio 中的工具箱容器）项目来自模型，所以我需要一个 ItemsControl，我可以在其中设置 ItemsSource。

我的第一个想法是构建一个从 Grid 派生的 CustomControl。他们的我使用“OnVisualChildrenChanged”方法在添加新项目时做出反应。然后我想添加新的 Column-/Rowdefinitions（取决于它应该是水平的还是垂直的）。但这是第一个问题。当网格设置为 IsItemsHost="true" 时，我收到一个错误，说明 DefinitionsCollection 不可访问...

这是自定义控件中的 CodeSnipped，我尝试在其中添加一行。

 private void SetRows()
    {
       this.RowDefinitions.Add(new RowDefinition() { Height = GridLength.Auto };             
    }

    protected override void OnVisualChildrenChanged(DependencyObject visualAdded, DependencyObject visualRemoved)
    {
        base.OnVisualChildrenChanged(visualAdded, visualRemoved);
        SetRows();            
    }

编辑：

我想我现在找到了解决方案。

首先，我创建了一个派生自 ItemsControl 的 CustomControl。在他的模板中，我添加了一个网格而不插入一个 Itempresenter。现在我覆盖 OnItemsChange。当一个项目被添加到集合中时，我创建一个 FrameworkElement 并将 DataContext 设置为添加的项目，然后我将两个列定义添加到网格并将我的项目和一个 Gridsplitter 添加到网格。这很有效，现在我只需要从我的 Itemscontrol 中获取 ItemTemplate 即可在网格中使用它。

当我解决了最后一个问题时，我将添加一个小例子。

Answer 1

您可以创建一个 Stackpanel，并为每个元素创建一个内部的 Grid，其结构如下：

<StackPanel Orientation="Vertical">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <Button>Hallo</Button>
        <GridSplitter Height="5" Background="Transparent" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Grid.Row="0" ResizeDirection="Rows" ResizeBehavior="CurrentAndNext"/>
    </Grid>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <Button>Hallo</Button>
        <GridSplitter Height="5" Background="Transparent" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Grid.Row="0" ResizeDirection="Rows" ResizeBehavior="CurrentAndNext"/>
    </Grid>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <Button>Hallo</Button>
        <GridSplitter Height="5" Background="Transparent" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Grid.Row="0" ResizeDirection="Rows" ResizeBehavior="CurrentAndNext"/>
    </Grid>       
</StackPanel>

请注意，您一次只能调整一列的大小，但我确信您可以稍微改进一下。