自定义分页控件

还世间一个真相

自定义分页控件

tip: 该控件的样式用的是materialDesign库，需要下载Nuget包
Code

• Xaml
  

1. <UserControl
2.     x:
3.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6.     xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
7.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
8.     x:Name="pagingControl"
9.     TextElement.FontSize="14"
10.     mc:Ignorable="d">
11.     <UserControl.Resources>
12.         
13.     </UserControl.Resources>
14.     <StackPanel DataContext="{Binding ElementName=pagingControl}" Orientation="Horizontal">
15.         <Button
16.             Click="Button_FirstPage_Click"
17.             ToolTip="首页">
18.             <materialDesign:PackIcon
19.                 Width="24"
20.                 Height="24"
21.                 VerticalAlignment="Center"
22.                 Kind="PageFirst" />
23.         </Button>
24.         <Button
25.             Margin="10,0,10,0"
26.             Click="Button_Previous_Click"
27.             ToolTip="上一页">
28.             <materialDesign:PackIcon
29.                 Width="20"
30.                 Height="20"
31.                 VerticalAlignment="Center"
32.                 Kind="ArrowLeftCircle" />
33.         </Button>
34.         <TextBlock VerticalAlignment="Center" Text="{Binding CurrentPageIndex}" />
35.         <TextBlock VerticalAlignment="Center">/</TextBlock>
36.         <TextBlock VerticalAlignment="Center" Text="{Binding TotalPageCount}" />
37.         <Button
38.             Width="26"
39.             Height="26"
40.             Margin="10,0,0,0"
41.             Click="Button_Next_Click"
42.             ToolTip="下一页">
43.             <materialDesign:PackIcon
44.                 Width="20"
45.                 Height="20"
46.                 VerticalAlignment="Center"
47.                 Kind="ArrowRightCircle" />
48.         </Button>
49.         <Button
50.             Margin="10,0,0,0"
51.             Click="Button_Last_Click"
52.             ToolTip="尾页">
53.             <materialDesign:PackIcon
54.                 Width="24"
55.                 Height="24"
56.                 VerticalAlignment="Center"
57.                 Kind="PageLast" />
58.         </Button>
59.         <TextBlock Margin="20,0,0,0" VerticalAlignment="Center">共</TextBlock>
60.         <TextBlock
61.             Margin="5,0,0,0"
62.             VerticalAlignment="Center"
63.             Text="{Binding TotalCount}" />
64.         <TextBlock Margin="5,0,0,0" VerticalAlignment="Center">条记录</TextBlock>
65.         <Separator
66.             Height="14"
67.             Margin="10,0,0,0"
68.             BorderThickness="0.5"
69.              />
70.         <TextBlock Margin="10,0,0,0" VerticalAlignment="Center">每页数量</TextBlock>
71.         <ComboBox
72.             MinWidth="50"
73.             Margin="5,0,0,0"
74.             VerticalContentAlignment="Center"
75.             ItemsSource="{Binding PagesSizes}"
76.             SelectedIndex="0"
77.             SelectedItem="{Binding CurrentPageSize}"
78.             SelectionChanged="ComboBox_PageSize_SelectionChanged" />
79.         <Separator
80.             Height="14"
81.             Margin="10,0,0,0"
82.             BorderThickness="0.5"
83.              />
84.         <TextBlock Margin="10,0,0,0" VerticalAlignment="Center">跳转到第</TextBlock>
85.         <TextBox
86.             Width="50"
87.             Margin="5,0,5,0"
88.             VerticalAlignment="Center"
89.             HorizontalContentAlignment="Center"
90.             Text="{Binding GotoPageIndex}" />
91.         <TextBlock VerticalAlignment="Center">页</TextBlock>
92.         <Button
93.             Margin="5,0,0,0"
94.             Click="Button_Goto_Click"
95.             ToolTip="跳转">
96.             <materialDesign:PackIcon
97.                 Width="24"
98.                 Height="24"
99.                 VerticalAlignment="Center"
100.                 Kind="ArrowRightBold" />
101.         </Button>
102.     </StackPanel>
103. </UserControl>

复制代码

• C#
  

