これは、答え方がわからない簡単なレイアウトの質問です。
次HGroup
の 3 つの要素で構成される があります。
- 通常の Flex
Group
は 50% 伸びる必要があります。 - 幅が px (たとえば 100px) で指定されたボタン。
Group
残りのスペースを取る必要がある別のフレックス。
問題は、3 番目の要素 (Another Flex Group
) にすべての空き領域を取得するように指示する最良の方法は何ですか?
これは、答え方がわからない簡単なレイアウトの質問です。
次HGroup
の 3 つの要素で構成される があります。
Group
は 50% 伸びる必要があります。Group
残りのスペースを取る必要がある別のフレックス。問題は、3 番目の要素 (Another Flex Group
) にすべての空き領域を取得するように指示する最良の方法は何ですか?
50%の完全性を維持するために私がすることは次のとおりです
<s:HGroup width="100%">
<s:Group width="50%" />
<s:HGroup width="50%">
<s:Button width="100"/>
<s:Group width="100%" />
</s:HGroup>
</s:HGroup>
編集:もう少し説明
グループの幅を 100% に設定すると、グループが引き伸ばされて、残っているスペース (右側の 50% 内) を占有します。
この方法で行うこともできますが、Jason Reeves の答えははるかに優れており、失敗する可能性が低くなります。この方法の唯一の本当の利点は、H/VGroup が少ないことです。これは、レンダリングにあまり適していません (ステージ上に多数の H/VGroup がある場合、またはそれらに多くの子がある場合、それらが使用するレイアウトによって速度が低下する可能性があります)。 )とにかく、私はこの方法よりも他の方法を使用します。
<s:HGroup id="rectContainer" width="100%" height="100%" gap="0">
<s:Rect id="rect1" width="50%" height="100%"/>
<s:Rect id="rect2" width="100" height="100%"/>
<s:Rect id="rect3" width="{this.rectContainer.width - ( .5 * this.rectContainer.width ) - rect2.width}" height="100%"/>
</s:HGroup>