Easy:
1) Add below JS code to MainForm's Script property
Ext.override(Ext.Panel, {
afterRender: Ext.Panel.prototype.afterRender.createSequence(function() {
if (this.getXType() == 'panel') {
this._getIScrollElement = function() {
return (this.el.child('.x-panel-body', true));
}
}
//Uncomment below to use iScroll only on mobile devices but use regular scrolling on PCs.
if (this.autoScroll /*&& Ext.isMobileDevice*/) {
if (this._getIScrollElement) {
this._updateIScroll();
this.on('afterlayout', this._updateIScroll);
}
}
}),
_ensureIScroll: function() {
if (!this.iScroll) {
var el = this._getIScrollElement();
if (el.children.length > 0) {
this.iScroll = new iScroll(el);
this.iScrollTask = new Ext.util.DelayedTask(this._refreshIScroll, this);
}
}
},
_updateIScroll: function() {
this._ensureIScroll();
if (this.iScroll) {
this.iScrollTask.delay(1000);
}
},
_refreshIScroll: function() {
this.iScroll.refresh();
//Refresh one more time.
this.iScrollTask.delay(1000);
}
});
Ext.override(Ext.tree.TreePanel, {
_getIScrollElement: function() {
return (this.el.child('.x-panel-body', true));
}
});
Ext.override(Ext.grid.GridPanel, {
_getIScrollElement: function() {
return (this.el.child('.x-grid3-scroller', true));
},
afterRender: Ext.grid.GridPanel.prototype.afterRender.createSequence(function() {
//TODO: need to hook into more events and to update iScroll.
this.view.on('refresh', this._updateIScroll, this);
})
});
2) Download iScroll.js file and add it to UniServerModule->CustomFiles