WPF MVVM中的项控件

Question

我正在使用WPF技术，通过一个ItemsControl控件在UI界面上显示一个类的列表。

我的代码如下：

<ItemsControl ItemsSource="{Binding Path=UsecaseListItems}" >

            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <WrapPanel>
                    <CheckBox IsChecked="{Binding Path=IsSelected,UpdateSourceTrigger=PropertyChanged, Mode=TwoWay,IsAsync=True}"

                                Margin="2,5"/>
                        <Button  Content="{Binding UsecaseName}"

                                Margin="2,5"/>
                    </WrapPanel>
                </DataTemplate>

            </ItemsControl.ItemTemplate>

        </ItemsControl>

现在我想在列表顶部为两个列（Select all 和 UseName）添加标题。我该怎么做？

- ankita kumari

---

由于每个项目的模板都有自己的包装面板，我认为谈论“列”是错误的。特别是您的按钮内容已绑定。也许您应该考虑使用ListView而不是ItemsControl。 - Grx70

Answer 1

以下是解决方案（不是一个好的解决方案，但我想更糟糕的设计也是可能的），请在您的代码中更改bindings： XAML：

<ItemsControl ItemsSource="{Binding Path=list}" >
    <ItemsControl.Template>
        <ControlTemplate>
            <StackPanel Orientation="Vertical">                   
                <Border BorderThickness="5" BorderBrush="DarkGray">
                    <StackPanel Orientation="Horizontal">
                        <Button Content="Select All" Width="80" HorizontalAlignment="Stretch"/>
                        <Button Content="User name" Width="80" HorizontalAlignment="Stretch"/>
                    </StackPanel>
                </Border>
                <Border BorderThickness="5" BorderBrush="LightGray">
                    <ItemsControl ItemsSource="{Binding RelativeSource={RelativeSource Mode=TemplatedParent},Path=ItemsSource}">

                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <WrapPanel>
                                    <CheckBox IsChecked="{Binding Path=DeviceState,UpdateSourceTrigger=PropertyChanged, Mode=TwoWay,IsAsync=True}"
                                    HorizontalAlignment="Stretch" Width="100" Margin="2,5"/>
                                    <Button  Content="{Binding Name}" HorizontalAlignment="Stretch" Width="100" Margin="2,5"/>
                                </WrapPanel>
                            </DataTemplate>

                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </Border>
            </StackPanel>
        </ControlTemplate>
    </ItemsControl.Template>
</ItemsControl>

输出

为什么你想把按钮作为标题？你不能把按钮放在 ItemsControl 外面吗？

- Kylo Ren

Answer 2

根据你的需求，最好使用 ListView 控件而不是 ItemsControl。

这里是一个示例。.

<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="checkboxHeaderTemplate">
            <CheckBox Checked="CheckBox_Checked">  //add command for MVVM
            </CheckBox>
        </DataTemplate>

        <DataTemplate x:Key="CheckBoxCell">
            <CheckBox  IsChecked="{Binding Path=IsSelected, Mode=TwoWay}" >                    
            </CheckBox>
        </DataTemplate>

        <DataTemplate x:Key="ButtonCell">
            <Button  Content="{Binding Path=UsecaseName, Mode=TwoWay}" >
            </Button>
        </DataTemplate>
    </Grid.Resources>

    <ListView ItemsSource="{Binding Path=UsecaseListItems}" >
        <ListView.View>
            <GridView>
                <GridView.Columns>
                    <GridViewColumn HeaderTemplate="{StaticResource checkboxHeaderTemplate}"
                                        CellTemplate="{StaticResource CheckBoxCell}" Width="auto">
                    </GridViewColumn>

                    <GridViewColumn HeaderTemplate="{StaticResource checkboxHeaderTemplate}"
                                        CellTemplate="{StaticResource ButtonCell}" Width="auto">
                    </GridViewColumn>
                </GridView.Columns>
            </GridView>
        </ListView.View>
    </ListView>
</Grid>

希望能有所帮助。

- Gopichandar