[TIMOB-14154] iOS: SplitWindow inside TabGroup layout problems on rotation
| GitHub Issue | n/a |
|---|---|
| Type | Bug |
| Priority | Low |
| Status | Open |
| Resolution | Unresolved |
| Affected Version/s | Release 3.1.0, Release 3.2.0 |
| Fix Version/s | n/a |
| Components | iOS |
| Labels | layout, rotation, splitview, splitwindow, tabgroup |
| Reporter | Vittorio Sorbera |
| Assignee | Unknown |
| Created | 2013-06-04T09:27:57.000+0000 |
| Updated | 2018-02-28T20:03:52.000+0000 |
Description
*Problem description*
In my application I have a tabgroup. Each tab contains a SplitView that, inside, contains two navigation group (one for the detailwin and one for the masterwin). The problem is that the size of the window changes after the rotation of the device, or when you step from one tab to another.
*Steps to reproduce*
1. Run project in iPad simulator (portrait)
2. Rotate right (to landscape)
3. Switch to tab 2
4. Switch back to tab 1
5. Rotate right again (to portrait)
6. Observe that the portrait window is now smaller
1. Run project in iPad simulator (portrait)
2. Switch to tab 2
3. Switch back to tab 1
4. Rotate right (to landscape)
5. Observe that the landscape window is now larger
*Test case*
This is a generic code that reproduces the problem:
// create tabgroup
var tg = Ti.UI.createTabGroup();
var data = [];
for (var i = 0; i < 30; i++)
data.push({
title : "Row n° " + i
})
// TAB 1
// create windows for splitwindow view
var masterWin1 = Ti.UI.createWindow({
title : "Master Win 1"
});
var detailWin1 = Ti.UI.createWindow({
title : "Detail Win 1"
});
var tv1 = Ti.UI.createTableView({
data : data,
borderColor : "red",
borderWidth : 10,
top : 10,
bottom : 100,
right : 10,
left : 10
})
var tv2 = Ti.UI.createTableView({
data : data,
borderColor : "red",
borderWidth : 10,
top : 10,
bottom : 100,
right : 10,
left : 10
})
masterWin1.add(tv1)
detailWin1.add(tv2);
// create navigation group
var masterNav1 = Ti.UI.iPhone.createNavigationGroup({
window : masterWin1
});
var detailNav1 = Ti.UI.iPhone.createNavigationGroup({
window : detailWin1
});
// create splitwindow view
var splitView1 = Titanium.UI.iPad.createSplitWindow({
masterView : masterNav1,
detailView : detailNav1
});
splitView1.addEventListener('visible', function(e) {
Ti.API.info(JSON.stringify(e))
if (e.view == 'detail') {
e.button.title = "Master Win 1";
detailWin1.leftNavButton = e.button;
} else if (e.view == 'master') {
detailWin1.leftNavButton = null;
}
});
var tab1 = Titanium.UI.createTab({
title : "Tab 1",
window : splitView1
});
// TAB 2
// create windows for splitwindow view
var masterWin2 = Ti.UI.createWindow({
title : "Master Win 2"
});
var detailWin2 = Ti.UI.createWindow({
title : "Detail Win 2"
});
var tv3 = Ti.UI.createTableView({
data : data,
borderColor : "blue",
borderWidth : 10,
top : 10,
bottom : 100,
right : 10,
left : 10
})
var tv4 = Ti.UI.createTableView({
data : data,
borderColor : "blue",
borderWidth : 10,
top : 10,
bottom : 100,
right : 10,
left : 10
})
masterWin2.add(tv3)
detailWin2.add(tv4);
// create navigation group
var masterNav2 = Ti.UI.iPhone.createNavigationGroup({
window : masterWin2
});
var detailNav2 = Ti.UI.iPhone.createNavigationGroup({
window : detailWin2
});
// create splitwindow view
var splitView2 = Titanium.UI.iPad.createSplitWindow({
masterView : masterNav2,
detailView : detailNav2
});
splitView2.addEventListener('visible', function(e) {
Ti.API.info(JSON.stringify(e))
if (e.view == 'detail') {
e.button.title = "Master Win 2";
detailWin2.leftNavButton = e.button;
} else if (e.view == 'master') {
detailWin2.leftNavButton = null;
}
});
var tab2 = Titanium.UI.createTab({
title : "Tab 2",
window : splitView2
});
// add tabs to tab tabgroup and open
tg.addTab(tab1);
tg.addTab(tab2);
tg.open();
Tested and confirmed on iPad 6 simulator with Ti SDK 3.1 GA and 3.2 CI.