WPF 【十月的寒流】学习笔记(3):DataGrid分页

文章目录

  • 前言
  • 相关链接
  • 代码仓库
  • 项目配置(省略)
    • 项目初始配置
      • xaml
      • viewModel
    • Filter过滤
      • 详细代码
      • 展示结果
      • 问题
    • Linq过滤
      • CollectionData
      • xaml
      • viewModel
    • sql,这里用到数据库,就不展开了
  • 总结

前言

我们这次详细了解一下列表通知的底层是怎么实现的

相关链接

十月的寒流

在这里插入图片描述

WPF 中如何制作 DataGrid 的分页功能

代码仓库

我为了方便展示源代码,我将代码提交到了代码仓库里面

B站【十月的寒流】对应课程的代码 Github仓库

项目配置(省略)

想要看的话看我前面的文章就可以了

项目初始配置

和我之前的代码差不多,详细的就看我的源码好了,我会用TabItem来简单说明的。这就是初始配置的代码了

在这里插入图片描述

xaml

<UserControl x:Class="DataGrid_Pagination.Views.Demo1View"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:DataGrid_Pagination.Views"mc:Ignorable="d" xmlns:hc="https://handyorg.github.io/handycontrol"xmlns:viewModels="clr-namespace:DataGrid_Pagination.ViewModels"d:DesignHeight="450" d:DesignWidth="800"><UserControl.DataContext><viewModels:Demo1ViewModel  x:Name="ViewModel"/></UserControl.DataContext><DockPanel><hc:Pagination MaxPageCount="10"DockPanel.Dock="Bottom"Margin="4 7"PageIndex="5"IsJumpEnabled="True" /><DataGrid ItemsSource="{Binding CollectionData.Data}"></DataGrid></DockPanel>
</UserControl>

viewModel

namespace DataGrid_Pagination.ViewModels
{public partial class Demo1ViewModel : ObservableObject{public Demo1View Demo1View { get; set; }[ObservableProperty]private CollectionData<Student> collectionData = new CollectionData<Student>();public Demo1ViewModel(){CollectionData = new CollectionData<Student>() {Data = new Student().FakeMany(10)};CollectionData.Init();CollectionData.CollectionView.Refresh();}}
}

Filter过滤

在这里插入图片描述

详细代码

<UserControl x:Class="DataGrid_Pagination.Views.Demo2View"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:DataGrid_Pagination.Views"mc:Ignorable="d" xmlns:hc="https://handyorg.github.io/handycontrol"xmlns:viewModels="clr-namespace:DataGrid_Pagination.ViewModels"d:DesignHeight="450" d:DesignWidth="800"><UserControl.DataContext><viewModels:Demo2ViewModel  x:Name="ViewModel"/></UserControl.DataContext><DockPanel><hc:Pagination MaxPageCount="{Binding PageCount}"DockPanel.Dock="Bottom"Margin="4 7"PageIndex="{Binding PageIndex,Mode=TwoWay}"IsJumpEnabled="True" /><DataGrid ItemsSource="{Binding CollectionData.Data}"></DataGrid></DockPanel>
</UserControl>

namespace DataGrid_Pagination.ViewModels
{public partial class Demo2ViewModel : ObservableObject{public Demo2View View { get; set; }[ObservableProperty]private CollectionData<Student> collectionData = new CollectionData<Student>();private int pageIndex = 1;public int PageIndex{get => pageIndex;set {SetProperty(ref pageIndex, value);CollectionData.CollectionView.Refresh();}}public readonly int PageSize = 10;[ObservableProperty]private int pageCount = 1;public Demo2ViewModel(){CollectionData = new CollectionData<Student>(){Data = new Student().FakeMany(150)};CollectionData.Binding();CollectionData.CollectionView.CollectionChanged += (s, e) =>{var count = CollectionData.Data.ToList().Count;PageCount = (int)Math.Ceiling((decimal)(count / PageSize));};CollectionData.CollectionView.Filter = (item) =>{if (!(item is Student)){throw new Exception("属性类型不为Student");}var index = CollectionData.Data.ToList().IndexOf((Student)item);return PageIndex == index / PageSize + 1;};CollectionData.CollectionView.Refresh();}}
}

展示结果

在这里插入图片描述

问题

小数据量没问题,但是大数据会出问题。因为主要的计算是indexOf和每个项的Filter。o(n)*o(n)=o(n^2),复杂度太高了。

Linq过滤

Linq过滤就是我们每次都更新CollectionView绑定的对象,触发更新

在这里插入图片描述
在这里插入图片描述

CollectionData

    public partial class CollectionData<T>:ObservableObject where T : class{[ObservableProperty]private IEnumerable<T> data = new List<T>();public ICollectionView CollectionView { get; set; }public CollectionData() { }public void Binding(){CollectionView = CollectionViewSource.GetDefaultView(Data);}}

xaml

