Question

我有一个问题，我希望你的注意事项。我有一个外部网格，它有两列。在第一列，我使用的是绑定到视图模型的ItemsControl（此视图模型用于动态创建按钮）。我有一个为物品模板定义的包裹pannel模板。第二列用于列表框。

我为视图模型中的按钮创建对象，并将其绑定到视图.requiremnet是如果窗口高度适合那么所有按钮应该出现在一个列中（一个在另一个下面），否则它应该来在两栏中。

如果有一列

1
2
3
4

如果有两列：

1 2
3 4

我的代码如下：

的ItemsControl：

<Grid>...
<ItemsControl ItemsSource="{Binding buttonsViewModelColl}"
           ItemsPanel="{StaticResource WrapPanelTemplateA}"
         ItemTemplate="{StaticResource ButtonsDataTempleteA}" Width="{Binding ActualWidth, ElementName=<OuterGrid>}" Grid.Row="2" HorizontalAlignment="Center"/>     
</Grid>

WrapPannelTemplete：

<ItemsPanelTemplate x:Key="WrapPanelTemplate">
             <WrapPanel/>
         </ItemsPanelTemplate>

DataTempleteForButton：

<DataTemplate x:Key="ButtonsDataTempleteA">
             <Button 
                            Content="{Binding Path=Text}" 
                            IsEnabled="{Binding Path=IsEnabled}"
                             Style="{StaticResource StyleButtonA}" 
                            FontFamily="Segoe UI Semibold"
                             HorizontalAlignment="Left" />
         </DataTemplate>

问题是在渲染时只能看到一个或两个按钮。如果我将WrapPannel方向设置为垂直全部，但它们不会自动换行。只有当我拉伸并延伸窗口宽度时才能看到。序列也不正确：

他们来了：

A C
B D

任何想法。

另一个问题：有没有办法可以在运行时根据XAML中的外部网格高度增加内部网格列的宽度？

Answer 1

我认为您需要的是UniformGrid而不是WrapPanel，因为您希望按钮的总数，整个容器的高度以及面板中的列数相互依赖。 Wrap Panel无法控制第三个因素（即面板中的列数）。

UniformGrid具有Rows和Columns属性，这些属性是完全可绑定的。它们可以与上述3个因子结合在一起，多值转换器可以根据一些自定义启发式算法确定要显示的行数和列数。

我希望这能指导你正确的方向。

Answer 2

我怀疑它与允许使用ItemsControl的Width有关。如果手动设置WrapPanel的宽度，它是否有效？

关于你的上一个问题，根据网格的高度设置列的宽度，你可以简单地绑定它。

<ColumnDefinition Width="{Binding ElementName=OuterGrid, Path=ActualHeight}" />

如果你需要对该值进行计算，我通常使用一个转换器，它接受Grid的高度参数，并将其转换为我想要的任何值。我实际上有一个MathConverter用于此类事情，因为我懒得为我想要的每个绑定计算编写自己的转换器，并且可以找到代码here

可以像：

一样使用

Width="{Binding ElementName=OuterGrid, Path=ActualHeight,
                Converter={StaticResource MathConverter},
                ConverterParameter=@VALUE/2}"

实际上，您可以使用MathConver设置Width的{{1}}，它应该可以正常工作。

动态添加按钮到ItemsControl

2 个答案: