WPF 自定义分页控件,可通过样式模板修改外观

前言

在桌面应用程序开发中,特别是使用WPF框架时,数据展示和用户交互的优化至关重要。当处理大量数据时,如何有效地进行分页显示成为了一个关键问题。

本文将介绍两种不同的分页控件------通用分页控件 Pager 和自动分页控件 ListPager 的实现方式,并提供相应的XAML和C#代码示例。

分页效果

通用分页控件 Pager

XAML 示例

xml 复制代码
<DockPanel Margin="10">
    <pp:Pager x:Name="pager" DockPanel.Dock="Top" Margin="0 10">
        <ComboBox x:Name="combo" Padding="6 0" SelectedIndex="0" BorderBrush="#D9D9D9" Foreground="#333" pp:BorderElement.CornerRadius="4" Margin="6 0"
        DisplayMemberPath="Value" SelectedValuePath="Key" SelectedValue="{Binding PageSize,ElementName=pager}" />
    </pp:Pager>
    <ListBox x:Name="list" />
</DockPanel>

该XAML定义了页面顶部的一个 Pager 控件,其中包含一个下拉框用于选择每页显示的条目数。下方是一个 ListBox 用于展示分页后的数据。

后台代码

csharp 复制代码
public PagerView()
{
    InitializeComponent();

    var dic = new Dictionary<Int32, String>
    {
        [10] = "10条/页",
        [20] = "20条/页",
        [30] = "30条/页",
        [40] = "40条/页",
    };

    combo.ItemsSource = dic;
    combo.SelectedValue = 10;

    pager.PageIndexChanged += OnPageIndexChanged;
    pager.TotalCount = datas.Count();
}

private void OnPageIndexChanged(Object sender, EventArgs e)
{
    list.ItemsSource = datas.Skip((pager.PageIndex - 1) * pager.PageSize).Take(pager.PageSize);
}

private IEnumerable<Int32> datas = Enumerable.Range(1, 999);

这段段代码实现了分页逻辑,监听 PageIndexChanged 事件来刷新列表数据。

样式模板

xml 复制代码
<Style TargetType="{x:Type ctrls:Pager}">
    <!-- 省略样式细节 -->
</Style>

通过自定义样式模板可以调整 Pager 控件的外观,如页码按钮、跳转输入框等。

自动分页控件 ListPager

XAML 示例

xml 复制代码
<DockPanel Margin="10">
    <pp:ListPager x:Name="pager" DockPanel.Dock="Top" Margin="0 10">
        <ComboBox x:Name="combo" Padding="6 0" SelectedIndex="0" BorderBrush="#D9D9D9" Foreground="#333" pp:BorderElement.CornerRadius="4" Margin="6 0"
                  DisplayMemberPath="Value" SelectedValuePath="Key" SelectedValue="{Binding PageSize,ElementName=pager}" />
    </pp:ListPager>
    <ListBox x:Name="list" ItemsSource="{Binding DisplaySource,ElementName=pager}" />
</DockPanel>

ListPager 控件简化了分页流程,只需设置数据源即可自动完成分页。

后台代码

csharp 复制代码
public ListPagerView()
{
    InitializeComponent();

    var dic = new Dictionary<Int32, String>
    {
        [10] = "10条/页",
        [20] = "20条/页",
        [30] = "30条/页",
        [40] = "40条/页",
    };

    combo.ItemsSource = dic;
    combo.SelectedValue = 10;

    pager.Source = Enumerable.Range(1, 999);
}

相比 PagerListPager 更加便捷,它直接接收全部数据并根据页面大小自动处理分页逻辑。

项目源码

GitHub:github.com/LowPlayer/P...

总结

不管是 Pager 还是 ListPager,它们都提供了灵活且强大的分页解决方案,适用于不同的场景需求。Pager 提供了更多的手动控制选项,适合需要定制化分页逻辑的应用;而 ListPager 则简化了开发者的负担,特别适合那些能够一次性获取所有数据的情况。

这些控件不仅提升了用户体验,也提高了数据展示的效率。对于开发来说,理解并合理选用这两种分页控件,可以极大地提升应用的性能和易用性。

关键词

Pager、ListPager、WPF、分页控件、数据展示、用户体验、C#、控件样式、自动分页、手动分页

最后

如果你觉得这篇文章对你有帮助,不妨点个赞支持一下!你的支持是我继续分享知识的动力。如果有任何疑问或需要进一步的帮助,欢迎随时留言。

也可以加入微信公众号 [DotNet技术匠] 社区,与其他热爱技术的同行一起交流心得,共同成长!

优秀是一种习惯,欢迎大家留言学习!

作者:孤独成派

出处:cnblogs.com/pumbaa/p/14736311.html

声明:网络内容,仅供学习,尊重版权,侵权速删,歉意致谢!

相关推荐
Tony Bai1 天前
【Go开发者的数据库设计之道】05 落地篇:Go 语言四种数据访问方案深度对比
开发语言·数据库·后端·golang
eqwaak01 天前
Flask实战指南:从基础到高阶的完整开发流程
开发语言·后端·python·学习·flask
笨蛋不要掉眼泪1 天前
SpringBoot项目Excel成绩录入功能详解:从文件上传到数据入库的全流程解析
java·vue.js·spring boot·后端·spring·excel
Humbunklung1 天前
C# 使用应用RSA和ECC进行数字签名和签名验证
开发语言·c#·rsa·ecc
Rotion_深1 天前
C# WPF使用线程池运行Action方法
c#·wpf·线程池
追逐时光者1 天前
一款专门为 WPF 打造的开源 Office 风格用户界面控件库
后端·.net
大飞pkz1 天前
【设计模式】策略模式
开发语言·设计模式·c#·策略模式
Lin_Aries_04211 天前
容器化 Flask 应用程序
linux·后端·python·docker·容器·flask
cgsthtm1 天前
C#使用linq将数据进行分页
c#·linq·分页·sqlsugar
玩泥巴的1 天前
不一样的.NET烟火,基于Roslyn的开源代码生成器
c#·.net·代码生成·roslyn