titanium开发教程-02-06创建多行的选择器

var win = Titanium.UI.createWindow({
title:"Creating a Multi-Column Picker",
backgroundColor:"#FFFFFF",
exitOnClose:true
});

//To save time, we are going to create an array of objects to populate our picker rows from
var tours = [
{title:"Backpack Cal",val:"backpack"},
{title:"California Calm",val:"calm"},
{title:"California Hotsprings",val:"hotsprings"},
{title:"Cycle California",val:"cycle"},
{title:"From Desert to Sea",val:"desert"},
{title:"Kids California",val:"kids"},
{title:"Nature Watch",val:"nature"},
{title:"Snowboard Cali",val:"snowboard"},
{title:"Taste of California",val:"taste"}
];

var modes = [
{title:"Bike", val:"bike_value"},
{title:"Car", val:"car_value"},
{title:"Hike", val:"hike_value"}
]

//Mult-column pickers require we create picker columns with picker rows housed within
var tourColumn = Titanium.UI.createPickerColumn({width:200});
//Use a for loop to traverse the tours column and create a picker row for each entry
for(var i=0; i < tours.length; i++){
tourColumn.addRow(Titanium.UI.createPickerRow({title:tours[i].title, val:tours[i].val}));
}

var modeColumn = Titanium.UI.createPickerColumn();
for(var i=0; i < modes.length; i++){
modeColumn.addRow(Titanium.UI.createPickerRow({title:modes[i].title, val:modes[i].val}));
}

var picker = Titanium.UI.createPicker({
selectionIndicator:true,
useSpinner: true,//This will only affect Android
//visibleItems:5,//Set the maximum number of items to be visible at once
type : Titanium.UI.PICKER_TYPE_PLAIN,
top: 150,
height: 200,
columns: [tourColumn, modeColumn] //This refers to the two columns created above
});

var results = Titanium.UI.createLabel({
text:"The date will appear here",
top:24,
width:"auto",
height:"25%",
textAlign:"center",
color:"#000000"
});

picker.addEventListener("change", function(e){

//If the user selects Taste of California, the right column with change
if(e.columnIndex == 0){//Test the selection of column 1 (which has an index of 0)
if(e.row.val == "taste"){//Taste of California has a val property set to "taste"
results.text="Taste of California specifically selected";
}
}else{
//e.selectedValue returns an array of all column titles, left to right
//this only works with the Titanium.UI.PICKER_TYPE_PLAIN type of picker
results.text="Column 1: " + e.selectedValue[0] + "\nColumn 2: " + e.selectedValue[1];// \n forces a line break
}
});

win.add(picker);
win.add(results);

win.open();