Question

我有一个宽度设置为100％的组合框。然而，当其中一个元素更大时，组合框也会变大，在我的应用程序中创建滚动条和其他丑陋！如何保持组合框中包含的组合框？
注意，如果关闭的组合框保持较小，则下降的列表会更大。

样品：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">
<!-- I'm using a Canvas instead of a VBox because the VBox spaces the elements too far appart -->
    <mx:HBox id="tagsHBox" width="{formsHBox.width - 16}" x="8" y="8">
        <!-- This label should align with the labels in the left form -->
        <mx:Label text="Tags" id="tabLabel" width="{titleTxt.x + 4}" textAlign="right" />
        <!-- This textbox should spread accross both forms, that's why it's in a seperate HBox -->
        <mx:TextInput height="20" width="100%" />
    </mx:HBox>

    <mx:HBox id="formsHBox" x="8" y="{8 + tagsHBox.height}" width="{this.width-16}">

        <mx:Form id="leftForm" width="50%">
            <!-- Personal details -->
            <mx:FormHeading label="Personal Details" width="100%" />
            <mx:FormItem label="First name" width="100%">
                <mx:TextInput text="{person.firstName}" width="100%"/>
            </mx:FormItem>
            <mx:FormItem label="Last name" width="100%">
                <mx:TextInput text="{person.lastName}" width="100%"/>
            </mx:FormItem>
            <!-- And 15 more formItems :) -->
        </mx:Form>

        <mx:Form id="rightForm" width="50%">
            <!-- Address -->
            <mx:FormHeading label="Address" width="100%" />
            <mx:FormItem label="Street" width="100%">
                <mx:TextInput text="{person.address.street}" width="100%"/>
            </mx:FormItem>
            <mx:FormItem label="City" width="100%">
                <mx:TextInput text="{person.address.city}" width="100%"/>
            </mx:FormItem>

            <mx:FormItem label="Country" width="100%">

                <!-- This combobox right here is the troublemaker. There's a
                     country named 'South Georgia and the South Sandwich
                     Islands' consising of a few small islands in the southern
                     pacific and a name which is too long for my innocent
                     unsuspecting combobox --> 
                <form:ComboBox id="countryCombo" height="20" width="100%"  
                        dataProvider="{model.systemDataModel.countries}" />
            </mx:FormItem>
            <!-- And 15 more formItems :) -->
        </mx:Form>
    </mx:HBox>
</mx:Canvas>

Answer 1

您可以使用minWidth代替。将其设置为零或其他一些低值。我知道它适用于像HBox和VBox这样的容器使它们比它们的父容器停止生长更大，因此它也可以与ComboBox一起使用。基本上，会发生的是minWidth =“0”会覆盖measuredMinWidth，这是父容器通常认为的最小可能大小的值，并且可能大于容器自己的边界。

Answer 2

我有同样的问题，我很容易解决。我有一个国家comboBox和一个状态comboBox组件，并动态填充国家名称和另一个与状态相关...我有一个HBox内的两个表单显示“两列像”表单，在右侧表单内有一个formItem并且在formItem里面有comboBox。问题是当我给comboBox提供了dataProvider然后出现了scrollBars而且非常恶心......

解决方案：我向您展示了正确的表单，因为它是问题（Form中的autoLayout =“false”，ComboBox定义中的minWidth =“0”）

<mx:Form autoLayout="false" verticalGap="12">
    <mx:FormItem label="Country" required="false" width="100%" direction="vertical">
        <mx:ComboBox id="countryComboBox" minWidth="0" width="100%" labelField="@name"/>
    </mx:FormItem>
    <mx:FormItem label="State" required="false" width="100%" direction="vertical">
        <mx:ComboBox id="stateComboBox" minWidth="0" width="100%" labelField="@name"/>
</mx:FormItem>
</mx:Form>

Answer 3

你可以使用绝对大小（以像素为单位）的maxWidth属性，但是组合框项目的一部分（比组合框大）会被裁剪。

来自adobe：组合框默认大小：宽度足以容纳主控制器显示区域下拉列表中的最长条目，以及下拉按钮。当下拉列表不可见时，默认高度基于标签文本大小。

MXML：组合框宽度大于父宽度

3 个答案: