親コンテナの明示的な寸法のみに従うようにFlexでコンテナのサイズを調整する最良の方法
-
05-07-2019 - |
質問
私はFlexでこの問題に1年近く遭遇しており、毎回、当分の間機能するクイックハックソリューションを作成しています。誰かがより良いアイデアを持っているかどうかを見たいです。
問題の条件は次のとおりです。
|------Container ------------|
| explicitHeight: 400 (or whatever)
| |
| |-------- VBox -------| |
| | percentHeight: 100 | |
| | | |
| | |-Repeater------| | |
| | | Potentially | | |
| | | a lot of stuff. | |
|--|--|---------------|---|---|
問題は、私が望んでいることに反して、VBoxが常に親の明示的な高さに固執してスクロールバーを作成するのではなく、その中のコンテンツに合わせて拡張することです。
私の解決策は、親への参照にハードコーディングすることです(または、表示リストのどこまでも、割合ではなく明示的に設定された値を見つける必要があります)。
ユーティリティクラスでこれを使用することを検討しました:
public static function getFirstExplicitHeightInDisplayList(comp:UIComponent):Number{
if (!isNaN(comp.explicitHeight)) return comp.explicitHeight;
if (comp.parent is UIComponent) return
getFirstExplicitHeightInDisplayList(UIComponent(comp.parent));
else return 0;
}
より良い方法があることを教えてください。
解決
" autoLayout"を使用する必要がありますドキュメントとして言うVBoxのパラメーター:
"デフォルトでは、VBoxコンテナのサイズは、元のサイズで画像を保持するのに十分な大きさです。レイアウトの更新を無効にし、ズーム効果を使用して画像を拡大したり、移動効果を使用して画像の位置を変更したりすると、画像がVBoxコンテナの境界を越えて広がる可能性があります。
autoLayoutプロパティをfalseに設定したため、VBoxコンテナは画像のサイズが変更されてもサイズが変更されません。画像がVBoxコンテナの境界を超えるサイズに拡大すると、コンテナはスクロールバーを追加し、境界で画像をクリップします。
それがお役に立てば幸いです。
他のヒント
minHeightを0に設定するだけで十分です。
これは、VBoxに、サイズ変更時に子の測定値を無視し、代わりに自身/親の制約に基づいて高さを計算するように指示します。他のすべてを通常どおりに設定し、スクロールすると、他のすべてが完全に機能します。
1年前にこれに費やした日-直観的ではないので、おそらくプロパティにもっと良い名前を付けたかもしれません。これで時間を節約できることを願っています...
AutoLayout = falseは、子のサイズが変更されたときにのみレイアウトの再実行を防止するようです。ただし、子を追加または削除すると、レイアウトは再実行されます。
minHeight = 0を設定すると、VBoxの(外側の)サイズが子のサイズと数から完全に切断されます。これは、私が望んでいたものです。
Flexのソースコードを覗いてみたところ、minHeight = 0に設定することで望みどおりに機能するメカニズムが見当たらなかったため、Yarinに敬意を表します。ありがとう!
コンテナのプロパティを設定します:
clipContent = true;
verticalScrollPolicy = "off"
Vcodeが percentHeight = 100
になったら自動的にクリップするはずです
Flex 3で動作します。
本当に凝ったものにする必要がある場合は、オブジェクトにscrollRectを設定できます。
scrollRect = new Rectangle(x, y, w, h);
必要な処理に依存します。
実際、ヤリン・ケスラーはここで唯一の正しい答えをもたらしました (残念ながら、私はその投稿にコメントする権利がありません。だからここでやっています。)
HBoxのサイズ設定がパーセンテージ値に基づいている場合、コンテナのみがサイズに影響を与えることを期待しています。それは間違っています。別のルール、より強力なルールがあります。 コンテナ(HBox)の最小サイズは、それ自体の子コンポーネントのデフォルト/明示的なサイズを追加したものです。
したがって、パーセント値の結果が最小サイズよりも小さい場合、最小サイズが優先され、HBoxに適用されます。 HBoxはすべての子を表示しているため、スクロールバーは不要です。
したがって、使用:
minHeight = 0;
minWidth = 0;
は、HBoxに、子のデフォルトサイズではなく最小サイズが0であることを伝えるようなものです。あなたはそれを再定義しているので、最小サイズはパーセント値よりも小さく、戦闘に負けます。
これを説明するアドビのドキュメントで見つけた唯一のフレーズは次のとおりです:
パーセンテージベースのコンテナサイズは推奨です。 Flexは、コンテナを最小サイズで子に合わせて十分に大きくします。
希望を明確にしたい
(間違った英語の文章を修正してください...)