appcelerator 钛合金 onclick 被忽略

Question

我在 index.xml 中的 ImageView 中添加了一个 onClick 侦听器。 单击 ImageView 不会触发 index.js 中指定的函数，但是将 onClick 添加到包含视图会触发。就好像包含视图正在捕获点击并且不允许包含的 ImageView 接收它。但是，我有几个这样的，其他的似乎工作正常。

index.xml：

<Alloy>
<Window class="container" onOpen="onWIndowLoad">
    <View id="wholeView">
        <!-- header -->
        <View id="appTopMenuHolder">
            <ImageView id="appMenuButton" image="/images/menu_icon.png" onClick="askWhy"></ImageView>
            <View id="appTitle"></View>
            <View id="newIcon"></View>
        </View>
        <View id="group"> <!-- removed onClick="testViewClick" -->
            <ImageView id="porfilePic" image="/images/profile.png" onClick="askWhy"></ImageView> <!-- removed onClick="askWhy" -->
        </View>
        <!-- scrollable status section -->
        <ScrollView id="statusViewHolder" scrollType="vertical">
        </ScrollView>
    </View>
</Window>

index.js：

function askWhy(e) {
    alert("why");
}

我们将不胜感激任何帮助或推动正确方向。 谢谢， -NP

Answer 1

我确定您的问题来自您的样式（通常在 .tss 文件中）。在你的 index.tss 文件中试试这个代码：

".container":{
    backgroundColor: 'black'
}
"#appTopMenuHolder":{
    top:0,
    backgroundColor: 'red',
    height: 100,
    width: Ti.UI.FILL
}
"#appTitle":{
    top:0,
    backgroundColor: 'yellow',
    height:20
}
"#newIcon":{
    top:20,
    backgroundColor: 'white',
    height:20
}
"#group":{
    top: 100,
    backgroundColor: 'blue'
}
"#statusViewHolder":{
    backgroundColor: 'green',
    bottom: 50,
    height: 100,
    width: Ti.UI.FILL
}

您的问题可能是您没有为视图指定位置和尺寸值。当发生这种情况并且未设置布局属性时，钛将居中视图并将尺寸设置为“自动”值。在这种情况下，'auto' 值将填充其父级。

这样您的视图 newIcon 可能会与视图重叠：appTitle 和 appMenuButton。 statusViewHolder 也可能发生同样的情况。它可能与wholeView 中的所有其他视图重叠。

也就是说，您最好指定所有组件的位置和尺寸以避免意外行为。