Titanium 列表显示TableView

效果：

 

Titanium中列表显示需要创建TableView

    var tableView = Ti.UI.createTableView({

        style: Ti.UI.iPhone.TableViewCellSelectionStyle.NONE //TableView样式

    });

TableView的每一个行叫做TableViewRow

设置TableViewRow的hasChild为true便可显示这样的效果：

点击HasChild行进入列表显示画面（图2）需要添加点击事件

    tablerow.addEventListener('click', function()

    {
　　　　 //Titanium中自定义一个事件

        tablerow.fireEvent('hasChildClicked', { operation: 'fieldChild'});

    });

捕捉这个事件

view.addEventListener('hasChildClicked', function(e) {

    navGroup.open(tableView);//使用NavigationGroup打开列表显示画面tableView

});

 

然后再列表显示数据

    //创建TableViewRow的方法
    self.createTableRow = function(i) {

        var tablerow = Ti.UI.createTableViewRow();

        tablerow.height = 50;//行高度

        tablerow.setTitle("TableViewRow"+i);//显示名称

        return tablerow;

    };

    

    var rows = [];//存储tableView数据的数组

    for (var i = 0; i < 20; i++) {

        rows.push(self.createTableRow(i));

    }

    tableView.setData(rows);

    

    self.add(tableView);

 

TableViewRow的属性hasCheck控制该行是否被选中，类似于HTML的Checkbox控件的checked的属性

　　　　 //每一行增加点击事件，控制其选中状态
        tablerow.addEventListener('click', function()

        {

            if(tablerow.getHasCheck()){

                tablerow.setHasCheck(false);

            }else{

                tablerow.setHasCheck(true);

            }

                

        });