WPF 动态添加控件（单选框）ListView、ListBox、ItemsControl

SJ15630070060

已于 2023-12-02 09:23:28 修改

阅读量3.3k

点赞数 10

文章标签： wpf xml

于 2023-10-27 09:10:22 首次发布

本文链接：https://blog.youkuaiyun.com/SJ15630070060/article/details/134062086

版权

文章讨论了根据衣物类型进行数据过滤时，ListView、ListBox和ItemsControl在布局上的优缺点，特别强调了ItemsControl的自适应性和无滚动条特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这次讲解主要是围绕个人的实际情况去简单做的效果分析和展示。

需求：根据衣物类型做数据的过滤条件，布局方式要求侧边垂直显示。

方法一：ListView

选中行和选中单选按钮是两种效果，做单选框、按钮、复选框用ListView不太合适。


            <ListView Name="itemControl">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Border BorderThickness="2" BorderBrush="Bisque">
                            <DockPanel>
                                <RadioButton x:Name="yiwuClass"  Width="44" GroupName="yw_class" >
                                    <TextBlock Name="textBlok" TextWrapping="Wrap" Padding="0" LineHeight="0.1" FontSize="20" Width="{Binding RelativeSource={RelativeSource Self},Path=FontSize}" Text="{Binding Name}"/>
                                </RadioButton>
                            </DockPanel>
                        </Border>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

方法二：ListBox

LIstBox在遍历出的控件高度会根据所添加的控件最高高度相对应的，导致留有很多空白区域。看起来很不乐观

            <ListBox Name="itemControl2" >
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="1"></UniformGrid>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <ListBox.ItemContainerStyle>
                    <Style TargetType="{x:Type ListBoxItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                    <Border BorderThickness="1" BorderBrush="DarkSeaGreen">
                                        <RadioButton x:Name="yiwuClass"  Width="44" GroupName="yw_class2">
                                            <TextBlock Name="textBlok" TextWrapping="Wrap" Padding="0"    LineHeight="0.1" FontSize="20" Width="{Binding RelativeSource={RelativeSource Self},Path=FontSize}" Text="{Binding Name}"/>
                                        </RadioButton>
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListBox.ItemContainerStyle>
            </ListBox>

方法三：ItemsControl

ItemsControl，是我最终使用的方式，并且ItemsControl默认是不带滚动条的，需要单独添加。

相对比方ListBox他的高度是自适应的。

            <ScrollViewer>
                <ItemsControl Name="itemControl1">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border BorderThickness="1" BorderBrush="Crimson">
                                <DockPanel>
                                    <RadioButton x:Name="yiwuClass"  Width="44" GroupName="yw_class1" >
                                        <TextBlock Name="textBlok" TextWrapping="Wrap" Padding="0"  LineHeight="0.1" FontSize="20" Width="{Binding RelativeSource={RelativeSource Self},Path=FontSize}" Text="{Binding Name}"/>
                                    </RadioButton>
                                </DockPanel>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>

以三个控件并没有做深度的研究，只是简单做了个效果展示，如果单独给以上某个控件设置属性或样式应该也是可以进行更改的。