Titanium中如何实现正在加载时,旋转的小圆圈

在实际APP开发中,数据在加载到手机端之前的这段时间,一般大家都会设置一个旋转的小圆来提示用户正在加载,这对非常友好的一个用户体验之一.所以我们就来实现一下这个功能

 

这里要用到一个控件叫ActivityIndicator

我们先在要添加的xml中添加一段下面的代码

	<View id="loading_view" class="loading_view">
			<ActivityIndicator id="activityIndicator" message="正在拼命加载中..."/>
		</View>

 其对应的.tss文件设置如下

".loading_view":{
	width:"100%",
	height:"100dp"	
}

"#activityIndicator":{	
	width:"100%",
	height:"50%",
	color:"black", 
}

 然后再在你所对应的js(我用的是coffee)中添加如下代码

 

//首先根据不同的平台为activityIndicator设置不同的style
if (OS_IOS) {
  $.activityIndicator.setStyle(Ti.UI.iPhone.ActivityIndicatorStyle.PLAIN);
} else if (OS_ANDROID) {
  $.activityIndicator.setStyle(Ti.UI.ActivityIndicatorStyle.BIG);
}

//使用这个activityIndicator
someViewObject.addEventListener('click', function(e) {
    $.activityIndicator.show();

    setTimeout(function() {
         $.activityIndicator.hide();
    },3000);
});