sencha touch 2.2 为list PullRefresh插件添加refreshFn方法

sencha touch 2.2 list PullRefresh插件没有refreshFn方法

但是我们又需要他,所以需要自行扩展

代码如下

 1 /**

 2 * 重写下拉刷新插件,以支持refreshFn事件

 3 */

 4 Ext.define('ux.plugin.RefreshFn', {

 5     extend: 'Ext.plugin.PullRefresh',

 6     alias: 'plugin.refreshFn',

 7     requires: ['Ext.DateExtras'],

 8     xtype:'refreshFn',

 9     config: {

10         /**

11         *@ CFG {功能} refreshFn函数将被调用以刷新列表。

12         *如果没有定义,store里的函数将被调用。

13         */

14         refreshFn: null, 

15         lastUpdatedText: '上次刷新时间:',

16         loadingText: '加载中...',

17         pullRefreshText: '下拉可以手动刷新',

18         releaseRefreshText: '松开可以刷新',

19         lastUpdatedDateFormat: 'Y-m-d H:i'

20     },

21 

22     loadStore: function () {

23         var me = this,

24         list = me.getList(),

25         scroller = list.getScrollable().getScroller();

26         me.setViewState('loading');

27         me.isReleased = false;

28         Ext.defer(function () {

29             scroller.on({

30                 scrollend: function () {

31                     if (me.getRefreshFn()) {

32                         me.getRefreshFn().call(me, me);

33                     } else {

34                         me.fetchLatest();

35                     }

36                     me.resetRefreshState();

37                 },

38                 delay: 100,

39                 single: true,

40                 scope: me

41             });

42             scroller.minPosition.y = 0;

43             scroller.scrollTo(null, 0, true);

44         },

45         500, me);

46     }

47 });

用法:

 1 Ext.define('app.view.list.Xml', {

 2     alternateClassName: 'listXml',

 3     extend: 'Ext.List',

 4     requires: ['ux.plugin.RefreshFn'],

 5     xtype: 'listXml',

 6     config: {

 7         title: 'Xml取值',

 8         itemTpl: '{title}',

 9         plugins: [{

10             xtype: 'refreshFn',

11             refreshFn: function (loaded, arguments) {

12                 //开始刷新触发的时间,默认效果是只刷新第一页数据。不管后面显示了多少数据

13                 //这里进行了处理,触发时清空所有数据,重新加载第一页数据。

14                 loaded.getList().getStore().loadPage(1);

15             }

16         }],

17         store: 'blogList'

18     }

19 });

 

具体示例参见:http://www.cnblogs.com/mlzs/p/3382229.html

 

sencha touch 2.2 为list PullRefresh插件添加refreshFn方法

你可能感兴趣的:(Sencha Touch)