[Titanium] 依內容改變高度的TableViewRow排列

Posted on 由
LINEで送る
[`evernote` not found]


在應用程式類app中,最常被用來顯示資料的就是TableView了。但是,往往我們會有需要依照留言的長度來排列TableViewRow的狀況。

這在titanium中並不是自動可以做到了,原因是因為,當存放留言的label指定完text後,它還需要一點時間去計算他自己的高度,也就是說label.height不是當下就可以反映出正確的高度。

因此,我們就必須用setTimeout再過一陣子後再去問他的高度來判斷其他東西要如何排列…

(還是說有更聰明的做法？)

var fbpix =  Titanium.UI.createImageView({image:'http://graph.facebook.com/'+e.uid+'/picture', width:50, height: 50, top:5,left:5});
 	Row2.add(fbpix);
 	var _h1;
 	var _h2;
 	var _h3;
 	var _Label1;
 	var _Label2;
 	var _Label3;
 	var _Label4;
 	var _base = 3;
 	_Label1 = Ti.UI.createLabel({color:'#000', textAlign:'left', text:e.uname, shadowColor:'#FFFFE6', shadowOffset:{x:0,y:1}, 
								font:{fontSize:14, fontWeight:'bold'}, top:5, left:60, height:'auto', width:'auto'});
	Row2.add(_Label1);
	setTimeout(function(){
		_h1 = _Label1.height;
		_Label2 = Ti.UI.createLabel({color:'#333', textAlign:'left', text:e.comment, font:{fontSize:12}, top:_h1 + _base*2, left:60, height:'auto', width:'auto'});
		Row2.add(_Label2);
	},100);
	setTimeout(function(){
		_h2 = _Label2.height;
		_Label3 = Ti.UI.createLabel({color:'#f00', textAlign:'left', text:stararr[e.stars], shadowColor:'#FFFFE6', shadowOffset:{x:0,y:1}, 
								font:{fontSize:16}, top:_h1 + _h2 + _base*3, left:60, height:'auto', width:'auto'});
		Row2.add(_Label3);
	},200);
	setTimeout(function(){
		_h3 = _Label3.height;
		_Label4 = Ti.UI.createLabel({color:'#ccc', textAlign:'right', text:"@"+e.timeStr, shadowColor:'#FFFFE6', shadowOffset:{x:0,y:1}, 
								font:{fontSize:12}, top:_h1 + _h2 + _h3 + _base*4, right:5, height:'auto', width:'auto'});
		Row2.add(_Label4);
	},300);