Appcelerator - Programmatische Toggle des Schalters in der kundenspezifischen TableViewRow

Question

Ich habe eine benutzerdefinierte TableViewRow mit einem Titel und den Schalter wie unten:

rowFilter.xml

<TableViewRow id="rowFilter"> 
    <View id="vwItemHeader"> 
     <Label id="lblItemHeader"></Label> 
    </View> 
    <View id="vwFilterStatus"> 
     <Switch id="swtFilterStatus" onChange="swtFilterStatusChange"></Switch> 
    </View> 
</TableViewRow> 

rowFilter.js

var args = arguments[0] || {}; 

var swtFilterStatusChange_callback; 

initialize(); 

function initialize() { 
    // Initialize filter row UI 
    $.lblItemHeader.text = args.title; 
    $.swtFilterStatus.value = args.value; 

    // Callback 
    swtFilterStatusChange_callback = args.callback; 
}; 

In eine Sicht, die ich Browse aufrufen, programmiere ich diese benutzerdefinierten Zeilen programmgesteuert wie folgt:

var args = { title: item.title, value: item.value, callback: swtFilterStatusChanged, }; 

var newRow = Alloy.createController('rowFilter', args).getView('rowFilter'); 

Dies funktioniert wie vorgesehen. Jetzt möchte ich jedoch ein Häkchen setzen/entfernen. Wie programmiere ich programmgesteuert einen Schalter in meinen benutzerdefinierten Zeilen?

Ich habe versucht, die folgende Funktion in rowFilter.js zu schaffen (und ein ähnliches für Toggle-off):

exports.toggleOn = function() { 
    if ($.swtFilterStatus.value == false) { 
     $.swtFilterStatus.value = true; 
     swtFilterStatusChange(); 
    } 
}; 

Und ich habe auch versucht, dieses:

$.toggleOn = function() { 
} 

:: EDIT :: So handle ich mit dem Check/De-Check-Schalter.

function allSwitch_Change(value) { 
    $.tblFilters.data[0].rows.forEach(function(row) { 
     if (value) { 
      row.toggleOn(); 
     } 
     else { 
      row.toggleOf(); 
     } 
    } 
} 

Ändern Sie dann die Browse.js Zeile über das tut Alloy.createController mit den folgenden:

var newRow = require('rowFilter'); 
newRow.initialize(args); 

Aber ich bekomme nur eine Ausnahme auf der Linie mit dem erfordern Erklärung, „konnte nicht gefunden werden Modul: rowFilter für Architektur: x86_64 ".

Was mache ich falsch und wie implementiere ich einen Haken?

Answer 1

Sie können etwas tun:

rowFilter.js

var args = arguments[0] || {}; 

var swtFilterStatusChange; 

initialize(); 

function initialize() { 
    // Initialize filter row UI 
    $.lblItemHeader.text = args.title; 
    $.swtFilterStatus.value = args.value; 

    // Callback 
    swtFilterStatusChange = args.callback; 
}; 

$.on('toggleOn',function(){ 
    if ($.swtFilterStatus.value == false) { 
     $.swtFilterStatus.value = true; 
     swtFilterStatusChange(); 
    } 
}); 

browser.js

var args = { title: item.title, value: item.value, callback: swtFilterStatusChanged, }; 

var newRow = Alloy.createController('rowFilter', args); 

newRow.trigger('toggleOn'); 

Weitere Möglichkeiten um Ihr Ziel zu erreichen:

1. Globale Ereignisse - Ti.App.addEventListener und Ti.App.fireEvent. Einfach zu implementieren, hat aber möglicherweise Speicherverlust. Rufen Sie nach dem Entfernen der Tabellenzeile unbedingt Ti.App.removeEventListener an.

2. Ruft die Switch-Ansicht aus children der Tabellenzeile ab. Zünden Sie das Ereignis manuell darauf an.

3. Speichern Sie den Verweis auf den Rückruf swtFilterStatusChanged irgendwo und rufen Sie es später.