DevExpress控件使用交流,DevExpress中国社区 售前咨询
当前位置: 首页 > 新闻 » 无限分页 - 用DevExpress ASP.NET实现鼠标滚动自动加载内容

无限分页 - 用DevExpress ASP.NET实现鼠标滚动自动加载内容

作者:huhm   来源:本站   浏览:Loading...次   发布时间:2012-05-09   评论:0条

先看一下最终效果:

无限分页 - 用DevExpress ASP.NET实现鼠标滚动自动加载内容

使用DevExpress ASP.NET实现上图效果的方法

您可以用以下DevExpress ASP.NET控件实现上图中的效果:

  • ASPxCallback
  • ASPxLoadingPanel
  • ASPxPanel
  • ASPxClientUtils对象中的JavaScript方法

你可以到示例代码中心查看代码:

ASPxCallback - 鼠标滚动时如何加载内容 - 当鼠标向下滚动时自动加载内容

下面让我们看看"无限分页"方案能给我们带来的好处和一些可能会遇到的问题。

大型数据集

现在大数据集在网络上随处可见,一旦用户需要处理这些一T或更多的信息时,你该怎么办呢?你可以将它们分成小块的数据分页:

无限分页 - 用DevExpress ASP.NET实现鼠标滚动自动加载内容

无限分页或无限滚动

无限分页 (或无限滚动)被许多公司使用,如Facebook、Bing、腾讯、新浪、twitter等。

当一个页面有大量内容提交时,无限分页是一个不错的选择。一些不需要显示的数据内容没有必要一次性加载和显示,当用户鼠标向下滚动时,再自动加载更多的数据。(像上面的gif动画显示的那样)

为什么用无限分页?

我建议这种做法,原因有两个:

  1. 性能 - 当你没有一次性加载数千行和数百列数据时,你的网站速度会更快。
  2. 流畅 - 最终用户可以使用AJAX无缝加载更多信息继续他们的体验。

Jeff Atwood有一个梦幻般的博客文章,标题为"分页的结束"。我从里面截取了一小段:

在完美世界里,每一个搜索结果都在一个页面,只有一条记录并且就是你正想找的。

分页也是阻力。

我的意思不是说所有的分页都应当被无限分页代替,但是我们作为软件开发者,应当避免产生成千上万的列表和分页,这无疑增大了用户的负担。记住,我们发明计算机是为了使人们的生活更容易,而不是更困难。

Google研究证实最终用户通常不喜欢看到所有的数据:

用户测试报告告诉我们搜索者更喜欢整页浏览、单页内容的版式,而不是只包含部分内容和许多分页符的页面。

有趣的是,用户不喜欢整页浏览花长时间加载(例如,当整页浏览加载需要一些时间时,用户认为它包含许多图像)。这是有道理的,因为我们知道,用户对缓慢不太满意。所以,整页浏览通常先加载需要显示的部分。作为一个站长,重要的是要平衡这种偏好页面的加载时间和整体用户体验。

无限滚动也有一些缺点,比如滚动条的问题,深层链接,后退按钮的位置,以及其他Jeff的文章(The End of Pagination)中提到的问题。

实验,重复,实验...

重复和测试各种可用性方案是良好用户界面的关键。我建议你使用DevExpress ASPxCallBack,ASPxLoadingPanel等尝试无限分页。无限分页的功能包含在ASPxGridView中:ASPxGridView Virtual scrolling/paging示例

你应该努力使分页无关高于一切,因为用户永远只会看到他们需要的那一条内容。 -Jeff Atwood

示例代码

示例代码中心的操作流程如下:

  • 渲染后,当用户鼠标向下滚动页面,我们就处理浏览器"滚动"事件。
  • 当滚动到页面的底部,我们产生一个回调(使用ASPxCallback),从服务器获得新的数据部分。
  • 然后,我们将已收到的内容添加到dataContainerElement DIV元素的后面。
本站文章除注明转载外,均为本站原创或翻译
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明:文章转载自:DevExpress控件中文网 [http://www.devexpresscn.com/]
本文地址:http://www.devexpresscn.com/news/news-86.html

评论列表

暂无评论

请谈谈你的看法 请使用IE或者Firefox浏览器,暂不支持Chrome!

昵称 不填则默认为游客评论

DevExpress DXperience DXv2 v12

DevExpress DXperience 下载 download

DevExpress购买、价格、授权

慧都控件网为DevExpress界面控件的中国地区唯一正式授权经销商,正版控件销售公司,授权代理商,经销商及合作伙伴。

电话:400-700-1020
        023-66090381

邮箱:sales@evget.com

>>如何选择正规控件购买渠道