<UserControl x:Class="DataGrid_Pagination.Views.Demo3View"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:local="clr-namespace:DataGrid_Pagination.Views"mc:Ignorable="d"xmlns:hc="https://handyorg.github.io/handycontrol"xmlns:viewModels="clr-namespace:DataGrid_Pagination.ViewModels"d:DesignHeight="450"d:DesignWidth="800"><UserControl.DataContext><viewModels:Demo3ViewModel  x:Name="ViewModel" /></UserControl.DataContext><DockPanel><hc:Pagination MaxPageCount="{Binding PageCount}"DockPanel.Dock="Bottom"Margin="4 7"PageIndex="{Binding PageIndex,Mode=TwoWay}"IsJumpEnabled="True" /><DataGrid ItemsSource="{Binding CollectionData.Data}"></DataGrid></DockPanel>
</UserControl>

viewModel


namespace DataGrid_Pagination.ViewModels
{public partial class Demo3ViewModel : ObservableObject{public Demo3View View { get; set; }[ObservableProperty]private CollectionData<Student> collectionData = new CollectionData<Student>();private int pageIndex = 1;public int PageIndex{get => pageIndex;set{SetProperty(ref pageIndex, value);CollectionData.CollectionView.Refresh();}}public readonly int PageSize = 10;[ObservableProperty]private int pageCount = 1;public readonly List<Student> Students = new Student().FakeMany(150).ToList();public Demo3ViewModel(){CollectionData = new CollectionData<Student>(){Data = Students.Take(PageSize),};CollectionData.Binding();CollectionData.CollectionView.CollectionChanged += (s, e) =>{var count = Students.Count;PageCount = (int)Math.Ceiling((decimal)(count / PageSize));CollectionData.Data = Students.Skip((PageIndex - 1) * PageSize).Take(PageSize);};}}
}

sql,这里用到数据库,就不展开了

总结

分页是我们最常用的功能,这次简单实现了分页的效果。HandyControl没有提供主动的分页,需要我们组合一下。详细代码可以看我的Github仓库。三种过滤我都写了。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2813740.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

GIS之深度学习03:Anaconda无法正常启动问题汇总(更新)

在安装完成anaconda后&#xff0c;总会出现一些问题&#xff0c;以下为遇到的问题及解决方案&#xff1a; &#xff08;有问题请私信&#xff0c;持续更新&#xff09; 01&#xff1a;anaconda navigator启动时一直卡在 loading applications 页面 解决&#xff1a; 找到anac…

在Ubuntu22.04 LTS上搭建Kubernetes集群

文章目录 准备工作系统准备软件包准备主机和IP地址准备 安装步骤安装前准备关闭防火墙设置服务器时区关闭 swap 分区关闭SELinux配置hosts配置文件转发 IPv4 并让 iptables 看到桥接流量 安装容器运行时安装Kubernetes配置并安装apt包初始化集群 安装calico网络插件部署应用 本…

2-3 树

原文链接&#xff1a;https://blog.csdn.net/Ceylan__/article/details/125578130 一、2-3树 的定义 Q&#xff1a;什么是二叉排序树 A&#xff1a;二叉排序树或者是一棵空树&#xff0c;或者是具有如下性质的二叉树 1&#xff09;若它的左子树不空&#xff0c;则 左子树 上…

Introduction to OpenCL

Introduction to OpenCL Open Computing Language 是用于编写跨异构平台执行的程序的框架。 例如&#xff0c;它们由 CPU、GPU、DSP 和 FPGA 组成。 OpenCL 指定了一种用于对这些设备进行编程的编程语言&#xff08;基于 C99&#xff09;和应用程序编程接口 (API)&#xff0c…

【Godot4.2】菜单相关控件和节点完全解析

MenuBar MenuBar的逻辑是&#xff1a; 添加到其中的PopupMenu节点&#xff0c;会自动水平排列&#xff08;类似于HBoxContainer&#xff09;。PopupMenu隐藏&#xff0c;而自动将其创建为可以点击的MenuButton形式,MenuButton的文本将与PopupMenu节点的名称一致 MenuBar不是必…

C++初阶 | [八] (下) vector 模拟实现

摘要&#xff1a;vector 模拟实现讲解&#xff08;附代码示例&#xff09;&#xff0c;隐藏的浅拷贝&#xff0c;迭代器失效 在进行 vector 的模拟实现之前&#xff0c;我们先粗略浏览一下 stl_vector.h 文件中的源码来确定模拟实现的大体框架。 这里提供一些粗略浏览源码的技巧…

防御-day3-内容安全(入侵检测-IPS,防病毒网关-AV)

一、内容安全 1、华为---IAE引擎 核心技术 DPI---深度包检测---主要针对完整的数据包&#xff08;数据包分片&#xff0c;分段需要重组&#xff09;&#xff0c;之后对 数据包的内容进行识别。&#xff08;应用层&#xff09; DFI---深度流检测---一种基于流量行为的应用识别技…

SpringCloud(17)之SpringCloud Stream

一、Spring Cloud Stream介绍 Spring Cloud Stream是一个框架&#xff0c;用于构建与共享消息系统连接的高度可扩展的事件驱动微服务。该框架提供了一个灵活的编程模型&#xff0c;该模型建立在已经建立和熟悉的Spring习惯用法和最佳实践之上&#xff0c;包括对持久发布/子语义…

