この記事は、@astronaughtsさん主催のTitanium mobile “early” Advent Calendar 2012に参加して書いております。16日目（11/16）担当でございます。

みんなが好きなイベントは？そうscrollイベントですね！

Titanium mobileのscrollイベントが思い通り動いてないっぽかったので、動きを調べてみました。(SDK2.1.4 GA、iOSシミュレータで検証)

scrollイベント

scrollViewをスワイプしてスライドさせたときに発火するのがscrollイベントです。

scrollしている間、scrollイベントが発火し続け、scrollが慣性で止まると、scrollEndが発火します。

以下のようなイメージ

xはscroll時の座標です。

疑問(1) scrollEndが発火しない？

scroll中にtapして強制的にscrollを止めた直後、scrollEndが発火しません。
が、tapを終えると（tapしたマウスのクリックを離すと）scrollEndが発火します。

疑問(2) scrollToしたら？

scrollToを使って、プログラムで移動させた場合、どうなるか？

結論：scrollのみ連続で発生

scrollToを使っても一瞬で移動する訳ではないので、移動の間scrollが発火し続けます。ただし、scrollEndは発火しません

こんな感じ。
scrollが終わってもscrollEndは発火してません。

疑問(3) viewの横幅変えると？

scrollのwidthや、scrollに乗っかるviewのwidthを変えるとscrollイベントは発火するのか？という疑問です。
正直最初発火しているように思ったのですが、ちゃんと検証したら発火していませんでした。これが実は個人的に一番やってよかった検証。。。

おわり

単発でイベントが発生するパターンが多い中、連続で発火するscrollは少しクセがあるように感じました。うまく使いこなせるようになりたいものです。
以下に検証用ソースコード貼っておきます。

function FirstView() {
	var self = Ti.UI.createView();	

	var scrollView = Titanium.UI.createScrollView({
		height:300,
		width : 300,
		contentHeight : 300,
		contentWidth : 'auto',
		top : 50,
		backgroundColor:"#black",
	});
	var scrollOnView = Ti.UI.createView({
		top : 50,
		left: 0,
		height : 200,
		width : 1000,
		backgroundColor:"#blue",
	});
	scrollView.add(scrollOnView);
	
	var text = "abcdefghigklmnopqrstuvwxyz";
	text += "abcdefghigklmnopqrstuvwxyz";
	text += "abcdefghigklmnopqrstuvwxyz";
	text += "abcdefghigklmnopqrstuvwxyz";

	var label = Ti.UI.createLabel({
		text : text,
	})
	scrollOnView.add(label);	
	
	self.add(scrollView);

	
	scrollView.addEventListener("scroll",function(e){
		Ti.API.info("scroll x=" + e.x);
	});
	scrollView.addEventListener("scrollEnd",function(e){
		Ti.API.info("scrollEnd");
	});

	
	var addWidthButton = Ti.UI.createButton({
		title:"add width",
		top : 360,
		left : 10,
	});
	self.add(addWidthButton);
	
	addWidthButton.addEventListener('click',function(){
		scrollOnView.setWidth(scrollOnView.getWidth() + 10);
		scrollView.setWidth(scrollView.getWidth() + 10);
	});


	var scrollButton = Ti.UI.createButton({
		title:"scroll",
		top : 360,
		left : 120,
	});
	self.add(scrollButton);
	
	var x=0;
	scrollButton.addEventListener('click',function(){
		if(x==0){
			x=600;
		}else{
			x=0;
		}
		scrollView.scrollTo(x,0);
	});

	return self;
}

module.exports = FirstView;