apache-flex - MXML:组合框宽度大于父宽度

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，这是父容器通常认为的最小可能大小的值，它可能大于容器自身的边界。