Работя върху Titanium и разработвам за iOS и създадох TableView с бутон във всеки ред и когато щракнете върху реда, към реда се добавя друг бутон, ако се щракне отново, бутонът се премахва, всеки контрол има свой собствен поведение и собствен стил. Проблемът, с който се сблъсквам, е, че когато щракна върху реда, стилът на бутоните се отменя, това, което имам предвид с това е, че ако някой от бутоните има определен цвят на фона, този цвят ще бъде отменен и заменен от backgroundColor на реда, това се случва и с цвета на шрифта.
Това е екранна снимка на това как изглежда редът, преди да се щракне върху него:
Следващият е, когато щракна върху реда и се добави другият бутон:
Вижте как цветът на фона на малкия сив бутон се променя на същия цвят като цвета на фона на реда. Същото се случва, когато щракна върху реда, за да изчезна бутона, и щракна отново върху реда, за да се появи отново:
Ето как дефинирам реда и бутоните:
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();
}
}
});
Не разбирам защо цветовете се отменят, когато се щракне върху реда, въпреки че се опитах да предефинирам цветовете на фона, когато се занимавам със събитията, но безуспешно. какво правя грешно