65.9K
CodeProject 正在变化。 阅读更多。
Home

带记录数显示的 DataPager - Silverlight

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.87/5 (4投票s)

2012年5月10日

CPOL

2分钟阅读

viewsIcon

30041

downloadIcon

602

DataPagerPlus 允许用户在分页器上显示导航按钮(右)、页码(中)和总记录数(左)

介绍 

分页 (DataPager) 是 Silverlight 3.0 中的内置控件。我扩展了它的行为,并实现了“显示 X – Y of Z Records”的功能。
 

我已在 http://saffroze.com/advanced-datapager-with-displaying-record-number-in-silverlight/  上发表了文章

背景 

以下是 DataPager 元素的一些背景 定义

  1. DataPager
    DataPager 类用于对数据进行分页,并显示数据绑定控件的导航控件,并显示诸如“显示 1-5 的 12 条记录”之类的文本。
    <Control:DataPagerPlus Name="pagerEmployees" Grid.Row="1" PageSize="5" VerticalAlignment="Top" HorizontalAlignment="Stretch" /> 
  2. PagedCollectionView
    表示用于分组、排序、筛选和导航分页数据集合的视图 
    PagedCollectionView employees = new PagedCollectionView(Employees.Load()); 
  3. ResourceDictionary(资源字典)
    资源字典是一个键控的对象字典,可以在 XAML 和代码中使用。XAML 是最常见的用法,特别是用于在资源字典中初始定义对象资源。 我修改了 DataPage 的默认样式,并添加了 TextBlock 以显示记录数。 我使用 Expression Blend 修改 DataPager 样式。 手动编辑非常复杂且冗长。 这些是我在样式中所做的少量更改。
    <Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:Class="SampleDataPager.App"
     xmlns:test="clr-namespace:AdvancedDataPager;assembly=AdvancedDataPager"
     xmlns:Control="clr-namespace:AdvancedDataPager;assembly=AdvancedDataPager">
     <Application.Resources>
     <ResourceDictionary>
    .
    .
    <TextBlock x:Name="txtPage" Grid.Column="10" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5,0,5,0" Text="{Binding DisplayRecordsText, RelativeSource={RelativeSource TemplatedParent}}"/>
    .
    .
    </ResourceDictionary>
     </Application.Resources>
    </Application> 
     
  4. Employee (员工)
    为了测试此帖子中的分页,我创建了一个“Employee”类型的类来存储每个联系人的员工 ID、姓名、部门和工资以及示例数据
    public class Employee
     {
     public int EmployeeID { get; set; }
     public string Name { get; set; }
     public string Department { get; set; }
     public double Salary { get; set; }
     }
  5. DataGrid
    在可自定义的网格中显示数据。 
    <sdk:DataGrid Name="grdEmployees" Grid.Row="0" AutoGenerateColumns="True" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" /> 