1. public partial class PagingControl : UserControl, INotifyPropertyChanged
2. {
3.     // 用于防抖、节流
4.     private readonly ConcurrentQueue<DateTime> _operationTime = new();
6.     //用于防抖、节流，拦截两次时间少于1秒的操作
7.     private readonly TimeSpan _ignoreOperationLessThen = TimeSpan.FromSeconds(1);
9.     public event EventHandler CanExecuteChanged;
10.     public event PropertyChangedEventHandler? PropertyChanged;
12.     #region 普通属性
13.     /// <summary>
14.     /// 能否执行状态
15.     /// </summary>
16.     public bool CanExecute => QueryCommand?.CanExecute(null) ?? true;
17.     //在load后是否立即触发命令和路由事件
18.     public bool LoadedTrigger { get; set; } = false;
19.     public ObservableCollection<int> PagesSizes { get; set; } = [15, 30, 60, 200, 500, 2000];
21.     /// <summary>
22.     /// 总页数
23.     /// </summary>
24.     private int _totalPageCount;
25.     public int TotalPageCount
26.     {
27.         get => _totalPageCount;
28.         set
29.         {
30.             if (_totalPageCount != value)
31.             {
32.                 _totalPageCount = value;
33.                 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(TotalPageCount)));
34.             }
35.         }
36.     }
38.     /// <summary>
39.     /// 跳转页码
40.     /// </summary>
41.     private int _gotoPageIndex;
42.     public int GotoPageIndex
43.     {
44.         get => _gotoPageIndex;
45.         set
46.         {
47.             if (_gotoPageIndex != value)
48.             {
49.                 _gotoPageIndex = value;
50.                 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(GotoPageIndex)));
51.             }
52.         }
53.     }
55.     /// <summary>
56.     /// 当前页大小
57.     /// </summary>
58.     private int _currentPageSize = 15;
59.     public int CurrentPageSize
60.     {
61.         get => _currentPageSize;
62.         set
63.         {
64.             if (_currentPageSize != value)
65.             {
66.                 _currentPageSize = value;
67.                 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(CurrentPageSize)));
68.             }
69.         }
70.     }
72.     /// <summary>
73.     /// 当前页码
74.     /// </summary>
75.     private int _currentPageIndex;
76.     public int CurrentPageIndex
77.     {
78.         get => _currentPageIndex;
79.         set
80.         {
81.             if (_currentPageIndex != value)
82.             {
83.                 _currentPageIndex = value;
84.                 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(CurrentPageIndex)));
85.             }
86.         }
87.     }
89.     //用于外部绑定命令
90.     public ICommand PageQueryCommand { get; }
91.     #endregion
93.     #region 依赖属性
94.     /// <summary>
95.     /// 总数
96.     /// </summary>
97.     public int TotalCount
98.     {
99.         get { return (int)GetValue(TotalCountProperty); }
100.         set { SetValue(TotalCountProperty, value); }
101.     }
102.     public ICommand QueryCommand
103.     {
104.         get { return (ICommand)GetValue(QueryCommandProperty); }
105.         set { SetValue(QueryCommandProperty, value); }
106.     }
108.     public static readonly DependencyProperty TotalCountProperty =
109.         DependencyProperty.Register("TotalCount", typeof(int), typeof(PagingControl), new FrameworkPropertyMetadata(15, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, TotalCountChangedCallback));
111.     public static readonly DependencyProperty QueryCommandProperty =
112.         DependencyProperty.Register("QueryCommand", typeof(ICommand), typeof(PagingControl), new PropertyMetadata(null, QueryCommandChangedCallback));
114.     #endregion
116.     public static readonly RoutedEvent PagingChangedEvent = EventManager.RegisterRoutedEvent("PagingChanged", RoutingStrategy.Bubble, typeof(EventHandler<PagingChangedEventArgs>), typeof(PagingControl));
118.     public event RoutedEventHandler PagingChanged
119.     {
120.         add => AddHandler(PagingChangedEvent, value);
121.         remove => RemoveHandler(PagingChangedEvent, value);
122.     }
124.     /// <summary>
125.     /// 构造函数
126.     /// </summary>
127.     public PagingControl()
128.     {
129.         InitializeComponent();
131.         TotalCount = 0;
132.         GotoPageIndex = 1;
133.         CurrentPageIndex = 0;
134.         TotalPageCount = 0;
136.         PageQueryCommand = new PageQueryCommand(this);
137.     }
139.     static void TotalCountChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
140.     {
141.         PagingControl pagingControl = (PagingControl)d;
142.         pagingControl.ReLoad((int)e.NewValue);
143.     }
145.     static void QueryCommandChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
146.     {
147.         var command = e.NewValue as ICommand;
148.         if (command != null)
149.         {
150.             PagingControl pagingControl = (PagingControl)d;
152.             command.CanExecuteChanged -= pagingControl.Command_CanExecuteChanged;
153.             command.CanExecuteChanged += pagingControl.Command_CanExecuteChanged;
155.             if (pagingControl.LoadedTrigger)
156.                 pagingControl.FirstPage();
157.         }
158.     }
160.     private void Command_CanExecuteChanged(object? sender, EventArgs e)
161.     {
162.         CanExecuteChanged?.Invoke(this, e);
163.         IsEnabled = QueryCommand.CanExecute(null);
164.     }
166.     #region 事件
167.     /// <summary>
168.     /// 每页大小  ComboBox 变化
169.     /// </summary>
170.     /// <param name="sender"></param>
171.     /// <param name="e"></param>
172.     private void ComboBox_PageSize_SelectionChanged(object sender, SelectionChangedEventArgs e)
173.     {
174.         ReLoad(TotalCount);
176.         CurrentPageIndex = 1;
177.         OnPagingChanged(CurrentPageIndex);
178.         e.Handled = true;
179.     }
181.     /// <summary>
182.     /// 首页按钮点击事件
183.     /// </summary>
184.     /// <param name="sender"></param>
185.     /// <param name="e"></param>
186.     private void Button_FirstPage_Click(object sender, RoutedEventArgs e)
187.     {
188.         FirstPage();
189.         e.Handled = true;
190.     }
192.     /// <summary>
193.     /// 尾页按钮点击事件
194.     /// </summary>
195.     /// <param name="sender"></param>
196.     /// <param name="e"></param>
197.     private void Button_Last_Click(object sender, RoutedEventArgs e)
198.     {
199.         LastPage();
200.         e.Handled = true;
201.     }
203.     /// <summary>
204.     /// 上一页按钮点击事件
205.     /// </summary>
206.     /// <param name="sender"></param>
207.     /// <param name="e"></param>
208.     private void Button_Previous_Click(object sender, RoutedEventArgs e)
209.     {
210.         PreviousPage();
211.         e.Handled = true;
212.     }
214.     /// <summary>
215.     /// 下一页按钮点击事件
216.     /// </summary>
217.     /// <param name="sender"></param>
218.     /// <param name="e"></param>
219.     private void Button_Next_Click(object sender, RoutedEventArgs e)
220.     {
221.         NextPage();
222.         e.Handled = true;
223.     }
225.     /// <summary>
226.     /// 跳转按钮点击事件
227.     /// </summary>
228.     /// <param name="sender"></param>
229.     /// <param name="e"></param>
230.     private void Button_Goto_Click(object sender, RoutedEventArgs e)
231.     {
232.         GoToPage();
233.         e.Handled = true;
234.     }
235.     #endregion
237.     private void ReLoad(int totalCount)
238.     {
239.         TotalPageCount = (totalCount + CurrentPageSize - 1) / CurrentPageSize;
241.         if (TotalPageCount == 0)
242.             CurrentPageIndex = 0;
243.         else if (TotalPageCount != 0 && CurrentPageIndex == 0)
244.             CurrentPageIndex = 1;
245.     }
247.     private bool CheckCanExcetue()
248.     {
249.         if (_operationTime.TryDequeue(out var time))
250.         {
251.             if (DateTime.Now - time < _ignoreOperationLessThen)
252.                 return false;
253.         }
254.         _operationTime.Enqueue(DateTime.Now);
256.         return CanExecute;
257.     }
259.     public void FirstPage()
260.     {
261.         if (!CheckCanExcetue()) return;
263.         CurrentPageIndex = 1;
264.         OnPagingChanged(CurrentPageIndex);
265.     }
267.     public void LastPage()
268.     {
269.         if (!CheckCanExcetue()) return;
271.         if (TotalPageCount == 0)
272.         {
273.             OnPagingChanged(1);
274.         }
275.         else
276.         {
277.             CurrentPageIndex = TotalPageCount;
278.             OnPagingChanged(CurrentPageIndex);
279.         }
280.     }
282.     public void NextPage()
283.     {
284.         if (!CheckCanExcetue()) return;
286.         if (CurrentPageIndex >= TotalPageCount)
287.         {
288.             OnPagingChanged(CurrentPageIndex);
289.         }
290.         else
291.         {
292.             CurrentPageIndex++;
293.             OnPagingChanged(CurrentPageIndex);
294.         }
295.     }
297.     public void PreviousPage()
298.     {
299.         if (!CheckCanExcetue()) return;
301.         if (CurrentPageIndex > TotalPageCount)
302.         {
303.             CurrentPageIndex = TotalPageCount;
304.         }
306.         if (CurrentPageIndex > 1)
307.         {
308.             CurrentPageIndex--;
309.             OnPagingChanged(CurrentPageIndex);
310.         }
311.         else
312.         {
313.             OnPagingChanged(1);
314.         }
315.     }
317.     public void GoToPage()
318.     {
319.         if (!CheckCanExcetue()) return;
321.         if (GotoPageIndex < 1 || GotoPageIndex > TotalPageCount)
322.             return;
324.         CurrentPageIndex = GotoPageIndex;
325.         OnPagingChanged(CurrentPageIndex);
326.     }
328.     private void OnPagingChanged(int pageIndex)
329.     {
330.         PagingChangedEventArgs pagingChangedEventArgs = new(PagingChangedEvent, this,
331.             new PagingInfo(pageIndex, CurrentPageSize));
333.         RaiseEvent(pagingChangedEventArgs);
335.         QueryCommand?.Execute(new PagingInfo(pageIndex, CurrentPageSize));
336.     }
337. }

