I have spent 2 days trying to figure out the Panel bug but no solution. I created a simple app consisting of a panel and a list:
HTML Code:
...
Ext.fly('appLoadingIndicator').destroy();
var panel = Ext.create('Ext.tab.Panel', {
tabBarPosition: 'bottom',
items: [
{
id: 'tabBarItemHome',
title: 'Home',
iconCls: 'home',
layout: 'fit'
},
{
title: 'Contact',
iconCls: 'user'
}
]});
var myList = Ext.create('Ext.List', {
itemTpl: '{title}',
data: [
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'},
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'},
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'},
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'},
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'},
{title: 'Item 1'},{title: 'Item 2'},{title: 'Item 3'},{title: 'Item 4'}
]});
Ext.Viewport.add(panel);
panel.getComponent('tabBarItemHome').add(myList);
...
using together with default .css and .js files, index file contains just microloader...
when I run it on HTC desire (android 2.3.3) the app looks ok, when I run the same app on Samsung sIII (adnroid 4.0.4) the panel buttons seems to be broken when randomly scrolling list up and down:- sometime there is a proper icon (expected)
- sometime there is just a blue rectangle (I can fix myself via css)
- sometime all buttons just dissappear (unable to fix this bug)
The most irritating thing is when the panel menu suddenly dissappear
... I guess its a bug related to css interpretation / rendering but not sure. Can anyone help me out?