Ext.Container scrollable

1.滚动带页面container顶部

  1. var me = this,
  2. scroller = me.getScrollable().getScroller();
  3. scroller.scrollToTop();

2.内容不显示

原因:设置了scrollable的同时,需要设置容器在滚动方向的高度或宽度

3.container回弹:滚动一小段,松开后又回到顶部

描述:

某页面下trade-record container 组件

  1. var com = Ext.Viewport.down('#trade-record');
  2. var scrollView = com.getScrollable();
  3. var scroller = scrollView.getScroller();

原因:

scroller的maxposition会影响scroller滑动后的位置,如果为{x:0,y:0}时,会找出回弹,给maxposition设置了值后,可以达到滑动哪儿停在哪儿的效果,但是有的时候,scroller.getSize() 和 scroller.getContainerSize() 会出现相等的情况,也就是maxposition为0,0 的情况,就会会弹回去,所以我们可以根据具体情况手动的设置maxposition的值。

  1. scroller.getMaxPosition().y =
  2.     scroller.getSize() - scroller.getContainerSize();

scroller的maxposition在触发maxpositionchange事件时计算。

解决方案:

监听maxpositionchange事件,手动计算maxposition。

  1. eg:
  2. setScrollMaxPosition: function(data){
  3.         var me = this,
  4.             l = data.transaction.length,
  5.             itemHeight = 2*20*HEIGHT_SCALE,
  6.             scroller = me.down('#trade-record').getScrollable().getScroller();
  7.         scroller.maxPosition = {
  8.             x: scroller.maxPosition.x,
  9.             y: l*itemHeight
  10.         };
  11.         scroller.on('maxpositionchange', function(s, maxPosition){
  12.             scroller.maxPosition = {
  13.                 x: maxPosition.x,
  14.                 y: l*itemHeight
  15.             };
  16.         });
  17.     },

转载于:https://www.cnblogs.com/jun3101s/p/5845618.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值