Description of the problem
When opening a tab on some devices, the screen flickers. It looks like the new tab open is closing and then opening.
The problem is not happening all the time, and apparently only on some devices. In particular, it seems 4.1.x is affected.
Steps to reproduce
1) Use the code below
2) Run the app and click on the table rows
3) Go back and forth, until the issue is shown
var tbGroup = Ti.UI.createTabGroup({
navBarHidden : true
});
var win1 = Ti.UI.createWindow({
title : "win1"
});
var tableData = [{
title : 'Apples'
}, {
title : 'Bananas'
}, {
title : 'Carrots'
}, {
title : 'Potatoes'
}];
var table = Ti.UI.createTableView({
data : tableData,
minRowHeight : 50
});
win1.add(table);
var win2 = Ti.UI.createWindow({
title : "win2"
});
win2.add(table);
var tb1 = Ti.UI.createTab({
window : win1,
title : 'Tab1'
});
table.addEventListener('click', function(e) {
var indicator = Ti.UI.Android.createProgressIndicator({
message : 'Loading...',
location : Ti.UI.Android.PROGRESS_INDICATOR_DIALOG,
type : Ti.UI.Android.PROGRESS_INDICATOR_INDETERMINANT
});
indicator.show();
var win = Ti.UI.createWindow({
navBarHidden : false,
title : 'specialtyName'
});
win.open();
indicator.hide();
});
var tb2 = Ti.UI.createTab({
window : win2,
title : 'Tab2'
});
tbGroup.addTab(tb1);
tbGroup.addTab(tb2);
tbGroup.open();
This bug is happening b/c activityIndicator was showing and hiding too quickly. When activityIndicator shows, it blurs the content in the background, and when it is hidden, either via hide() or another activity open on top of it, the background content is unblur. On fast devices, this process happens very quickly, causing flickering effect. This is native behavior and there is a viable workaround: Use Ti.UI.ActivityIndicator. It serves the same purpose, but since its not a dialog, it won't blur the content. For the above example, you can simply add an activityIndicator to the window that is containing the table view:
table.addEventListener('click', function(e) { var activityIndicator = Ti.UI.createActivityIndicator({ color: 'green', message: 'Loading...', height:Ti.UI.SIZE, width:Ti.UI.SIZE }); win1.add(activityIndicator); var win = Ti.UI.createWindow({ navBarHidden : false, title : 'specialtyName' }); win.addEventListener('open', function(e) { win1.remove(activityIndicator); }); win.open(); });Closing ticket as "Won't Fix".