简体   繁体   English

如何防止在Flex组合框中截断文本的底部?

[英]How to prevent truncating the bottom of text in Flex comboboxes?

I am currently modifying a flex GUI to give it a new look. 我目前正在修改Flex GUI,以使其具有新外观。 I am new to flex but I manage to get most of the work done. 我是flex的新手,但我设法完成了大部分工作。 However I have a problem with comboboxes: I use a rather big font size and the bottom of some characters is truncated ("g" for example, or any character going under the baseline): 但是,我对组合框有一个问题:我使用了相当大的字体,并且某些字符的底部被截断了(例如,“ g”或基线以下的任何字符):
截短的g

I first thought it was a problem with the component height, but even with a very large height the characters got truncated, with big empty spaces above and under the text. 我首先认为这是组件高度的问题,但是即使高度很大,字符也会被截断,文本上方和下方都有很大的空白空间。
I looked for a solution on the net but did not find one. 我在网上寻找解决方案,但没有找到解决方案。 Worst: I was not able to find references to my problem though it seems to be an important one. 最差:虽然我的问题似乎很重要,但我找不到它的引用。 Is there a CSS property to prevent this behavior or do I have to look elsewhere? 是否有CSS属性可防止此行为,或者我必须在其他地方查看?

edit: I use Flex 3 and Halo/MX components 编辑:我使用Flex 3和Halo / MX组件

I believe that this is not the Comobox itself, but its internal label. 我相信这不是Comobox本身,而是它的内部标签。 You can try setting paddingBottom, to see if the label will inherit that, but you might have better luck creating your own subClass of label and using it as the textFieldClass. 您可以尝试设置paddingBottom,以查看标签是否会继承该标签,但是最好创建自己的label子类并将其用作textFieldClass。

The combobox component contains an inner TextInput. 组合框组件包含一个内部TextInput。 You have to extend the ComboBox class and modify the height of the textinput to what you need. 您必须扩展ComboBox类,并将textinput的高度修改为所需的高度。

For example, lets say you put a font size of 20 and this extended class: 例如,假设您将字体大小设置为20并添加了此扩展类:

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

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

Main application: 主要应用:

<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>

You will get the following result: 您将得到以下结果:

在此处输入图片说明

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM