简体   繁体   中英

Sencha Touch :: Scroll not working on mobile devices

Problem

My Problem is that Scrolling on a group list does not work on a mobile device, it works fine on a desktop.

On all devices you can't view last part of the list, it just keeps bouncing back.

So here's the code.

Ext.regModel('HotelModel', {
    fields: ['name', 'narrative']
});
var hotelStore = new Ext.data.Store({
    model: 'HotelModel',
    getGroupString : function(record) {
        return record.get('name')[0];
    },
    sorters:'name',
    autoLoad: false
});
BBTM.views.hotelList = new Ext.List({
    id: 'hotelList',
    fullscreen: true,
    itemTpl: '<div class="list-item-title">{name}</div>' + '<div class="list-item-narrative">{narrative}</div>',
    grouped : true,
    allowDeselect: true,
    clearSelectionOnDeactivate: true,
    xtype: 'list',
    indexBar: true,
    store: hotelStore,
    singleSelect: true,
    // layout: 'card',
    flex: 1
});
BBTM.views.hotelListContainer = new Ext.Panel({
    id: 'hotelListContainer',
    layout: 'card',
    fullscreen: true,
    dockedItems: [BBTM.views.hotelToolbar,BBTM.views.hotelList]
});
BBTM.views.hotelsListView = new Ext.Panel({
    id: 'hotelsListView',
    layout: 'card',
    fullscreen: true,
    items: [BBTM.views.hotelListContainer]
});
var App = new Ext.Application({
name : 'BBTM',
useLoadMask : true,
launch : function () {
    BBTM.views.viewport = new Ext.Panel({
        fullscreen: true,
        layout: 'card',
        cardAnimation: 'slide',
        items: [
            BBTM.views.hotelsListView
        ]
    });
}
})

Remove fullscreen and give config

  scrollable: {
        direction: 'vertical',
        directionLock: true
  },
  flex:1,
  height: '100%'

尝试删除全屏:从您的酒店列表为true

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM