如何在 Appcelerator 中使用父子关系更新图像视图的图像？

Question

我在我的 iOS 应用程序中创建了单选按钮，如下图所示。一旦用户单击任何单选按钮，我想将剩余单选按钮的图像从选中更改为未选中。

下面是我的事件监听器代码。

       vwBottomContainer.addEventListener("click", function(e) {
            Ti.API.info('e.source.id: ' + e.source.id);
            if (e.source.id == "CheckBox") {
                if (e.source.status == "unselected") {
                    e.source.status = "selected";
                    e.source.image = "/images/checked.png";
                } else {
                    e.source.status = "unselected";
                    e.source.image = "/images/unchecked.png";
                }
            } else if (e.source.id == "TextBox") {
                e.source.editable = true;
                e.source.focus();
            } else if(e.source.id == "radiobutton") {
                var t = null;
                for(t = 0 ; t < e.source.parent.parent.children.length; t++) {
                    e.source.parent.parent.children[t].children[0].image = "/images/radio-button_ori.png";
                    e.source.parent.parent.children[t].children[0].status = "unselected";
                    Ti.API.info('e.source: '+JSON.stringify(e.source.parent.parent.children[t].children[0]));
                }
                t = null;

                e.source.image = "/images/radio-button_active.png";
                e.source.status = "selected";
            }
        });

上面代码中的for循环无法将其他单选按钮的图片从选中变为非选中

你能告诉我我做错了什么吗？如果您想进一步澄清，也请告诉我。

感谢您的提前。

Answer 1

如果你使用 ListView，你应该使用 updateItemAt 方法。

从 Appcelerator 文档 (http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.ListItem) 中查看此示例：

$.listView.addEventListener('itemclick', function(e) {
    var item = $.section.getItemAt(e.itemIndex);
    if (item.properties.accessoryType == Ti.UI.LIST_ACCESSORY_TYPE_NONE) {
        item.properties.accessoryType = Ti.UI.LIST_ACCESSORY_TYPE_CHECKMARK;
        item.properties.color = 'red';
    } else {
        item.properties.accessoryType = Ti.UI.LIST_ACCESSORY_TYPE_NONE;
        item.properties.color = 'black';
    }
    $.section.updateItemAt(e.itemIndex, item);
});

Answer 2

你确定嵌套是正确的吗？那么e.source.parent.parent.children[t].children[0].image = "/images/radio-button_ori.png"; 是您要更改的单选按钮吗？

尝试不同的设置：

您在使用合金吗？然后只需给图像一个自己的 ID 并直接访问它。

如果不是：将所有单选按钮图像推入一个数组，向 vwBottomContainer 添加一个位置并从数组中访问单选按钮：

var rbts = [];
rbts.push(radioButtonImage1);
rbts.push(radioButtonImage2);
rbts.push(radioButtonImage3);
outerViewWithClickEvent1.radioID = 0;
outerViewWithClickEvent2.radioID = 1;
outerViewWithClickEvent3.radioID = 2;

onClick 事件内部：

rbts[e.source.radioID].image = "newImage.jpg";

如果您显示单选按钮的代码/视图也会有所帮助。