从 MVVM 动态添加控件到视图

Question

在WPF中，我正在使用MVVM模型。

我有一个视图，其中包含一个Dockpanel，我想通过绑定动态添加StackPanels，为所有发现的硬盘添加Label和TextBox。

因此，我的XAML如下所示：

<DockPanel Grid.Row="1" HorizontalAlignment="Stretch" Margin="5">
       <ItemsControl ItemsSource="{Binding Harddisks}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <StackPanel DockPanel.Dock="Right" HorizontalAlignment="Right" Margin="2.5,0,0,0">
                        <Label Content="{Binding Path=Label}" />
                        <TextBox Text="{Binding Path=GB_Free}" Width="100" IsReadOnly="True"/>
                    </StackPanel>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>

应该有四个标签和文本框，但只显示第一个标签和文本框。为什么？

- boomchickawah

---

您可以使用像Snoop这样的工具来检查运行时的元素，以了解发生了什么。当某些内容未按预期呈现时，我发现它非常有价值。http://snoopwpf.codeplex.com - Brent Stewart

Answer 1

您在ItemsControl中的项目实际上不是DockPanel的直接子元素。 您需要更改ItemsControl以指定DockPanel为Panel。 以下将导致ItemsControl创建一个DockPanel并将所有项目放置在其中（而不是ItemsControl默认使用的StackPanel）。

更多信息：MSDN：ItemsControl.ItemsPanel属性

   <ItemsControl ItemsSource="{Binding Harddisks}">
        <ItemsControl.ItemsPanel>
            <DockPanel Grid.Row="1" HorizontalAlignment="Stretch" Margin="5" />
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel DockPanel.Dock="Right" HorizontalAlignment="Right" Margin="2.5,0,0,0">
                    <Label Content="{Binding Path=Label}" />
                    <TextBox Text="{Binding Path=GB_Free}" Width="100" IsReadOnly="True"/>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

- Duane

---

好的，看起来它能够工作并且所有的标签和文本框都被显示了。但是有一个奇怪的效果。现在我在左侧有3个标签和文本框，而最后一个标签和文本框在右侧。这是什么原因呢？好的，我通过改变水平对齐方式解决了它。 - boomchickawah