Appcelerator - 在自定义TableViewRow中以编程方式切换开关

时间:2016-03-25 01:37:56

标签: javascript appcelerator appcelerator-titanium

我有一个带有标题和开关的自定义TableViewRow,如下所示:

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;
};

在视图中我调用Browse,我以编程方式添加这些自定义行,如下所示:

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

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

这与预期一样有效。但是现在我想添加一个检查/取消选中所有行。如何以编程方式在我的自定义行中切换开关?

我尝试在rowFilter.js中创建以下函数(以及类似的用于切换的函数):

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

我也试过这个:

$.toggleOn = function() {
}

:: EDIT ::这是我处理check / uncheck all开关的方法。

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

然后使用以下内容更改Alloy.createController上面的Browse.js行:

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

但是我只是在需要声明的行上得到一个异常,说&#34;无法找到模块:rowFilter for architecture:x86_64&#34;。

我做错了什么以及如何实施检查/取消选中所有行?

1 个答案:

答案 0 :(得分:2)

您可以这样做:

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');

实现目标的其他选择:

  1. 全球活动 - Ti.App.addEventListenerTi.App.fireEvent。易于实现,但有潜在的内存泄漏。确保在删除表格行后调用Ti.App.removeEventListener

  2. 从表格行children获取切换视图。手动触发事件。

  3. 将引用存储在某处的回调swtFilterStatusChanged,稍后再调用。