复制代码

相关自定义类

1. public record class PagingInfo(int TargetPageIndex, int PageSize);

复制代码

路由事件参数

1. public class PagingChangedEventArgs(RoutedEvent routedEvent, object source, PagingInfo pageInfo) : RoutedEventArgs(routedEvent, source)
2. {
3.     public PagingInfo PageInfo { get; set; } = pageInfo;
4. }

复制代码

外部绑定命令（用于MVVM模式下，需要其它地方触发分页控件命令）

1. public class PageQueryCommand : ICommand
2. {
3.     private readonly PagingControl _pagingControl;
5.     public event EventHandler? CanExecuteChanged;
7.     public PageQueryCommand(PagingControl pagingControl)
8.     {
9.         _pagingControl = pagingControl;
10.         _pagingControl.CanExecuteChanged += (o, e) => CanExecuteChanged?.Invoke(o, e);
11.     }
13.     public bool CanExecute(object? parameter)
14.     {
15.         return _pagingControl?.CanExecute ?? true;
16.     }
18.     public void Execute(object? parameter)
19.     {
20.         _pagingControl.FirstPage();
21.     }
22. }

复制代码

Demo

• 当点击分页控件按钮时会触发QueryCommand命令和路由事件，并传入相关参数，需要在查询完结果后将查询到的总数赋值给TotalCount以便更新UI显示的相关信息
  
• 当需要外部按钮来激发查询命令时，可绑定分页控件的pageQueryCommand
  

1. <Button
2.     x:Name="buttonQuery"
3.     Margin="10,0,0,0"
4.     HorizontalAlignment="Stretch"
5.     Content="查询"
6.     Command="{Binding ElementName=pageControl, Path=PageQueryCommand}"/>
7. <customControls:PagingControl
8.     x:Name="pageControl"
9.     HorizontalAlignment="Right"
10.     DockPanel.Dock="Bottom"
11.     LoadedTrigger="False"
12.     QueryCommand="{Binding PageQueryCommand}"
13.     TotalCount="{Binding TotalCount}" />
15. [RelayCommand]
16.     private async Task PageQuery(PagingInfo pagingInfo){
17. //通过数据库进行查询
18. TotalCount=查出结果数量
19.     }

复制代码

希望能给你带来帮助 --来自.net菜鸡粉丝的祝愿

来源:https://www.cnblogs.com/yinyuessh/p/18205496
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！