Coze开源软件Windows客户端-coze_desk

字节的coze相信大家都已经有所关注了&#xff0c;最近看到很多公众号在推。笔者也在使用&#xff0c;体验很不错。 这个是官网&#xff1a;https://www.coze.com/。 官网版 应用的样子 三栏式布局&#xff0c;用起来还是可以的。 不过这个是在浏览器端&#xff0c;有时候不小…

springcloud -远程调用方式

如果我们要进行远程微服之间的调用该如何完成呢&#xff0c;本文以案例推动以养老系统中老人支付购买商品为例&#xff0c;一步步实现远程微服务的调用。 目标 微服务之间的调用方式 老人支付 common模块设计 统一返回 package com.wnhz.ssc.common.result;import lombok.G…

书生·浦语大模型全链路开源体系介绍

背景介绍 随着人工智能技术的迅猛发展&#xff0c;大模型技术已成为当今人工智能领域的热门话题。2022 年 11 月 30 日&#xff0c;美国 OpenAI 公司发布了 ChatGPT 通用型对话系统 并引发了全球 的极大关注&#xff0c;上线仅 60 天月活用户数便超过 1 亿&#xff0c;成为历史…

开源人脸检测模型MTCNN简单的例子

阅读本文之前可以先参阅----神经网络中的重要概念 如何快速入门深度学习 当使用MTCNN模型进行人脸检测时&#xff0c;你可以使用Python编程语言和相应的深度学习库来实现。下面是一个简单的例子&#xff0c;演示了如何使用MTCNN模型进行人脸检测&#xff1a; 首先&#xff0c;…

每日学习总结20240227

每日总结 20240227 1.如何将字符串通过串口以十六进制进行传输 将文件名或者文件内容通过串口传输&#xff0c;再解析&#xff0c;拼接成源文件 1.1 文件转换 1.1.1 转十六进制 在Linux中&#xff0c;你可以使用 xxd 命令将文本文件转换为十六进制格式。以下是如何在Linux中…

天翼云登录参数JavaSrcipt逆向

天翼云登录参数 password 、comParam_curTime、comParam_seqCode、comParam_signature JavaSrcipt逆向 目标网站 https://m.ctyun.cn/wap/main/auth/login?redirect/my 目标参数 要逆向的有 password、comParam_curTime、comParam_seqCode、comParam_signature 四个参数 …

【蓝桥杯嵌入式】蓝桥杯嵌入式第十四届省赛程序真题,真题分析与代码讲解

&#x1f38a;【蓝桥杯嵌入式】专题正在持续更新中&#xff0c;原理图解析✨&#xff0c;各模块分析✨以及历年真题讲解✨都已更新完毕&#xff0c;欢迎大家前往订阅本专题&#x1f38f; &#x1f38f;【蓝桥杯嵌入式】蓝桥杯第十届省赛真题 &#x1f38f;【蓝桥杯嵌入式】蓝桥…

软件测试笔记(三):黑盒测试

1 黑盒测试概述 黑盒测试也叫功能测试&#xff0c;通过测试来检测每个功能是否都能正常使用。在测试中&#xff0c;把程序看作是一个不能打开的黑盒子&#xff0c;在完全不考虑程序内部结构和内部特性的情况下&#xff0c;对程序接口进行测试&#xff0c;只检查程序功能是否按…

Web前端3D JS框架和库 整理

在WebGL库和SVG/Canvas元素的支持下&#xff0c;JavaScript变得惊人的强大。几乎可以为网络构建任何东西&#xff0c;包括基于浏览器的游戏和本地应用&#xff0c;许多最新的突破性功能都在3D上运行。 为此&#xff0c;「数维图小编」整理了19个交互式3D Javascript库和框架&am…

开心的金明

好久没发文章了&#xff0c;随着这一题开始2024年吧&#xff01; 题目描述 金明今天很开心&#xff0c;家里购置的新房就要领钥匙了&#xff0c;新房里有一间他自己专用的很宽敞的房间。更让他高兴的是&#xff0c;妈妈昨天对他说&#xff1a;“你的房间需要购买哪些物品&…

每日一练:LeeCode-235、二叉搜索树的最近公共祖先【二叉搜索树+DFS+从上往下】

本文是力扣每日一练&#xff1a;LeeCode-235、二叉搜索树的最近公共祖先【二叉搜索树DFS从上往下】 学习与理解过程&#xff0c;本文仅做学习之用&#xff0c;对本题感兴趣的小伙伴可以出门左拐LeeCode。 给定一个二叉搜索树, 找到该树中两个指定节点的最近公共祖先。 百度百…

idea2023新UI风格不见了怎么办?

用了一段时间idea2023,有一天不知道点了什么&#xff0c;整个UI又变成了2022的风格 如果想换成2023的UI风格怎么办&#xff1f; 点击file->setting->new UI->勾选Enable new UI&#xff0c;restart就可以回到最新版本的UI了 新风格