wpf 实现DataGrid的表格嵌套

<UserControl
    x:Class="NavTest.Views.Page5"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:cv="clr-namespace:NavTest.Components"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:dp="clr-namespace:NavTest.Assets.Dp"
    xmlns:hc="https://handyorg.github.io/handycontrol"
    xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
    xmlns:local="clr-namespace:NavTest.Views"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mv="clr-namespace:NavTest.ViewModels"
    d:DataContext="{d:DesignInstance mv:Page5ViewModel}"
    d:DesignHeight="450"
    d:DesignWidth="800"
    Background="Transparent"
    FontSize="50"
    mc:Ignorable="d">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="0.1*" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal">
            <dp:CostomTextBox
                dp:TextBoxHelper.Title="this addition"
                IsHighLighted="True"
                Text="{Binding RelativeSource={RelativeSource Mode=Self}, Path=(dp:TextBoxHelper.Title)}" />
            <TextBlock Background="{Binding MyBrush}" Text="ddd" />
        </StackPanel>
        <Border
            Grid.Row="1"
            BorderBrush="Yellow"
            BorderThickness="2"
            CornerRadius="10">
            <Border.Background>
                <LinearGradientBrush>
                    <GradientStop Offset="0.1" Color="#d378ff" />
                    <GradientStop Offset="0.5" Color="#7895ff" />
                    <GradientStop Offset="1" Color="#5ad7fd" />
                </LinearGradientBrush>
            </Border.Background>
            <DataGrid
                x:Name="myDataGrid"
                Margin="30"
                AutoGenerateColumns="False"
                Background="Transparent"
                BorderBrush="#CDCDCD"
                CanUserAddRows="False"
                ColumnHeaderHeight="40"
                ColumnWidth="*"
                GridLinesVisibility="None"
                IsReadOnly="True"
                ItemsSource="{Binding MyStudents}"
                RowDetailsVisibilityMode="Collapsed"
                RowHeaderWidth="0"
                RowHeight="40"
                SelectedIndex="{Binding DetailInex}">
                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="DataGridColumnHeader">
                        <Setter Property="Foreground" Value="#1B1B1B" />
                        <Setter Property="BorderThickness" Value="0,0,0,1" />
                        <Setter Property="FontWeight" Value="Bold" />
                        <Setter Property="Background" Value="Transparent" />
                        <Setter Property="VerticalContentAlignment" Value="Center" />
                    </Style>
                </DataGrid.ColumnHeaderStyle>
                <DataGrid.RowStyle>
                    <Style TargetType="DataGridRow">
                        <Setter Property="BorderThickness" Value="0,0,0,1" />
                    </Style>
                </DataGrid.RowStyle>

                <DataGrid.CellStyle>
                    <Style TargetType="DataGridCell">
                        <Setter Property="VerticalContentAlignment" Value="Center" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="DataGridCell">
                                    <Border Background="{TemplateBinding Background}">
                                        <ContentPresenter VerticalAlignment="Center" Content="{TemplateBinding Content}" />
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </DataGrid.CellStyle>
                <DataGrid.RowDetailsTemplate>
                    <DataTemplate>
                        <Grid
                            Width="680"
                            Height="300"
                            Margin="10,3,10,3">
                            <DataGrid
                                Margin="30"
                                AutoGenerateColumns="False"
                                Background="White"
                                BorderBrush="#CDCDCD"
                                CanUserAddRows="False"
                                ColumnHeaderHeight="40"
                                ColumnWidth="*"
                                IsReadOnly="True"
                                ItemsSource="{Binding MyCourse}"
                                RowHeaderWidth="0"
                                RowHeight="30">
                                <DataGrid.ColumnHeaderStyle>
                                    <Style TargetType="DataGridColumnHeader">
                                        <Setter Property="Foreground" Value="#1B1B1B" />
                                        <Setter Property="BorderThickness" Value="0,0,0,1" />
                                        <Setter Property="FontWeight" Value="Bold" />
                                        <Setter Property="Background" Value="Transparent" />
                                        <Setter Property="VerticalContentAlignment" Value="Center" />
                                        <Setter Property="HorizontalAlignment" Value="Center" />
                                    </Style>
                                </DataGrid.ColumnHeaderStyle>
                                <DataGrid.RowStyle>
                                    <Style TargetType="DataGridRow">
                                        <Setter Property="BorderThickness" Value="0,0,0,1" />
                                    </Style>
                                </DataGrid.RowStyle>
                                <DataGrid.CellStyle>
                                    <Style TargetType="DataGridCell">
                                        <Setter Property="VerticalContentAlignment" Value="Center" />
                                        <Setter Property="HorizontalAlignment" Value="Center" />
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="DataGridCell">
                                                    <Border Background="{TemplateBinding Background}">
                                                        <ContentPresenter VerticalAlignment="Center" Content="{TemplateBinding Content}" />
                                                    </Border>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </DataGrid.CellStyle>
                                <DataGrid.Columns>
                                    <DataGridTextColumn
                                        Binding="{Binding CourseName}"
                                        Foreground="Black"
                                        Header="课程名称" />
                                    <DataGridTextColumn
                                        Binding="{Binding Teacher}"
                                        Foreground="Black"
                                        Header="教师" />
                                    <DataGridTextColumn
                                        Binding="{Binding Score}"
                                        Foreground="Black"
                                        Header="分数" />
                                    <DataGridTextColumn
                                        Binding="{Binding Classroom}"
                                        Foreground="Black"
                                        Header="教室" />
                                </DataGrid.Columns>
                            </DataGrid>
                        </Grid>
                    </DataTemplate>
                </DataGrid.RowDetailsTemplate>
                <DataGrid.Columns>
                    <DataGridTemplateColumn Width="30">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <ToggleButton
                                    Width="15"
                                    Height="15"
                                    BorderThickness="0"
                                    Command="{Binding RelativeSource={RelativeSource AncestorType=UserControl}, Path=DataContext.DetailCommand}"
                                    CommandParameter="{Binding ElementName=myDataGrid}"
                                    FontFamily="{StaticResource fontAwesome}">
                                    <ToggleButton.Style>
                                        <Style TargetType="ToggleButton">
                                            <Setter Property="FontFamily" Value="{StaticResource fontAwesome}" />
                                            <Setter Property="Template">
                                                <Setter.Value>
                                                    <ControlTemplate TargetType="ToggleButton">
                                                        <Border
                                                            x:Name="border"
                                                            Width="15"
                                                            Height="15">
                                                            <TextBlock
                                                                x:Name="textBlock"
                                                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                                                Text="&#xf060;" />
                                                        </Border>
                                                        <ControlTemplate.Triggers>
                                                            <Trigger Property="IsChecked" Value="True">
                                                                <Setter TargetName="textBlock" Property="TextBlock.Text" Value="&#xf062;" />
                                                            </Trigger>
                                                            <Trigger Property="IsChecked" Value="False">
                                                                <Setter TargetName="textBlock" Property="TextBlock.Text" Value="&#xf063;" />
                                                            </Trigger>
                                                        </ControlTemplate.Triggers>
                                                    </ControlTemplate>

                                                </Setter.Value>
                                            </Setter>
                                        </Style>
                                    </ToggleButton.Style>
                                </ToggleButton>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn
                        Binding="{Binding Id}"
                        Foreground="Black"
                        Header="Id" />
                    <DataGridTextColumn
                        Binding="{Binding Name}"
                        Foreground="Black"
                        Header="姓名" />
                    <DataGridTextColumn
                        Binding="{Binding Age}"
                        Foreground="Black"
                        Header="年龄" />
                </DataGrid.Columns>
            </DataGrid>

        </Border>
    </Grid>
