我正在研究 Titanium 并为 iOS 开发，我创建了一个 TableView，每行都有一个按钮，当您单击该行时，另一个按钮会添加到该行中，如果再次单击该按钮，则会删除该按钮，每个控件都有自己的行为和自己的风格。我正在处理的问题是，当我单击该行时，按钮上的样式被覆盖，我的意思是，如果任何按钮具有特定的背景颜色，则所述颜色将被覆盖并替换为行的背景颜色，字体颜色也会发生这种情况。
这是该行在被单击之前的外观截图：
下一个是当我单击该行并添加另一个按钮时：
看看小灰色按钮背景颜色如何更改为与行背景颜色相同的颜色。当我单击该行使按钮消失并再次单击该行使其重新出现时，也会发生同样的情况：
这就是我定义行和按钮的方式：
function addToDo(title, priority, taskId){
var that = {};
var row = Ti.UI.createTableViewRow({
height:80,
value : taskId,
backgroundSelectedColor : 'transparent',
selectedBackgroundColor : 'transparent',
selectedColor : 'transparent',
item_type : 'ROW'
});
that.currentPriority = priority;
that.resolveColor = function(tmpPriority){
switch(tmpPriority){
case 0: backgroundColorPriority = "#da362a"; break;
case 1: backgroundColorPriority = "#da6c2a"; break;
case 2: backgroundColorPriority = "#da962a"; break;
case 3: backgroundColorPriority = "#dacb2a"; break;
}
return backgroundColorPriority;
}
var rowLayout = Ti.UI.createView({
backgroundColor : 'transparent'
});
var checkbox = Ti.UI.createButton({
top: 25,
left: 5,
width: 30,
height: 30,
borderColor: 'white',
borderWidth: 2,
borderRadius: 1,
backgroundColor: '#b1b1b1',
backgroundImage: 'NONE',
item_type : 'CHECKBOX',
value: false //value is a custom property in this case here.
});
row.add(checkbox);
//Attach some simple on/off actions
checkbox.on = function(item) {
this.backgroundColor = '#62b425';
item.backgroundColor = "#101010";
this.value = true;
};
checkbox.off = function(item) {
this.backgroundColor = '#b1b1b1';
item.backgroundColor = that.resolveColor(item.currentPriority);
this.value = false;
};
// Create a Label.
var todoTitleLabel = Ti.UI.createLabel({
text : title,
color : 'white',
font : {fontSize:11},
left : 40,
top : 35,
textAlign : 'center'
});
// Add to the parent view.
row.add(todoTitleLabel);
// Create a Button.
var deleteTask = Ti.UI.createButton({
title : 'Borrar',
height : 50,
width : 100,
top : 85,
left : 110,
item_type : 'DELETEBUTTON',
style : Ti.UI.iPhone.SystemButtonStyle.PLAIN,
color : '#000',
backgroundSelectedColor : '#F7F8E0',
selectedColor : '#F7F8E0',
backgroundColor : '#F7F8E0'
});
// Add to the parent view.
row.expand = function(){
this.height=160;
row.add(deleteTask);
};
row.contract = function(){
this.height=80;
row.remove(deleteTask);
};
var backgroundColorPriority = that.resolveColor(that.currentPriority);
row.backgroundColor = backgroundColorPriority;
that.currentRow = row;
checkbox.container = that.currentRow;
return that;
}
这就是我处理行上的点击事件的方式：
table.addEventListener('click', function(e){
if(e.source.item_type == 'CHECKBOX'){
if(false == e.source.value) {
e.source.on(e.source.container);
} else {
e.source.off(e.source.container);
}
}else if(e.source.item_type == 'DELETEBUTTON'){
alert('delete button');
}else if(e.source.item_type == 'ROW'){
if(!borraState){
Ti.API.info('IN ' + JSON.stringify(e));
taskId = e.row.value;
todoId = tasks[taskId].todoId;
index = e.index;
borraLayout.animate(borrarLayoutIn);
e.source.expand();
borraState = true;
}else{
Ti.API.info('OUT ' + JSON.stringify(e));
borraLayout.animate(borrarLayoutOut);
borraState = false;
e.source.contract();
}
}
});
我不明白为什么单击该行时颜色会被覆盖，即使我在处理事件时尝试重新定义背景颜色，但无济于事。我究竟做错了什么？