今天我們來學習創(chuàng)建一個簡單的titanium實例。

從該實例當中你將學會如何創(chuàng)建一個窗口視圖，在窗口里添加一個輸入框，一個表格，并為輸入框和表格添加相應的事件。

一、創(chuàng)建一個工程，并且把系統(tǒng)自動生成的代碼全部刪除

二、在app.js文件里編寫代碼

1、創(chuàng)建一個窗口并且設置背景圖片

varwin=Ti.UI.createWindow({

backgroundImage:"background.png"

});

2、創(chuàng)建輸入框

varcasella=Ti.UI.createTextField({

hintText:"輸入你的消費清單",//提示文字

borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED,//

top:20,//離頂部的距離

height:80,//高度

width:"90%"//寬度

});

3、創(chuàng)建表單視圖

vartable=Ti.UI.createTableView({

backgroundColor:"transparent",//背景顏色設為透明

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)容到表格中并設置背景顏色和內(nèi)容顏色

table.appendRow({title:casella.value,backgroundColor:"transparent",color:"#009"});

casella.value="";

casella.blur();

});

6、表格點擊事件

table.addEventListener('click',function(evento){

evento.row.hasCheck=true;//點擊后顯示已選的提示勾

});

7、打開窗口

win.open();

運行一下程序，效果如下：在輸入框輸入文字回車直接添加到表格中，點擊表格中的內(nèi)容會顯示一個勾，表示已選！