[AC-2557] MobileWeb: cannot navigate in ScrollableView after adding a view
| GitHub Issue | n/a |
|---|---|
| Type | Bug |
| Priority | n/a |
| Status | Closed |
| Resolution | Invalid |
| Resolution Date | 2013-02-06T20:51:01.000+0000 |
| Affected Version/s | n/a |
| Fix Version/s | n/a |
| Components | Titanium SDK & CLI |
| Labels | n/a |
| Reporter | Yaroslav Pidstryhach |
| Assignee | Shak Hossain |
| Created | 2013-01-28T13:09:04.000+0000 |
| Updated | 2016-03-08T07:41:37.000+0000 |
Description
Reproduction steps:
1. Create views for a ScrollableView (3 views, for example)
2. Create a ScrollableView with thees views
3. Create a new view and add this view to the ScrollableView using the function addView()
4. Try to navigate into the new view.
Expected behavior:
View appears on the screen after setting the view number into the currentPage property.
Actual behavior:
Black screen appears instead of the requested view.
Example:
var win = Ti.UI.createWindow();
// Step 1
var view1 = Ti.UI.createView({ backgroundColor:'#123' });
var view2 = Ti.UI.createView({ backgroundColor:'#246' });
var view3 = Ti.UI.createView({ backgroundColor:'#48b' });
// Step 2
var scrollableView = Ti.UI.createScrollableView({
views:[view1,view2,view3],
showPagingControl:true
});
win.add(scrollableView);
win.open();
// Step 3
var viewYellow = Ti.UI.createView({ backgroundColor: "yellow"});
scrollableView.addView(viewYellow);
// Step 4
scrollableView.currentPage = 3;
It seems as though when you set the views using the "views:" property, and then later add a view using the add method, the added view goes to the front of the index. I changed your code to something that fixes the problem and keeps your code more consistent. If you always use the .add() then I dont think you should have a problem. It is always advised to use the .add() function when wanted to add views to something and not use the views: property since it does not react well if you need to change (add or remove) the views in the future. Try this: ~~~ var win = Ti.UI.createWindow(); // Step 1 var view1 = Ti.UI.createView({ backgroundColor:'#123' }); var view2 = Ti.UI.createView({ backgroundColor:'#246' }); var view3 = Ti.UI.createView({ backgroundColor:'#48b' }); // Step 2 var scrollableView = Ti.UI.createScrollableView({ //views:[view1,view2,view3], showPagingControl:true, layout: 'vertical' }); scrollableView.add(view1); scrollableView.add(view2); scrollableView.add(view3); win.add(scrollableView); win.open(); // Step 3 var viewYellow = Ti.UI.createView({ backgroundColor: "yellow"}); scrollableView.addView(viewYellow); // Step 4 scrollableView.currentPage = 3; ~~~ and your code works as expected. Do not use the views property to add views and then use a .add as the inconsistency will cause problems. Regards, Carter