paging - 将加载更多对齐到底部 sencha touch 2.1

Question

我需要将负载更多地对齐到底部。请看下面我的屏幕截图：

CoupoonListView.js

     Ext.define('bluebutton.view.BlueButton.CouponList', {
        extend: 'Ext.dataview.DataView',
        xtype: 'couponlistcard',
        requires: [
            'Ext.field.Select',
            'Ext.field.Search',

            'Ext.plugin.ListPaging',
            'Ext.plugin.PullRefresh',
            'bluebutton.store.BlueButton.CouponList1'

        ],
        config: {

            styleHtmlContent: true,
            scrollable: 'vertical',

             store : { xclass : 'bluebutton.store.BlueButton.CouponList1'},



            id :'couponlist',
              masked: {
                xtype: 'loadmask',
                message: 'loading...'
            }, // masked
               plugins: [

//                            { xclass: 'Ext.plugin.PullRefresh',
//                                pullRefreshText: 'Pull down for more updates!',
//                                refreshFn:function(loaded, arguments){
//                                 
//                                   


//                                }
//                             
//                    
//                            },

                          { 
                               xclass: 'Ext.plugin.ListPaging',
//                                 autoPaging: true,


                          },

               ],


            itemTpl: Ext.create(
                'Ext.XTemplate',
                  '<div style="float:left;width=33%;margin:2px;"><div class="demo-weather">',
                            '<tpl for=".">',
                                '<div class="day">',
                                      '<div style="width:100%;font-weight: bold; text-decoration: underline;">{couponId}</div>',
                                          '<div style="margin-bottom: 40px; margin-left: 5px;">',
//                                            '<img src="{imgUrl}"  height= "100px" width="100%"/>',
                                         '</div>',
                                         '<div style="width:100%;font-weight: bold;">{couponName}</div>',
                                          '<div style="width:100%;font-weight: bold;">Point: {amount}</div>',
                                         '<input type="button" name="{couponId}" value="Purchase" ' +
                                            'style="padding:13px;"/>' ,

                                '</div>',
                            '</tpl>',
                        '</div></div>'








            ),



        },


    });

应用程序.Scss

//--GroupBy List  --
.tweet-wrapper {

  h2 { font-weight: bold; padding-bottom: 3px; }
  img { border-radius: 5px; float: left; }
  .tweet {
    font-size: 63%;
    margin-left: 60px;
    min-height: 40px;

  }
  .posted { float: right; }
}




//--Coupon List--
.demo-weather {
  text-align: center;
}
.day {
  display: inline-block;
  background-color: #f9f9f9;
  color: rgba(0, 0, 0, .6);
  text-shadow: #fff 0 1px 0;
  width: 12em;
  text-align: center;
  @include border-radius(15px);
  @include box-shadow(inset 0 0 4px #888);
  box-shadow: inset 0 0 4px #888;
  padding: 1em;
  margin: .5em;

  .x-android & {
    @include box-shadow(none);
  }
}
.date {
  font-size: .8em;
}
.icon img {
  @include border-radius(10px);
  margin: .6em;
  width: 5em;
}
.temp {
  margin-top: .2em;
  display: block;
  font-size: 2.2em;
  line-height: .5em;
}
.temp_low {
  display: inline;
  font-size: .5em;
  color: rgba(30, 30, 30, .5);
}


.x-tabbar.x-docked-top .x-tab .x-button-label, .x-tabbar.x-docked-top .x-tab .x-hasbadge .x-badge, .x-hasbadge .x-tabbar.x-docked-top .x-tab .x-badge {
font-size: .99em;

}

请指导我解决方案。谢谢

Answer 1

弄清楚了。

你错过了这个： infinite: true

只需包含它，它就会正常工作。加载更多按钮将移至底部。

问候

Answer 2

您是否尝试将 ListPaging 插件的停靠配置设置为底部？例如：

{
    xclass: 'Ext.plugin.ListPaging',
    docked:'bottom'
}