SenchaTouch 2.3 の hbox レイアウトのパネルで奇妙な問題が発生しました。ビューは Ext.Container を拡張します。構成は次のとおりです。
config: {
layout: "hbox",
style: "padding-bottom: 20px;",
items: [
{
xtype: "panel",
id: "stmc_info_buttons",
cls: ["stmc_info_buttons", "shadow"],
width: 350,
styleHtmlContent: true,
scrollable: true,
items: [{
xtype: "list",
grouped: false,
top: 0,
left: 0,
right: 0,
bottom: 0,
indexBar: false,
cls: "stmc_info",
id: "stmc_info_btn_entries",
variableHeights: false,
itemHeight: 35,
store: {
id: "stmc_info_store",
model: "Stbg.model.Info",
proxy: {
type: "ajax",
url: "resources/json/info.json",
reader: {
type: "json",
rootProperty: "info"
}
},
autoLoad: true
},
itemTpl: new Ext.XTemplate(
'<tpl switch="typ">',
'<tpl case="rubrik">',
'<div class="contact2 {csscls}">{titel}</div>',
'<tpl default>',
'<div class="contact2 stmc_info_entry">{titel}</div>',
'</tpl>'
)
}]
},
{
xtype: "panel",
layout: 'fit',
flex: 1,
id: "stmc_info_text",
scrollable: {
direction: 'vertical',
directionLock: true
},
cls: ["stmc_info_text", "shadow"]
}
]
}
左側のエントリをタップすると、右側のパネルに対応するコンテンツが表示されます。すべて正常に動作します。コンテンツがビューポートよりも「長い」場合は、スクロール可能にする必要があります。しかし、パネルを一番下までスクロールしてタブレットから指を離そうとすると、ビューが「ジャンプ」して一番上に戻ります。そのため、コンテンツの底に到達することはできません。エラーはどこにありますか?
パネル データを変更するメソッドは、次のことを行います。
loadText: function (loadUrl, target) {
Ext.Ajax.request({
url: loadUrl,
success: function (response, opts) {
var panel = Ext.getCmp(target);
if (panel != null) {
panel.setHtml(response.responseText);
}
},
failure: function (response, opts) {
...
}
});
}
追加情報: 読み込まれるコンテンツは純粋な HTML です。この問題は、Android タブレットでのみ発生します。Chrome でアプリをテストすると、スクロールは期待どおりに機能します。