• WPF ListView DataTemplate & ItemsControl


    效果如图:

    关键代码

    ListView的DataTemplate是一个单一折叠项的内容
    ItemsControl是一个列表的内容,之前列表使用DataGrid,但加载速度慢,所以改为ItemsControl

    <ListView Name="listView" HorizontalAlignment="Center" ItemsSource="{Binding }">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Expander Name="expander" Width="1400" ExpandDirection="Down" HorizontalAlignment="Stretch" IsExpanded="True">
                    <Expander.Header>
                        <TextBlock Text="{Binding DataModelEdition.TableChineseName}" FontWeight="Bold"/>
                    </Expander.Header>
                    <Expander.Content>
                        <Grid HorizontalAlignment="Stretch" Width="1400">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"></RowDefinition>
                                <RowDefinition Height="*"></RowDefinition>
                            </Grid.RowDefinitions>
                            <StackPanel Grid.Row="0" Orientation="Horizontal" Visibility="{Binding DataModelEdition.RowVisibility}">
                                <TextBlock Text="单选RadioButton" Margin="0,0,5,0"></TextBlock>
                                <RadioButton Content="RadioButton选择1" VerticalAlignment="Center" Margin="0,0,3,0" GroupName="{Binding DataModelEdition.GroupName}" IsEnabled="{Binding DataModelEdition.IsCanModify}" IsChecked="{Binding DataModelEdition.OneToOneIsChecked,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></RadioButton>
                                <RadioButton Content="RadioButton选择2" VerticalAlignment="Center" GroupName="{Binding DataModelEdition.GroupName}" IsEnabled="{Binding DataModelEdition.IsCanModify}" IsChecked="{Binding DataModelEdition.ManyToOneIsChecked,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></RadioButton>
                            </StackPanel>
                            <ItemsControl Grid.Row="1" Name="dataList" ItemsSource="{Binding DataModelItems}">
                                <ItemsControl.Template>
                                    <ControlTemplate TargetType="{x:Type ItemsControl}">
                                        <ControlTemplate.Resources>
                                            <Style TargetType="Border">
                                                <Setter Property="BorderThickness" Value="1"></Setter>
                                                <Setter Property="BorderBrush" Value="#e9e9ea"></Setter>
                                                <Setter Property="Background" Value="#bbc3de" />
                                            </Style>
                                            <Style TargetType="TextBlock">
                                                <Setter Property="FontSize" Value="14"></Setter>
                                                <Setter Property="VerticalAlignment" Value="Center"></Setter>
                                                <Setter Property="HorizontalAlignment" Value="Center"></Setter>
                                            </Style>
                                        </ControlTemplate.Resources>
                                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="True">
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition Height="Auto" />
                                                    <RowDefinition Height="*" />
                                                </Grid.RowDefinitions>
                                                <Grid Height="45">
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                        <ColumnDefinition Width="*" />
                                                    </Grid.ColumnDefinitions>
                                                    <Border Grid.Column="0">
                                                        <TextBlock  Text="显示字段1" />
                                                    </Border>
                                                    <Border Grid.Column="1">
                                                        <TextBlock  Text="显示字段2" />
                                                    </Border>
                                                    <Border Grid.Column="2">
                                                        <TextBlock  Text="下拉框1" />
                                                    </Border>
                                                    <Border Grid.Column="3" >
                                                        <TextBlock  Text="输入框1" />
                                                    </Border>
                                                    <Border Grid.Column="4" >
                                                        <TextBlock  Text="下拉框2" />
                                                    </Border>
                                                    <Border Grid.Column="5">
                                                        <TextBlock  Text="输入框2" />
                                                    </Border>
                                                    <Border Grid.Column="6">
                                                        <TextBlock  Text="输入框3" />
                                                    </Border>
                                                    <Border Grid.Column="7">
                                                        <TextBlock  Text="输入框4" />
                                                    </Border>
                                                    <Border Grid.Column="8">
                                                        <TextBlock  Text="输入框5" />
                                                    </Border>
                                                </Grid>
                                                <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Grid.Row="1">
                                                    <!--ItemTemplate数据-->
                                                    <ItemsPresenter></ItemsPresenter>
                                                </ScrollViewer>
                                            </Grid>
                                        </Border>
                                    </ControlTemplate>
                                </ItemsControl.Template>
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <DataTemplate.Resources>
                                            <Style TargetType="Border">
                                                <Setter Property="BorderThickness" Value="1"></Setter>
                                                <Setter Property="BorderBrush" Value="#e9e9ea"></Setter>
                                                <Setter Property="Background" Value="#ffffff" />
                                            </Style>
                                        </DataTemplate.Resources>
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="*" />
                                            </Grid.ColumnDefinitions>
                                            <Border Grid.Column="0">
                                                <TextBlock  Text="{Binding TableChineseName}" />
                                            </Border>
                                            <Border Grid.Column="1">
                                                <TextBlock  Text="{Binding FieldChineseName}" />
                                            </Border>
                                            <Border Grid.Column="2">
                                                <ComboBox Margin="5" SelectedItem="{Binding FillTypeSelectItem,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" ItemsSource="{Binding FillTypeEnumInfos}" DisplayMemberPath="Description" IsEnabled="{Binding IsCanFillTypeChange}"></ComboBox>
                                            </Border>
                                            <Border Grid.Column="3">
                                                <TextBox Text="{Binding SpecifiedValue,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" Visibility="{Binding IsSpecifiedValueVisibility,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}" IsEnabled="{Binding IsCanModify}"></TextBox>
                                            </Border>
                                            <Border Grid.Column="4">
                                                <ComboBox Margin="5" SelectedItem="{Binding IsUniqueKeySelectItem,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" ItemsSource="{Binding IsUniqueKeyEnumInfos}" DisplayMemberPath="Description" IsEnabled="{Binding IsCanIsUniqueKeyChange}"></ComboBox>
                                            </Border>
                                            <Border Grid.Column="5">
                                                <TextBox Text="{Binding MinCount,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" IsEnabled="{Binding IsCanModify}" Visibility="{Binding CountVisibility,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></TextBox>
                                            </Border>
                                            <Border Grid.Column="6">
                                                <TextBox Text="{Binding MaxCount,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" IsEnabled="{Binding IsCanModify}" Visibility="{Binding CountVisibility,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></TextBox>
                                            </Border>
                                            <Border Grid.Column="7">
                                                <TextBox Text="{Binding MinSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" IsEnabled="{Binding IsCanModify}" Visibility="{Binding SizeVisibility,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></TextBox>
                                            </Border>
                                            <Border Grid.Column="8">
                                                <TextBox Text="{Binding MaxSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" IsEnabled="{Binding IsCanModify}" Visibility="{Binding SizeVisibility,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></TextBox>
                                            </Border>
                                        </Grid>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </Grid>
                    </Expander.Content>
                </Expander>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
    

    示例代码

    ItemsControls

    参考资料

    ItemsControl 解析

  • 相关阅读:
    (参考)爬虫5-爬取中国大学排名情况
    005_软件安装之_常用办公软件
    004_软件安装之_Altium Designer
    001_基础硬件电路_二极管
    添加QQ群
    024_STM32程序移植之_ESP8266_TCP
    020_C语言常用函数
    004——转载C#禁止改变窗体大小
    003转载----C#打开网页
    002_Python基础学习网站
  • 原文地址:https://www.cnblogs.com/Lulus/p/13384389.html
Copyright © 2020-2023  润新知