[TIMOB-20196] iOS: on ScrollableView is not possible to change views

GitHub Issue	n/a
Type	Bug
Priority	Critical
Status	Closed
Resolution	Fixed
Resolution Date	2016-01-06T21:21:11.000+0000
Affected Version/s	Release 5.1.1
Fix Version/s	Release 5.2.0
Components	iOS
Labels	ScrollableView
Reporter	Mauro Piccotti
Assignee	Angel Petkov
Created	2016-01-04T17:57:25.000+0000
Updated	2016-01-13T22:54:39.000+0000

Description

In a widget I have a ScrollableView where I need to change views. It stopped to work from version 5.1.0. When I set the "views" property with another collection of views the app remains blocked, without any error. I tryed other solution (like insertAt or replaceAt) but I cannot dynamically change views anymore. The widget is this one: https://github.com/apra-informatica/Ti.ImageGallery/blob/master/controllers/widget.js And the code: var index = 0; var newView = Ti.UI.createView(); var views = $.scrollableView.views; views[index].removeAllChildren(); views[index] = newView; $.scrollableView.views = views;

Comments

Sharif AbuDarda 2016-01-05

Hello, I tested this issue. This is a valid bug in the latest SDKs. Changing ScrollableView's view stop working in SDK 5.1.0.GA and onward. In Android it's working fine though. Please follow the sample code below.

   var win = Ti.UI.createWindow();
   
   var view1 = Ti.UI.createView({ height: 300, backgroundColor:'#123' });
   var view2 = Ti.UI.createView({ height: 300, backgroundColor:'#246' });
   var view3 = Ti.UI.createView({ height: 300, backgroundColor:'#48b' });
   
   var view4 = Ti.UI.createView({ height: 300, backgroundColor:'#f34' });
   var view5 = Ti.UI.createView({ height: 300, backgroundColor:'#3f4' });
   var view6 = Ti.UI.createView({ height: 300, backgroundColor:'#34f' });
   
   var scrollableView = Ti.UI.createScrollableView({
     views:[view1,view2,view3],
     showPagingControl:true
   });
   
   win.add(scrollableView);
   var button = Titanium.UI.createButton({
      title: 'Hello',
      bottom: 10,
      width: 100,
      height: 50
   });
   win.add(button);
   button.addEventListener('click',function(e)
   {
      scrollableView.views = [view4,view5,view6];
      Titanium.API.info("You clicked the button");
   });
   
   win.open();

Test Environment

Cli 5.1.0 SDK 5.1.0.GA, 5.1.1.GA iOS 9.1 Android 4.4.2 This is a valid bug.

Chee Kiat Ng 2016-01-05
Mauro Piccotti 2016-01-05

I hope it's the same problem.
Chee Kiat Ng 2016-01-06

Reopening ticket. Need to be revisited as it may not be the same issue as the duplicate.
Eric Merriman 2016-01-06

[~cng] It doesn't look fixed with 5.1.2. We should test the original code to be sure the issue is the same. But using the code from Sharif above, you start with 6 views, with the scollableView set to "1, 2 and 3" at first, which are dark blue, medium blue, and light blue. Clicking the button sets the scrollableView.views to views 4, 5 and 6. These are red, green, and blue. With 5.0.2 SDK, things work as expected. With 5.1.0, 5.1.1, and 5.1.2.v20151216190036, clicking the button to set the views has the scrollable view go black. When you manipulate it, the colors appear again. [~ewieber] has created a ticket for this behavior mentioned above TIMOB-20199. And he will try the code from [~pic] and comment because it may be a different issue.

Angel Petkov 2016-01-06

PR : https://github.com/appcelerator/titanium_mobile/pull/7617 PR(5_2_X) : https://github.com/appcelerator/titanium_mobile/pull/7627 Same code as the one provided by Sharif. Just added boolean so you can keep switching between views by pressing the button.

   var win = Ti.UI.createWindow();
   var clicked = false;
    
   var view1 = Ti.UI.createView({ height: 300, backgroundColor:'#123' });
   var view2 = Ti.UI.createView({ height: 300, backgroundColor:'#246' });
   var view3 = Ti.UI.createView({ height: 300, backgroundColor:'#48b' });
    
   var view4 = Ti.UI.createView({ height: 300, backgroundColor:'#f34' });
   var view5 = Ti.UI.createView({ height: 300, backgroundColor:'#3f4' });
   var view6 = Ti.UI.createView({ height: 300, backgroundColor:'#34f' });
    
   var scrollableView = Ti.UI.createScrollableView({
     views:[view1,view2,view3],
     showPagingControl:true
   });
    
   win.add(scrollableView);
   var button = Titanium.UI.createButton({
      title: 'Hello',
      bottom: 10,
      width: 100,
      height: 50
   });
   win.add(button);
   button.addEventListener('click',function(e)
   {
     if (clicked == false){ 
   
      scrollableView.views = [view4,view5,view6];
      Titanium.API.info("You clicked the button");
    } else {
   
        scrollableView.views = [view1,view2,view3];
      Titanium.API.info("You clicked the button");
    }
    clicked = !clicked;
   }); 
    
   win.open();

Eric Wieber 2016-01-13

Verified fixed, using: MacOS 10.11.2 (15C50) Studio 4.4.0.201511241829 Ti SDK 5.2.0.v20160111111831 Appc NPM 4.2.2 Appc CLI 5.1.0 Xcode 7.2 (7C68) Node v0.12.7 Java 1.7.0_80 Tested with all provided test cases/samples. I no longer see the views inside the ScrollableView "break" or go black when switching between them or sets of views.

JSON Source