0

我正在对Spark:TabBar. 这是我想要完成的图表：

_______________________
|                     |
|  Label            X |
|_____________________|

所以我们有一个按钮（我在spark:ButtonBarButton组件上使用自定义皮肤），它有一个标签和一个辅助按钮，用于从列表中删除所述项目。X仅当用户将鼠标悬停在主按钮上时才应显示该按钮。

我遇到的问题是我完全无法与X按钮交互，因为它是按钮中的按钮。它不响应悬停状态，并且我附加到它的任何点击处理程序都不会触发 - 而是触发父按钮的点击事件。

我目前正在玩弄 using stopPropagation，但这不会（或者更确切地说我不希望它）解决悬停状态问题，并且正在寻找更可行的解决方案。

以下是我的代码的一些示例：

VerticalPillBarSkin - 主机组件：spark.components.TabBar

<s:DataGroup id="dataGroup" width="100%" height="100%" clipAndEnableScrolling="true">
    <s:layout>
        <s:VerticalLayout paddingRight="3" gap="3"/>
    </s:layout>
    <s:itemRenderer>
        <fx:Component>
            <s:ButtonBarButton skinClass="{VerticalPillBarButtonSkin}" width="120"/>
        </fx:Component>
    </s:itemRenderer>
</s:DataGroup>

VerticalPillBarButtonSkin - 请注意，这SymbolButton是一个扩展 ButtonBase 的自定义组件。

<s:Label id="labelDisplay" color="0x000000"
         textAlign="left" verticalAlign="middle"
         horizontalCenter="0" verticalCenter="1"
         left="0" right="12" top="6" bottom="6" />

<s:Spacer width="100%" />

<x:SymbolButton  id="removeButton" 
                  includeIn="overStates"
                  icon="{REMOVE}"
                  iconRollover="{REMOVE_OVER}"
                  right="5" verticalCenter="0" click="closeHandler()" />

有谁知道解决这个问题的好方法？我玩过使用除s:ButtonBarButtonas 以外的其他东西VerticalPillBarButton，但这似乎不是一个可行的选择。如果我能提供任何其他信息，请随时询问。

4

3 回答 3

1

几点建议，

  • 我会在子按钮上设置 buttonMode 属性，看看是否可行。
  • 此外，当用户点击 X 时，事件处理程序（父按钮）可以知道目标和当前目标，因为用户点击 X，目标将是按钮 X。您可以执行 If else 来确定要执行的操作拿。
于 2013-10-29T20:56:46.303 回答
1

将MouseEvent.CLICK处理程序附加到辅助按钮并调用event.stopImmediatePropagation(). 这将防止它进一步触发冒泡事件。

private function secondaryClickHandler( e:MouseEvent ):void {
    e.stopImmediatePropagation();

    // run click code here
}

所以基本上，点击源自辅助按钮并冒泡到主按钮，然后触发另一个处理程序。如果它来自辅助按钮，这将确保它不会点击该主按钮。

您可能也需要这样做MouseEvent.MOUSE_UP/代替。我相信顺序是向下->向上->单击，但我不记得了。

于 2013-10-29T23:57:16.540 回答
0

我的问题实际上是两个非常相关的问题，我将在这里回答它们。

  1. 'X' 按钮的悬停状态被忽略

这是稍微复杂的解决方案，但要点是我必须创建一个自定义 itemRenderer 而不是 skinning ButtonBarButton。

  1. 'X' 按钮点击事件被忽略

虽然我的问题似乎使这成为主要问题，但解决方案实际上非常简单。@Zeus 或 @Josh 解决方案都不适合我的原因是 itemrenderer 皮肤中没有关闭状态。因为X按钮被设置为仅包含在悬停状态中，所以它实际上已从视图中删除 onclick，因此永远不会触发其单击事件。相当大的掌心时刻。

TL;DR -不要忘记向下状态！

于 2013-10-30T19:30:18.717 回答