【问题标题】:Appcelerator - Programmatic Toggle of Switch in Custom TableViewRowAppcelerator - 自定义 TableViewRow 中的编程切换开关
【发布时间】:2016-03-25 01:37:56
【问题描述】:

我有一个自定义的 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:: 以下是我处理选中/取消选中所有开关的方式。

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

但我只是在 require 语句中遇到一个异常,说“找不到模块:rowFilter for architecture: x86_64”。

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

【问题讨论】:

    标签: javascript appcelerator appcelerator-titanium


    【解决方案1】:

    你可以这样做:

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

    浏览器.js

    var args = { title: item.title, value: item.value, callback: swtFilterStatusChanged, };
    
    var newRow = Alloy.createController('rowFilter', args);
    
    newRow.trigger('toggleOn');
    

    实现目标的其他选择:

    1. 全局事件 - Ti.App.addEventListener 和 Ti.App.fireEvent。易于实现,但有潜在的内存泄漏。确保在删除表格行后调用Ti.App.removeEventListener。

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

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

    【讨论】:

    • 现在我收到这条消息的异常:“未定义不是函数(正在评估 'row.trigger(\"toggleOff\")')”。查看我的编辑,显示我如何在另一个函数中调用它。
    • 不确定是否重要,但我尝试在创建控制器的单独函数中切换行开关。
    • 我的错。没看到你在控制器上打电话给getView。 trigger 是控制器本身的功能。因此,您必须将控制器的引用存储在某处以供以后访问。答案已更新。
    • 当我在 Browse 中存储行控制器数组时,会调用我的切换函数。但是,当我以编程方式切换开关时,UI 不会刷新。知道怎么做吗?
    • 想通了。感谢您的帮助!
    猜你喜欢
    • 2015-01-24
    • 2020-03-21
    • 2015-03-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-02-26
    相关资源
    最近更新 更多