Question

我创建了包含行的表视图，其中包含标签和开关框，样式为复选框。我的要求是，在这些行复选框中，我选择其中一些。之后，我想要那些已选中且未选中的复选框。这是我的代码：

// My Array Data for Table-view

var checkboxArray = [  { title: "Mountain View (North America)\nCloudy", leftImage:  "http://www.google.com/ig/images/weather/cloudy.gif" },
{ title: "Sucre (South America)\nMostly Cloudy", leftImage: "http://www.google.com/ig/images/weather/mostly_cloudy.gif" },
{ title: "Prague (Europe)\nClear", leftImage: "http://www.google.com/ig/images/weather/sunny.gif" },
{ title: "St Petersburg (Europe)\nSnow", leftImage: "http://www.google.com/ig/images/weather/snow.gif" },];


// My Android checkbox

var checkbox = Ti.UI.createSwitch({
style:Ti.UI.Android.SWITCH_STYLE_CHECKBOX,
title:"Sound Enabled",
value:true
}); 

// My Header label inside table-view

var headerLabel = Ti.UI.createLabel({
  backgroundColor:'#035385',
  color:"white",
  font:{ fontSize: 30, fontWeight:"bold" },
  text:"Favoriete Merken",
  textAlign:"center",
  height:45,
  width:500
});

// My Table View

var table = Ti.UI.createTableView({
  backgroundColor:"white",
  data:checkboxArray,
  headerView:headerLabel,
  separatorColor:"black",
  top:0,
  width:'auto'
});

win2.add(table);

Answer 1

通过对象文字创建的行无法添加视图。但是如果你通过Ti.UI.createTableViewRow创建行，你可以。因此，要添加复选框，只需更改示例以显式创建行，添加复选框，存储对复选框的引用，然后就完成了。

var win = Ti.UI.createWindow({
    backgroundColor: '#fff'
});

var rows = [];
var data = [
    { title: 'Mountain View (North America)\nCloudy', leftImage: 'http://www.google.com/ig/images/weather/cloudy.gif' },
    { title: 'Sucre (South America)\nMostly Cloudy', leftImage: 'http://www.google.com/ig/images/weather/mostly_cloudy.gif' },
    { title: 'Prague (Europe)\nClear', leftImage: 'http://www.google.com/ig/images/weather/sunny.gif' },
    { title: 'St Petersburg (Europe)\nSnow', leftImage: 'http://www.google.com/ig/images/weather/snow.gif' }
];

for (var i = 0, l = data.length; i < l; i++) {
    var row = Ti.UI.createTableViewRow();
    row.add(Ti.UI.createImageView({
        image: data[i].leftImage,
        width: 45, height: 45,
        left: 0
    }));
    row.add(Ti.UI.createLabel({
        text: data[i].title, textAlign: 'left',
        color: '#000',
        left: 50, right: 50
    }));
    row.add(data[i].switch = Ti.UI.createSwitch({
        style: Ti.UI.Android && Ti.UI.Android.SWITCH_STYLE_CHECKBOX,
        title: 'Sound Enabled',
        value: true,
        right: 5,
        width: 40
    }));
    rows[i] = row;
}

win.add(Ti.UI.createTableView({
    data: rows,
    backgroundColor: 'white',
    separatorColor: 'black',
    headerView: Ti.UI.createLabel({
        backgroundColor: '#035385',
        color: 'white',
        font: { fontSize: 30, fontWeight: 'bold' },
        text: 'Favoriete Merken', textAlign: 'center',
        height: 45
    }),
    bottom: 45
}));

var alertFirstSwitchValue = Ti.UI.createButton({
    title: 'Alert First Switch Value',
    bottom: 0, right: 0, left: 0,
    height: 45
});
alertFirstSwitchValue.addEventListener('click', function () {
    alert(data[0].switch.value);
});
win.add(alertFirstSwitchValue);

win.open();

我想将Android Checkbox（SWITCH）添加到TableView的数据数组中使用appcelerator钛？

1 个答案: