使用Titanium開發(fā)簡單實(shí)例
今天我們來學(xué)習(xí)創(chuàng)建一個(gè)簡單的titanium實(shí)例。
從該實(shí)例當(dāng)中你將學(xué)會(huì)如何創(chuàng)建一個(gè)窗口視圖，在窗口里添加一個(gè)輸入框，一個(gè)表格，并為輸入框和表格添加相應(yīng)的事件。
一、創(chuàng)建一個(gè)工程，并且把系統(tǒng)自動(dòng)生成的代碼全部刪除
二、在app.js文件里編寫代碼
1、創(chuàng)建一個(gè)窗口并且設(shè)置背景圖片
varwin=Ti.UI.createWindow({
backgroundImage:"background.png"
});
2、創(chuàng)建輸入框
varcasella=Ti.UI.createTextField({
hintText:"輸入你的消費(fèi)清單",//提示文字
borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED,//
top:20,//離頂部的距離
height:80,//高度
width:"90%"//寬度
});
3、創(chuàng)建表單視圖
vartable=Ti.UI.createTableView({
backgroundColor:"transparent",//背景顏色設(shè)為透明
top:120,//頂部距離
left:20,//左邊距離
right:20,//右邊距離
bottom:40,//底部距離
editable:true//編輯狀態(tài)
});
4、在窗口添加剛才的輸入框和表格
win.add(casella);
win.add(table);
5、為輸入框添加回車事件
casella.addEventListener('return',function(){
//添加輸入框的內(nèi)容到表格中并設(shè)置背景顏色和內(nèi)容顏色
table.appendRow({title:casella.value,backgroundColor:"transparent",color:"#009"});
casella.value="";
casella.blur();
});
6、表格點(diǎn)擊事件
table.addEventListener('click',function(evento){
evento.row.hasCheck=true;//點(diǎn)擊后顯示已選的提示勾
});
7、打開窗口
win.open();
運(yùn)行一下程序，效果如下：在輸入框輸入文字回車直接添加到表格中，點(diǎn)擊表格中的內(nèi)容會(huì)顯示一個(gè)勾，表示已選！
