Flex MXML 布局問題

Question

所以我想要的是左邊的 ToggleSwitch 和右邊的 Button。 當 Screen 太小時，我希望 Button 變小並顯示一些“...”。 所以我用了：

<s:Group width="100%">
    <s:layout>
        <s:HorizontalLayout verticalAlign="middle"/>
    </s:layout>
    <s:ToggleSwitch />
    <s:Spacer width="100%"/>
    <s:Button label="TestTestTestTestTest"/>
</s:Group>

這工作正常，直到屏幕太小以至於按鈕中的整個 label 文本不適合。 然后兩個組件都在屏幕外左右浮動。

所以我嘗試使用基本布局：

<s:Group width="100%">
    <s:ToggleSwitch left="0" />
    <s:Button right="0" label="TestTestTestTestTest"/>
</s:Group>

也不行。 當屏幕太小時，按鈕會浮動在撥動開關上。 那么我怎樣才能讓它工作呢？

Answer 1

您可能已經快完成了，對於其中一個，如果您想要並排，只需從 HGroup 開始並防止其父級的布局“邊界違規”，打開 clipAndEnableScrolling 屬性。

<s:HGroup width="100%" clipAndEnableScrolling="true">
    <s:ToggleSwitch />
    <s:Rect width="100%" />
    <s:Button label="TestTestTestTestTest"/>
</s:HGroup>