Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-20493] iOS: ScrollableView fire events only for the first two views

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2016-04-04T13:40:11.000+0000
Affected Version/sn/a
Fix Version/sRelease 5.4.0
ComponentsiOS
LabelsScrollableView, ios, mainthread, sdk-5.1.2
ReporterPaRnanZio Gun
AssigneeChee Kiat Ng
Created2016-02-18T09:00:23.000+0000
Updated2016-08-04T17:34:07.000+0000

Description

Using SDK 5.1.2 there is a problem on the ScrollableView element. Only the first two views can fire up events. All the other views cannot fire events, so no _click_ event are captured, no _postlayout_, .. The problem is relevant only for *iOS + SDK 5.1.2*. I switched back to SDK 5.1.1 and everything works fine :) .

Comments

  1. Jebun Naher 2016-02-18

    Hello, We tested the issue you reported. Events working as expected for each scrollableView element. *Test Environment:* Appcelerator Studio, build: 4.5.0.201602170831 Ti.SDK: 5.1.2GA Simulator: iOS 9.1 Test Code:
       var win = Ti.UI.createWindow();
       var view1 = Ti.UI.createView({ backgroundColor:'red' });
       var view2 = Ti.UI.createView({ backgroundColor:'green' });
       var view3 = Ti.UI.createView({ backgroundColor:'blue' });
       var view4 = Ti.UI.createView({ backgroundColor:'black' });
       var view5 = Ti.UI.createView({ backgroundColor:'yellow' });
       var view6 = Ti.UI.createView({ backgroundColor:'gray' });
       var scrollableView = Ti.UI.createScrollableView({
         views:[view1,view2,view3,view4,view5,view6],
         showPagingControl:true
       });
       scrollableView.addEventListener('dblclick', function() {
           Ti.API.info('click event heard');
       }); 
       /*
       scrollableView.addEventListener('postlayout', function() {
           Ti.API.info('postlayout event heard');
       });
       */
       win.add(scrollableView);
       win.open();
       
    Output:
       [INFO] :   click event heard
       [INFO] :   click event heard
       [INFO] :   click event heard
       [INFO] :   click event heard
       [INFO] :   click event heard
       [INFO] :   click event heard
       
    Thanks.
  2. PaRnanZio Gun 2016-02-18

    The problem is not on the event on the ScrollableView, but on the inner views (view1, view2, ..)
  3. Rodolfo Perottoni 2016-02-22

    Getting the same error with 5.2.0.RC
  4. Sharif AbuDarda 2016-02-22

    Hello, I have tested the issue in SDK 5.2.0.v20160114021251. The issue is not reproducible. Event fired in views as expected.
       var win = Ti.UI.createWindow();
       
       
       var view1 = Ti.UI.createView({
           backgroundColor : '#123'
       });
       
       view1.addEventListener('click', function(e) {
       
           Titanium.API.info("You clicked the view1");
       
       }); 
       
       var view2 = Ti.UI.createView({
           backgroundColor : '#246'
       });
       
       view2.addEventListener('click', function(e) {
       
           Titanium.API.info("You clicked the view2");
       
       });
       
       var view3 = Ti.UI.createView({
           backgroundColor : '#48b'
       });
       
       view3.addEventListener('click', function(e) {
       
           Titanium.API.info("You clicked the view3");
       
       });
       
       var view4 = Ti.UI.createView({
           backgroundColor : 'green'
       });
       
       view4.addEventListener('click', function(e) {
       
           Titanium.API.info("You clicked the view4");
       
       });
       
       var view5 = Ti.UI.createView({
           backgroundColor : '#231'
       });
       
       view5.addEventListener('click', function(e) {
       
           Titanium.API.info("You clicked the view5");
       
       });
       
       var scrollableView = Ti.UI.createScrollableView({
       
           views : [view1, view2, view3, view4, view5],
       
           showPagingControl : true
       
       });
       
       win.add(scrollableView);
       
       win.open(); 
       

    Environment

    Appcelerator Command-Line Interface, version 5.1.0 Titanium SDK Version: 5.2.0.v20160114021251 Platform: iOS Simulator: iphone 6S Plus/ iOS 9.1
       [INFO] :   You clicked the view1
       [INFO] :   You clicked the view1
       [INFO] :   You clicked the view2
       [INFO] :   You clicked the view3
       [INFO] :   You clicked the view4
       [INFO] :   You clicked the view5
       [INFO] :   You clicked the view4
       [INFO] :   You clicked the view3
       [INFO] :   You clicked the view2
       [INFO] :   You clicked the view1
       
    Not a valid bug. Closing this ticket. Thanks.
  5. Rodolfo Perottoni 2016-02-22

    This is a valid bug! Here's a sample alloy project that i've made. Steps to reproduce: * Click the "jump" right nav button. * Click on the "CLICK" button -> it will print "simple" into the console. * Swipe left and click on any of the TableViewRows -> their title will be printed in the console * click on the "create" button in the bottom of the screen -> new views will be created with tables and some rows * click on any TableViewRow -> their title is not printed on 5.2.0.v20160220080449 * tested on 5.0.3 -> it works good. index.xml
       <Alloy>
       	<NavigationWindow>
       		<Window id="index">
       			<RightNavButton>
       				<Button title="jump" onClick="jumpTo2"/>
       			</RightNavButton>
       			
       			<ScrollableView id="svContent" top="0" height="85%">
       				<View>
       					<View module="ti.map"/>
       				</View>
       				<View>
       					<Button height="50" width="50" title="CLICK" onClick="logSimple"/>
       				</View>
       				<View backgroundColor="green">
       					<TableView id="tbAlerts">
       						<TableViewRow title="testing1"/>
       						<TableViewRow title="testing2"/>
       						<TableViewRow title="testing3"/>
       					</TableView>
       				</View>
       				<View backgroundColor="green">
       					<TableView id="tbAlerts2">
       						<TableViewRow title="testing1"/>
       						<TableViewRow title="testing2"/>
       						<TableViewRow title="testing3"/>
       					</TableView>
       				</View>
       				<View backgroundColor="green">
       					<TableView id="tbAlerts3">
       						<TableViewRow title="testing1"/>
       						<TableViewRow title="testing2"/>
       						<TableViewRow title="testing3"/>
       					</TableView>
       				</View>
       			</ScrollableView>
       			
       			<Button bottom="0" height="60" borderColor="black" title="create" onClick="createViews"/>
       		</Window>
       	</NavigationWindow>
       </Alloy>
       
    index.js
       function createViews(e) {
       	var views = [];
       	
       	for(var i = 0; i < 3; i++) {
       		var newView = Ti.UI.createView();
       		var table = Ti.UI.createTableView();
       		
       		table.addEventListener('click', function(e) {
       			Ti.API.error('click' + e.row.title);
       		});
       		
       		newView.add(table);
       		
       		for(var j = 0; j < 3; j++) {
       			var row = Ti.UI.createTableViewRow({
       				title: 'title' + j
       			});
       			
       			table.appendRow(row);
       		}
       		
       		views.push(newView);
       	}
       	
       	$.svContent.views = views;
       }
       
       function logSimple() {
       	Ti.API.error('simple');
       }
       
       function jumpTo2() {
       	$.svContent.currentPage = 1;
       }
       
       $.index.open();
       
       $.tbAlerts.addEventListener('click', function(e) {
       	Ti.API.log(e.row.title);
       });
       $.tbAlerts2.addEventListener('click', function(e) {
       	Ti.API.log(e.row.title);
       });
       $.tbAlerts3.addEventListener('click', function(e) {
       	Ti.API.log(e.row.title);
       });
       
  6. Rodolfo Perottoni 2016-02-22

    P.S remember to include the Ti.Map module in the project.
  7. Hans Knöchel 2016-03-02

    [~sdarda] -The latest 5_2_X is 5.2.1.v20160228190750 from last week- The fix should be in that one as well. Did you ensure to disable <use-autolayout/> and <run-on-mainthread/>. Will investigate. EDIT: Looking at the [API diff](https://github.com/appcelerator/titanium_mobile/compare/5_1_1...5_1_X), -please try to test with the [2.4.1](https://github.com/appcelerator-modules/ti.map/releases/tag/iOS-2.4.1) version of ti.map which was packed with 5.1.1 (5.1.2 has 2.5.2)-must by unrelated. The only other changes between related to the scrollable view is [this line](https://github.com/appcelerator/titanium_mobile/compare/5_1_1...5_1_X#diff-d8ea5e713d52a6a8c79177c04a817739R75) again, so just changing the #ifdef would reopen the other issue again. Need to find a better way.
  8. Chee Kiat Ng 2016-03-04

    This is not a regression. Pushing to a later version for fix. The reason this worked on 5.1.1.GA is because the property is enabled by DEFAULT (a bug then). So if you wish to make this work in 5,2,0, please set the property to true in tiapp.xml
  9. Jeff Kanazi 2016-03-07

    Thanks for the workaround. Please take a look at this issue too when considering the fix: [http://stackoverflow.com/questions/35736172/titanium-sdk-5-1-2-and-now-5-2-0-would-both-not-fire-events-in-some-cases-in-an] With set to false the ScrollableView is not really really usable.
  10. Chee Kiat Ng 2016-03-08

    Thanks [~jeff_kanazi] will definitely look at that too.
  11. Hans Knöchel 2016-03-18

    Just to be sure, the <run-on-main-thread/> flag is causing the issue, not the <use-autolayout/>?
  12. Chee Kiat Ng 2016-03-31

    PR here: https://github.com/appcelerator/titanium_mobile/pull/7896 This should work by default, without setting anything in tiapp.xml. i.e.: run-on-main-thread disabled, auto-layout disabled. There is a known issue with run-on-main-thread enabled, auto layout enabled, whereby the map doesn't show, but that's a separate issue.
  13. Jeff Kanazi 2016-04-04

    I have just tried the same code with SDK 5.2.1 and the original issue has not been fixed. This appears to be IOS only issue. I have tried compiling the app for Android with the same SDK and the events are firing as expected on all ScrollableView pages. Another interesting thing is that it would appear the issue is always on the last ScrollableView page, however, by reducing the number of pages in the ScrollableView I can get it to a point where events would fire on all of them. Strangely for one of the views things work with up to 4 pages while on the other view 3 pages is the maximum. The difference between the two ScrollableViews is that the first one has onely one button per page, while the other scrollableview has multiple objects that could trigger events on every page. If there is anything I can do to help you track this down, please let me know. I do not know if looking at the actual app would help but if so you can take a loop at the "Wordy Bee" app at the AppStore. That would be a working version using SDK 5.1.1. The main screen is a scrollableview and the help at the bottom of settings is another.
  14. Hans Knöchel 2016-04-04

    Hey Jeff! The changes have just been merged for 5.4.0 today (which is the master branch available [here|builds.appcelerator.com]). Please try one of those builds, thank you!
  15. Paresh Thakor 2016-04-07

    Hi, I am facing the same kind of issue here. My project is in Classic style and put a button in scrollable view. The button in scrollable view is not working now. I have checked this in 5.4.0 weekly build, 5.2.2.GA, 5.2.1.GA, 5.2.0.GA and 5.1.1.GA but the button's click event is not fired, though I registered the click event listener. In 5.0.2.GA this button is working perfectly. Although, when I take this button out of scrollable view, the same works fine. Regards, Paresh Thakor.
  16. Chee Kiat Ng 2016-04-07

    Hi [~mobihunterz] Have you tried the latest build from 2 days ago? Please let us know!
  17. Eric Wieber 2016-08-04

    Verified fixed, using: MacOS 10.11.5 (15F31a) Studio 4.7.0.201607250649 Ti SDK 5.4.0.v20160802165655 Appc NPM 4.2.7 Appc CLI 5.4.0-37 Alloy 1.9.1 Xcode 7.3.1 (7D1014) Tested using the test cases provided in the comments and by setting both <run-on-main-thread/> and <use-autolayout/> to false and true. Events were seen firing and log messages from click events appeared correctly.

JSON Source