Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-10295] iOS: Enabling a TextArea in a ScrollView automatically scrolls to TextArea.

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2012-09-05T02:26:03.000+0000
Affected Version/sRelease 2.1.0
Fix Version/sSprint 2012-17 API, Release 3.0.0
ComponentsiOS
Labelsapi, module_scrollview, qe-review, qe-testadded
ReporterAmuktha Akkinepally
AssigneeSabil Rahim
Created2012-08-01T16:04:50.000+0000
Updated2012-09-05T02:26:03.000+0000

Description

This is for an app in which controls may dynamically be disabled and enabled. When disabled a TextArea and enabled it, the ScrollView is automatically getting scrolled to the newly enabled TextArea which is not desirable. There is a textField in this app as well, but it does not have this behavior.

Sample Code

var win = Ti.UI.createWindow({
	backgroundColor: 'white'
	});
	win.open();
	//var self = Ti.UI.createView();
	//win.add(self);
	var scrollView  = Ti.UI.createScrollView( { width: 400,
												height: 600, 
												   contentWidth: "auto",
												   contentHeight: "auto", 
												   showVerticalScrollIndicator: true });
												   
    var scrollingView	= Ti.UI.createView({ top: 0, width: 390, height: 1000, backgroundColor: '#efefef' });

	var label = Ti.UI.createLabel({
		color:'#000000',
		text: 'Click to enable TextField (does not scroll)',
		left: 25,
		top: 20,
		height:'auto',
		width:'auto'
	});
	var actionButton = Ti.UI.createButton ( { backgroundImage: "/Images/actionButton.png", 
											  left: 100,
											  top: 50,
		                                      height: 45, 
		                                      width: 45,
		                                    } ); 

	var label2 = Ti.UI.createLabel({
		color:'#000000',
		text: 'Click to enable TextArea (scrolls)',
		left: 25,
		top: 120,
		height:'auto',
		width:'auto'
	});
	var actionButton2 = Ti.UI.createButton ( { backgroundImage: "/Images/actionButton.png", 
											  left: 100,
											  top: 150,
		                                      height: 45, 
		                                      width: 45,
		                                    } ); 
		  
	win.add(label);	                                           
	win.add(actionButton);                                         
	win.add(label2);	                                           
	win.add(actionButton2);                                         

	win.add(scrollView);
	scrollView.add(scrollingView);
	
	//label using localization-ready strings from <app dir>/i18n/en/strings.xml
	var textField1 = Ti.UI.createTextField( { left: 40,
											  top: 50,
											  width: 100,
											  height: 20,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });


	var textField2 = Ti.UI.createTextField( { left: 40,
											  top: 350,
											  width: 100,
											  height: 20,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });


	var textField3 = Ti.UI.createTextField( { left: 40,
											  top: 550,
											  width: 100,
											  height: 20,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });

	var textField4 = Ti.UI.createTextField( { left: 40,
											  top: 750,
											  width: 100,
											  height: 20,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });

	var textField5 = Ti.UI.createTextField( { left: 40,
											  top: 900,
											  width: 100,
											  height: 20,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });

	var textArea1 = Ti.UI.createTextArea( { left: 40,
											  top: 950,
											  width: 100,
											  height: 35,
											  keyboardType: Titanium.UI.KEYBOARD_DEFAULT,
											  value: "",
											  borderStyle: Titanium.UI.INPUT_BORDERSTYLE_LINE, 
											  color: '#000',
											  enabled: false
											   });
											  
	scrollingView.add(textField1);
	scrollingView.add(textField2);
	scrollingView.add(textField3);
	scrollingView.add(textField4);
	scrollingView.add(textField5);
	scrollingView.add(textArea1);
	

	//Add behavior for UI
	actionButton.addEventListener('click', function(e) {
		textField5.enabled = true;
	});

	actionButton2.addEventListener('click', function(e) {
		// scrollView.scrollTo(0,0);
		textArea1.enabled = true;
		// focusable:'false';
		
	});
		

Comments

  1. Sabil Rahim 2012-08-22

    This seems like a Apple Bug - which is caused if you try setting the editable property on textArea with empty string. PR pending [PR 2809](https://github.com/appcelerator/titanium_mobile/pull/2809)
  2. Shyam Bhadauria 2012-08-27

    Enabling textarea do not automatically scrolls to textarea now. Environment used for verification - Tested with Titanium SDK: 2.2.0.v20120827143312 Tested with Titanium  Studio: 2.1.2.201208201549 Device - iOS 5.1 simulator Machine OS - MAC 10.7.3
  3. Anshu Mittal 2012-09-05

    Reopening to update labels

JSON Source