apache-flex - flex 组合框隐藏和显示向下箭头

Question

我希望实现一个搜索文本框，如下所示：

当用户开始输入并且有非零结果时，文本框将打开并在其下方显示结果。当用户选择一个结果时，文本框关闭，但这次带有一个向下箭头（如组合框），以便用户可以重新打开列表。

我怀疑我真正需要的是一个能够隐藏/显示向下箭头的组合框。我如何在 Flex 中做到这一点？

提前致谢。

Answer 1

我发现了一个简单的方法来做到这一点：

setStyle("箭头按钮宽度", 0);

在我的自定义组合框中，我将箭头按钮的初始宽度设置为 0。

然后在列表更改事件中，

  addEventListener(ListEvent.CHANGE, changeHandler);

如果 dataprovider 的大小大于 1，则箭头宽度设置回（比如说）20

  setStyle("arrowButtonWidth", 20);

这种方法比上述方法简单得多。如果您知道我的方法的任何陷阱，请分享。

Answer 2

如何创建一个具有两个状态的组件（文本输入和组合）的简单自定义画布。您在一种状态下显示 textinput 而在另一种状态下显示组合？

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
    <mx:states>
        <mx:State name="combo">
            <mx:RemoveChild target="{textinput1}"/>
            <mx:AddChild position="lastChild">
                <mx:ComboBox x="48" y="10"></mx:ComboBox>
            </mx:AddChild>
        </mx:State>
    </mx:states>
    <mx:TextInput x="48" y="10" id="textinput1"/>
    <mx:Label x="10" y="12" text="Text"/>

</mx:Canvas>

Answer 3

您还可以为任何一种情况提供自定义按钮外观，可以通过更改 styleName 来访问。这可能比 user294702 的解决方案更轻。

例如，对源和符号使用虚拟名称：

.comboBoxWithArrow {
  up-skin: Embed(source="graphics.swf",symbol="comboArrowUp");
  down-skin: Embed(source="graphics.swf",symbol="comboArrowDown");
  over-skin: Embed(source="graphics.swf",symbol="comboArrowOver");
  disabled-skin: Embed(source="graphics.swf",symbol="comboArrowDisabled");
  /* and any other skin states you want to support */
}

.comboBoxWithoutArrow {
  up-skin: Embed(source="graphics.swf",symbol="comboNoArrowUp");
  down-skin: Embed(source="graphics.swf",symbol="comboNoArrowDown");
  over-skin: Embed(source="graphics.swf",symbol="comboNoArrowOver");
  disabled-skin: Embed(source="graphics.swf",symbol="comboNoArrowDisabled");
  /* and any other skin states you want to support */
}

如果您的条件允许，请将 styleName 设置为显示箭头的名称，否则将其设置为不显示箭头的名称。