使用 PagedCollectionView 分页 Silverlight DataGrid 中的记录






4.96/5 (15投票s)
您是否在 DataGrid 中拥有大量数据,并希望集成分页功能来逐页显示记录,但又不知道如何操作?那么本文将帮助您了解这一点。
引言
您是否在 DataGrid 中拥有大量数据,并希望集成分页功能来逐页显示记录,但又不知道如何操作?那么本文将帮助您了解这一点。
阅读本文后,您将能够通过一个简单的技巧为您的 DataGrid 集成分页,以自动完成分页。请阅读完整文章以了解更多信息。非常欢迎提供反馈/建议。
背景
希望您已阅读前两篇文章:“使用 PagedCollectionView 在 Silverlight DataGrid 中对记录进行分组”和“使用 PagedCollectionView 在 Silverlight DataGrid 中过滤记录”,如果还没有,请先阅读这两篇文章再开始阅读本文。因为您将了解我们在 ViewModel 中用于存储记录的 PagedCollectionView。
在本文中,我们将讨论如何集成 DataPager 来分页 DataGrid 中的记录。我们将讨论自定义 DataPager 外观以显示不同页面的各种选项。
我们将为我们的记录创建以下分页
让我们开始在我们之前的两篇文章中使用的现有 XAML 中添加 DataPager 进行实现。
添加 DataPager
打开您添加 DataGrid 的 XAML 页面。只需在 DataGrid 正下方添加以下代码:
您需要设置分页器的 DisplayMode。总共有 6 种 DisplayMode,分别为“FirstLastPreviousNextNumeric”、“FirstLastNumeric”、“FirstLastPreviousNext”、“Numeric”、“PreviousNext”和“PreviousNextNumeric”。选择其中任何一种。
将 PageSize 设置为“3”。这将在每页上显示 3 条记录。如果您将其更改为 n(n 定义任何正整数),它将仅在您的数据网格中每页显示 n 条记录。
最后,将 Source 设置为您想要分页的集合。在我们的例子中,它是位于 ViewModel 中的“Employees”属性。这正是我们的 PagedCollectionView。
XAML 的更改就到这里。您无需编写/修改任何其他代码。运行您的应用程序。您将看到它的实际效果。
更多关于 DisplayMode
正如我们之前提到的,DataPager 中有 6 种 Display Mode。让我们开始讨论它们中的每一种。以下是不同 DisplayMode 的单独屏幕截图:
设置 FirstLastPreviousNextNumeric 显示模式将为您提供导航到首页、上一页、下一页和末页的选项。它还将显示分页器中的页数。您可以单击它们来导航到特定页面。
设置 FirstLastNumeric 选项将为您提供导航到首页、末页和各个编号页的选项。
同样,设置 FirstLastPreviousNext 选项将为您提供导航到首页、上一页、下一页和末页的选择。与其他两个选项一样,这里不会有分页数字,但会有输入所需页码的选项。
如果您将 Numeric 设置为 Display Mode,您将只能在屏幕上看到页码。没有导航到首页、上一页、下一页或末页的选项。您必须单击页码才能导航到特定页面。
PreviousNext 显示模式将为您提供导航到上一页和下一页的选项。这里没有可点击的页码,但您可以输入所需的页码直接跳转。此选项将显示“Page x of y”,其中 x 是当前页,y 是总页数。
最后一个选择是 PreviousNextNumeric。在这里,您将能够导航到上一页、下一页,并且还可以单击任何所需的页码。
根据上述解释,我认为您现在已经熟悉了 DataPager 中的 DisplayMode 选项。那里添加的图片将为您提供更好的选项可见性。
如果运行应用程序,您将能够通过单击末页、上一页、下一页或末页来在每个页面之间导航。如果设置了选项,您将能够单击所需的页码直接导航到该页面。
更多关于 PageSize
设置 PageSize=”3”将设置每页的最大记录数。如果您逐页导航,您会发现所有页面都有相同数量的记录(在我们的例子中是 3)。最后一页的记录可能少于或等于 PageSize 的数量。在我们的例子中,最后一页只有 2 条记录。
担心分组和/或过滤中的分页逻辑?无需担心。让我们对记录进行分组。从下拉列表中选择任何分组选项。您会看到,这里的记录也是根据 PageSize 进行分组的。导航到其他页面,您会看到每页的记录数相同。
让我们对记录进行过滤。太棒了!这也奏效了。您会看到页面大小固定为最多 3 条记录(在我们的例子中是 3 条,因为我们设置了 PageSize 为 3)。
现在,请做一件事。将 PageSize 更改为 4,您将看到每页的记录数已更改为相同,即 4。您还会注意到页数已全部减少到 2。这一切都取决于记录总数和 PageSize。
以下是完整的 XAML 代码供您参考:
<UserControl
xmlns=" height="20"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:viewmodels="clr-namespace:DataGridDemo1.ViewModels"
x:class="DataGridDemo1.Views.MainView" x:key="MainViewModel"
background="White" datacontext="{StaticResource MainViewModel}"
orientation="Horizontal" selectionchanged="ComboBox_SelectionChanged"
content="City" text="Filter Records by: " textchanged="TextBox_TextChanged"
isreadonly="True" itemssource="{Binding Employees}" x:name="LayoutRoot"
displaymode="FirstLastPreviousNextNumeric" pagesize="3"
numericbuttoncount="3" margin="10" horizontalalignment="Left"
verticalalignment="Center" source="{Binding Employees}">
结束语
希望本文能帮助您理解 DataGrid 的分页魔力。下次如果您想使用 DataPager,本文将帮助您非常轻松地实现该功能。示例应用程序代码也随本文一起提供。您可以自由下载。您会注意到,只需在您的页面上添加一行 XAML 代码,就可以完成所有操作,前提是您从一开始就使用 PagedCollectionView 实现了基本属性。希望您真的很喜欢阅读这篇文章。我感谢任何反馈和/或建议。如果您有任何要讨论的主题,请在此处留言。我将尽力回答您的疑问。
历史
- 2011 年 1 月 2 日:初次发布