Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-26160] iOS: ScrollableView + run-on-main-thread - views dont render until scroll when re-adding views

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2018-08-24T17:25:23.000+0000
Affected Version/sRelease 7.1.1, Release 7.2.0
Fix Version/sRelease 7.5.0
ComponentsiOS
Labelsalloy, ios, run-on-main-thread, scrollableView
ReporterDavid van de Meer
AssigneeHans Knöchel
Created2018-06-27T07:27:04.000+0000
Updated2018-09-10T10:20:36.000+0000

Description

When enabling
<property name="run-on-main-thread" type="bool">true</property>
ScrollableView does not render views when re-adding views to the ScrollableView until you scroll a bit then they suddenly render. When removing run-on-main-thread it works just fine. Steps to reproduce: 1. Create new alloy project 2. In your index.js add the code below 3. Build to ios simlulator 4. Scroll to see everything is working 5. Click on re-add views button - See that views are now all white / not rendered 6. Scroll left or right and see that the views then render 7. Remove run-on-main-thread from tiapp.xml and build and see that everything works fine.
function reAddViews(){
	oldViews = scrollableView.views;
	scrollableView.views = oldViews;

	// ANOTHER TEST TO PROVE ONLY NEWLY CREATED VIEWS WORK
	//var view3 = Ti.UI.createView({ backgroundColor:'orange'});
	//scrollableView.views = [oldViews[0],oldViews[1],view3,oldViews[3],oldViews[4]]

	scrollableView.currentPage = 2;
}

var button = Titanium.UI.createButton({
   title: 'Re-Add Views',
   bottom: 10,
   height: 50,
});
button.addEventListener('click',reAddViews);
$.index.add(button);

var view1 = Ti.UI.createView({ backgroundColor:'red'});
var view2 = Ti.UI.createView({ backgroundColor:'blue'});
var view3 = Ti.UI.createView({ backgroundColor:'yellow'});
var view4 = Ti.UI.createView({ backgroundColor:'green'});
var view5 = Ti.UI.createView({ backgroundColor:'pink'});

var scrollableView = Ti.UI.createScrollableView({
  views:[view1,view2,view3,view4,view5],
  showPagingControl:true,
  bottom: 50,
  currentPage:2,
  cacheSize: 9,
});

$.index.add(scrollableView);
$.index.open();

Attachments

FileDateSize
bug.mov2018-06-27T07:39:24.000+0000905366

Comments

  1. Hans Knöchel 2018-06-27

    Looks like a valid bug! We are scheduling it for the next release (7.4.0, since 7.3.0 will go RC already soon). Sandboxes test-case:
       var win = Ti.UI.createWindow({
           backgroundColor: '#fff'
       });
       
       function reAddViews() {
           oldViews = scrollableView.views;
           scrollableView.views = oldViews;
       
           // ANOTHER TEST TO PROVE ONLY NEWLY CREATED VIEWS WORK
           //var view3 = Ti.UI.createView({ backgroundColor:'orange'});
           //scrollableView.views = [oldViews[0],oldViews[1],view3,oldViews[3],oldViews[4]]
       
           scrollableView.currentPage = 2;
       }
       
       var button = Titanium.UI.createButton({
           title: 'Re-Add Views',
           bottom: 10,
           height: 50,
       });
       button.addEventListener('click', reAddViews);
       win.add(button);
       
       var view1 = Ti.UI.createView({
           backgroundColor: 'red'
       });
       var view2 = Ti.UI.createView({
           backgroundColor: 'blue'
       });
       var view3 = Ti.UI.createView({
           backgroundColor: 'yellow'
       });
       var view4 = Ti.UI.createView({
           backgroundColor: 'green'
       });
       var view5 = Ti.UI.createView({
           backgroundColor: 'pink'
       });
       
       var scrollableView = Ti.UI.createScrollableView({
           views: [view1, view2, view3, view4, view5],
           showPagingControl: true,
           bottom: 50,
           currentPage: 2,
           cacheSize: 9,
       });
       
       win.add(scrollableView);
       win.open();
       
  2. David van de Meer 2018-06-27

    ok once there is a fix I can add it to my sdk as its already a mess with other cherry picks to handle other bugs
  3. Hans Knöchel 2018-06-27

    PR: https://github.com/appcelerator/titanium_mobile/pull/10135
  4. Hans Knöchel 2018-06-27

    [~dieskim] We just provided a pull request and the change was integrated into master. Thanks for reporting this, also thanks for the good test-case!
  5. David van de Meer 2018-06-27

    just tested the fix on my app - so far so good, ill let you know if something else pops up but its looking good so far
  6. Samir Mohammed 2018-08-20

    *Closing ticket.* Verified fix in SDK version: 7.4.0.v20180817092850. Application now renders views when they are being re-added. *FR Passed (Test Steps):*

    Created a titanium application with the test case above

    Ran the program

    Scrolled left and right to confirm views were visible

    Pressed the re-add views button

    Able to see views were able to render without scrolling left or right

    *Test Environment*
       APPC Studio:  5.1.0.201808080937
       APPC CLI: 7.0.5
       iphone 6 simulator (11.2)
       Operating System Name: Mac OS High Sierra
       Operating System Version: 10.13
       Node.js Version: 8.9.1
       Xcode 9.2
  7. Samir Mohammed 2018-09-10

    *Closing ticket.* Also verified using SDK Version 7.5.0.v20180906093938

JSON Source