如何防止截断 Flex 组合框中的文本底部？答案

【问题标题】：How to prevent truncating the bottom of text in Flex comboboxes?如何防止截断 Flex 组合框中的文本底部？
【发布时间】：2011-11-03 16:19:37
【问题描述】：

我目前正在修改 flex GUI 以使其焕然一新。我是 flex 新手，但我设法完成了大部分工作。但是我对组合框有一个问题：我使用了相当大的字体大小并且某些字符的底部被截断（例如“g”，或者任何低于基线的字符）：

我最初认为这是组件高度的问题，但即使高度非常大，字符也会被截断，文本上方和下方都有很大的空白。
我在网上寻找解决方案，但没有找到。最糟糕的是：尽管这似乎很重要，但我无法找到有关我的问题的参考。是否有 CSS 属性可以防止这种行为，还是我必须在别处寻找？

编辑：我使用 Flex 3 和 Halo/MX 组件

【问题讨论】：

您使用的是 Spark 还是 Halo/MX 组件？
你能告诉我们现有的代码吗？这将使我们更容易为您提供准确的解决方案。

标签： css apache-flex combobox halo

【解决方案1】：

我相信这不是 Comobox 本身，而是它的内部标签。您可以尝试设置 paddingBottom，以查看标签是否会继承它，但您可能会更幸运地创建自己的标签子类并将其用作 textFieldClass。

【讨论】：

对于可能经常需要的东西来说，这似乎有点矫枉过正......我仍然不明白为什么我无法在其他地方找到对这个问题的参考，因为它确实会影响 GUI 的最终外观。
如果你进入 Robotlegs，创建一个类的扩展来作为一个标记来表达“我想以不同的方式处理这些类的实例”是很常见的。在您的情况下，您只需创建一个 MyLabel 扩展标签类，然后为 MyLabel 创建特殊的 css。大约 2 分钟的工作...... 2 分钟的工作在我的世界里并不过分:)
我设法扩展了 Label 类并使用 CSS 设置其样式，并将其定义为组合框的 itemrenderer。但是它只影响下拉项，我怎样才能使用我的类作为选定字段的渲染器？
抱歉，我必须深入了解 Combobox 才能看到具体细节，而且我还有一些事情需要做，然后才有时间去做（如果有的话）。

【解决方案2】：

组合框组件包含一个内部 TextInput。您必须扩展 ComboBox 类并将 textinput 的高度修改为您需要的高度。

例如，假设您将字体大小设置为 20 并且这个扩展类：

public class MyCb extends ComboBox
    {
        public function MyCb()
        {
            addEventListener(FlexEvent.CREATION_COMPLETE, onCreationComplete);          
        }

        private function onCreationComplete(e:Event):void {
            this.textInput.height = 40;
        }
    }

主要应用：

<mx:VBox width="100%" height="100%">    
    <mx:ComboBox fontSize="20" >
        <mx:dataProvider>
            <mx:Object label="goubigoulba"/>
            <mx:Object label="goubigoulba"/>
        </mx:dataProvider>
    </mx:ComboBox>

    <local:MyCb fontSize="20"   >
        <local:dataProvider>
            <mx:Object label="goubigoulba"/>
            <mx:Object label="goubigoulba"/>        
        </local:dataProvider>       
    </local:MyCb>   
</mx:VBox>

你会得到以下结果：

【讨论】：