</UserControl>

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using NavTest.Eneities;
using NavTest.Service.Ioc;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Windows.Controls;
using System.Windows.Media;

namespace NavTest.ViewModels
{
    public partial class Page5ViewModel : ObservableObject, ISingleton
    {
        private readonly PLCModels pLCModelsIoc;

        public Page5ViewModel(PLCModels pLCModelsIoc)
        {
            this.pLCModelsIoc = pLCModelsIoc;
            this.PLCModels = pLCModelsIoc.pLCModels;
            MyBrush = new SolidColorBrush(Colors.Red);

            for (int i = 0; i < 50; i++)
            {
                MyStudents.Add(
                    new()
                    {
                        Id = i,
                        Age = $"{i + 10}",
                        Name = $"Name{i + 5}",
                        MyCourse = new()
                        {
                            new Course()
                            {
                                CourseName = "语文",
                                Teacher = "张老师",
                                Score = i + 60,
                                Classroom = $"教室{i}"
                            },
                            new Course()
                            {
                                CourseName = "英语",
                                Teacher = "李老师",
                                Score = i + 61,
                                Classroom = $"教室{i}"
                            }
                            ,
                            new Course()
                            {
                                CourseName = "数学",
                                Teacher = "张老师",
                                Score = i + 60,
                                Classroom = $"教室{i}"
                            }
                            ,
                            new Course()
                            {
                                CourseName = "语文",
                                Teacher = "张老师",
                                Score = i + 60,
                                Classroom = $"教室{i}"
                            }
                            ,
                            new Course()
                            {
                                CourseName = "语文",
                                Teacher = "张老师",
                                Score = i + 60,
                                Classroom = $"教室{i}"
                            }
                        }
                    }
                );
            }
        }