实现

  • 从以下位置添加 AdvancedDataPager.dll 的引用
    ..\AdvancedDataPager\AdvancedDataPager\Bin\Debug.
  • 按照以下方式将 DataPagerPlus 从工具箱拖到 Page.xaml。   
  • 在 MainPage.xaml 中添加以下代码
    <UserControl x:Class="SampleDataPager.MainPage"
     xmlns:Control="clr-namespace:AdvancedDataPager;assembly=AdvancedDataPager"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
     mc:Ignorable="d"
     d:DesignHeight="400" d:DesignWidth="500">
    <Grid x:Name="LayoutRoot" Background="White" Width="500" Height="400">
     <Grid.RowDefinitions>
     <RowDefinition></RowDefinition>
     <RowDefinition></RowDefinition>
     </Grid.RowDefinitions>
     <sdk:DataGrid Name="grdEmployees" Grid.Row="0" AutoGenerateColumns="True" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
     <Control:DataPagerPlus Name="pagerEmployees" Grid.Row="1" PageSize="5" VerticalAlignment="Top" HorizontalAlignment="Stretch" />
     </Grid>
    </UserControl> 
  • 在 MainPage.xaml.cs 中添加以下代码,用于将数据绑定到 DataGrid 并将其 ItemSource 分配给 DataPagerPlus。 
    PagedCollectionView employees = new PagedCollectionView(Employees.Load());
     grdEmployees.ItemsSource = employees;
     pagerEmployees.Source = grdEmployees.ItemsSource;
    Employees.Load() function will return list of employees
    public class Employees : ObservableCollection<Employee>
     {
     public static ObservableCollection<Employee> Load()
     {
     ObservableCollection<Employee> objColEmp = new ObservableCollection<Employee>();
     objColEmp.Add(new Employee { EmployeeID = 1001, Name = "Imdadhusen Sunasara", Department = ".Net", Salary = 15000 });
     objColEmp.Add(new Employee { EmployeeID = 1002, Name = "Manoj Savalia", Department = ".Net", Salary = 11000 });
     objColEmp.Add(new Employee { EmployeeID = 1003, Name = "Ravi Patel", Department = "Java", Salary = 9000 });
     objColEmp.Add(new Employee { EmployeeID = 1004, Name = "Vasim Saiyad", Department = "Java", Salary = 8000 });
     objColEmp.Add(new Employee { EmployeeID = 1005, Name = "Jaypal Chawda", Department = "QA", Salary = 11000 });
     objColEmp.Add(new Employee { EmployeeID = 1006, Name = "Ashish Rawal", Department = ".Net", Salary = 1000 });
     objColEmp.Add(new Employee { EmployeeID = 1007, Name = "Hasan Sunasara", Department = "Java", Salary = 18000 });
     objColEmp.Add(new Employee { EmployeeID = 1008, Name = "Ambicaprasad Maurya", Department = ".Net", Salary = 12000 });
     objColEmp.Add(new Employee { EmployeeID = 1009, Name = "Sagar Rawal", Department = "Flex", Salary = 7000 });
     objColEmp.Add(new Employee { EmployeeID = 1010, Name = "Harsh Contractor", Department = ".Net", Salary = 8000 });
     objColEmp.Add(new Employee { EmployeeID = 1011, Name = "Jigar Pandya", Department = "Android", Salary = 12000 });
     objColEmp.Add(new Employee { EmployeeID = 1012, Name = "Rakesh Jogani", Department = "Flex", Salary = 7000 });
     return objColEmp;
     }
     }
  • 在 App.xaml 中修改 Application.Resources 以显示记录编号
    <Application.Resources>
     <ResourceDictionary>
     <Style TargetType="Control:DataPagerPlus" >
    .
    .
    .
    .
    <TextBlock Grid.Column="10" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5,0,5,0" Text="{Binding DisplayRecordsText, RelativeSource={RelativeSource TemplatedParent}}"/>
     </Grid>
     </Border>
     </Grid>
     </ControlTemplate>
     </Setter.Value>
     </Setter>
     </Style>
     </ResourceDictionary>
     </Application.Resources> 
     

组件逻辑 

  • 扩展 DataPager
    public class DataPagerPlus : DataPager
  • 创建用于显示记录数的依赖属性。(根据 MSDN,“依赖属性提供了一种基于其他输入的值来计算属性值的方法。 这些其他输入可能包括诸如主题和用户首选项之类的系统属性、诸如数据绑定和动画/故事板之类的即时属性确定机制、诸如资源和样式之类的多用途模板,或者通过与元素树中其他元素的父子关系已知的值。 此外,可以实现依赖属性以提供独立的验证、默认值、监视其他属性更改的回调以及可以基于潜在运行时信息强制属性值的系统”)
  • 在控件加载事件上注册 PageIndexChanged 事件以更新显示的页码文本。 
    this.PageIndexChanged += new EventHandler(CustomPager_PageIndexChanged);
  • 当页面索引更改时,调用函数以在 DataPagerPlus 上显示文本。
    private void CustomPager_PageIndexChanged(object sender, EventArgs e)
            {
                SetDisplayRecordsText(sender);
            }
  • 显示文本的实际代码。
    private void SetDisplayRecordsText(object sender)
            {
                int RecordCount = (base.ItemCount == 0) ? ((PagedCollectionView)((DataPager)(sender)).Source).ItemCount : base.ItemCount;
                int PageSize = base.PageSize;
                int PageIndex = (base.PageIndex + 1);
     
                int currentEndRow = (PageIndex * PageSize);
                if (currentEndRow > RecordCount) currentEndRow = RecordCount;
     
                if (currentEndRow < PageSize) PageSize = currentEndRow;
    int currentStartRow = (RecordCount > 0) ? (currentEndRow - PageSize) + 1 : 0;
     
                int TotalRecordsOnPage = (PageIndex * PageSize) - RecordCount;
                currentStartRow = (TotalRecordsOnPage == 1) ? currentEndRow : ((PageIndex - 1) * PageSize) + 1;
                this.DisplayRecordsText = string.Format("Displaying record(s) {0:0}-{1:0} of {2:0}", currentStartRow, currentEndRow, RecordCount);
            } 

    您的想法

    如果您发现任何问题或错误,请留下评论或发送电子邮件给我。 如果您对此做任何笔记,也请告诉我,这样我就不必重做您的辛勤工作。 如果这有帮助,请提供 “投票”。 

© . All rights reserved.