        [ObservableProperty]
        private ObservableCollection<PLCModel> pLCModels;

        [ObservableProperty]
        private Brush myBrush;

        [ObservableProperty]
        private List<Student> myStudents = new();

        [ObservableProperty]
        private int detailInex;

        [RelayCommand]
        public void Detail(DataGrid dataGrid) 
        {
            DataGridRow dataGridRow = (DataGridRow)dataGrid.ItemContainerGenerator.ContainerFromIndex(DetailInex);
            if (dataGridRow.DetailsVisibility == System.Windows.Visibility.Visible)
            {
                dataGridRow.DetailsVisibility = System.Windows.Visibility.Collapsed;
            }
            else
            {
                dataGridRow.DetailsVisibility = System.Windows.Visibility.Visible;
            }
        }
    }
}

    public class Student
    {
        public int Id { get; set; }
        public string? Name { get; set; }
        public string? Description { get; set; }
        public string? Age { get; set; }
        public List<Course>? MyCourse { get; set; }
    }
    public class Course
    {
        public string? CourseName { get; set; }
        public string? Teacher { get; set; }
        public int? Score { get; set; }
        public string? Classroom { get; set; }
    }

效果:

在这里插入图片描述

  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
WPF 中的 DataGrid 和 ListView 都没有内置的分页控件,但可以通过一些方法来实现分页功能。 一种实现方式是使用 CollectionView,它是用于对集合进行排序、过滤和分组的类。可以使用 CollectionViewSource 创建 CollectionView,并在 XAML 中绑定到分页控件中。 以下是一个示例,其中使用 CollectionViewSource 来创建 CollectionView,并将其绑定到 ListView 控件中: ```xml <Grid> <Grid.Resources> <CollectionViewSource x:Key="cvs" Source="{Binding Items}" PageSize="10"/> </Grid.Resources> <ListView ItemsSource="{Binding Source={StaticResource cvs}}" /> <StackPanel Orientation="Horizontal" HorizontalAlignment="Center"> <Button Content="Prev" Command="{Binding Source={StaticResource cvs}, Path=PageUpCommand}" /> <TextBlock Text="{Binding Source={StaticResource cvs}, Path=PageIndex}" /> <Button Content="Next" Command="{Binding Source={StaticResource cvs}, Path=PageDownCommand}" /> </StackPanel> </Grid> ``` 在上面的示例中,CollectionViewSource 用于创建 CollectionView,并使用 PageSize 属性来指定每页的项数。ListView 控件绑定到 CollectionViewSource 中的 CollectionView。 同时,使用按钮来切换分页,每个按钮都绑定到 CollectionViewSource 中的 PageUpCommand 和 PageDownCommand 命令,以便在前一页和后一页之间切换。 还有其他的实现方式,例如手动分页和使用第三方分页控件等等。具体实现方式可以根据项目需求来选择。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

潘诺西亚的火山

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值