1

コンテナー内の子の visible プロパティを false に設定した場合、コンテナーのサイズを変更するにはどうすればよいですか? 次の例では、「トグル」をクリックすると、「containerB」が非表示になりますが、メイン コンテナーのスクロール可能領域のサイズは変更されません。(たくさんの空きスペースをスクロールしたくありません。)

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[
        public function toggle():void {
            containerB.visible = !containerB.visible;
        }
    ]]>
</mx:Script>
<mx:VBox height="300" width="200" horizontalAlign="center">
    <mx:Button label="Toggle" click="toggle()" width="200"/>
    <mx:VBox id="containerA" height="400" width="150" horizontalAlign="center">
        <mx:Button label="A" height="400" width="100"/>
    </mx:VBox>
    <mx:VBox id="containerB" height="400" width="150" horizontalAlign="center">
        <mx:Button label="B" height="400" width="100"/>         
    </mx:VBox>
</mx:VBox>

4

2 に答える 2

2
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
    <![CDATA[
        public function toggle():void {
            containerB.visible = !containerB.visible;
        }
    ]]>
</mx:Script>
<mx:VBox height="300" width="200" horizontalAlign="center">
    <mx:Button label="Toggle" click="toggle()" width="200"/>
    <mx:VBox id="containerA" height="400" width="150" horizontalAlign="center">
        <mx:Button label="A" height="400" width="100"/>
    </mx:VBox>
    <mx:VBox id="containerB" height="400" width="150" horizontalAlign="center" includeInLayout="{containerB.visible}">
        <mx:Button label="B" height="400" width="100"/>         
    </mx:VBox>
</mx:VBox>
</mx:Application>

こんにちは、containerB の includeInLayout プロパティをその visible プロパティに依存するようにします。

conatinerB プロパティ リストに includeInLayout="{containerB.visible}" を追加しました。これは機能しています。

楽しい時間を過ごす

アンクル・シャルマ

于 2010-05-28T07:40:49.623 に答える
0

多くの方法がありますが、現在のコードを考えると、containerB の show および hide イベントをリッスンする必要があると思います。

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="creationComplete()">
<mx:Script>
    <![CDATA[
        public function toggle():void {
            containerB.visible = !containerB.visible;
        }
public function creationComplete():void{
 containerB.addEventListener(FlexEvent.SHOW, onContainerBChange );
 containerB.addEventListener(FlexEvent.HIDE, onContainerBChange );
}
public function onContainerBChange():void{
if(this.containerB.visible == true){
this.mainContainer.width = this.containerB.width + this.containerA.width
this.mainContainer.height = this.containerB.height + this.containerA.height
} else {
 this.mainContainer.width = this.containerA.width;
this.mainCintainer.height = this.containerA.height;
}
}

    ]]>
</mx:Script>
<mx:VBox height="300" width="200" horizontalAlign="center" id="mainContainer">
    <mx:Button label="Toggle" click="toggle()" width="200"/>
    <mx:VBox id="containerA" height="400" width="150" horizontalAlign="center">
        <mx:Button label="A" height="400" width="100"/>
    </mx:VBox>
    <mx:VBox id="containerB" height="400" width="150" horizontalAlign="center">
        <mx:Button label="B" height="400" width="100"/>         
    </mx:VBox>
</mx:VBox>

私はブラウザでコードを書いているので、これは疑似コードとして表示されます。onContainerBChange ハンドラーにサイズ変更コードを含める代わりに、ディスプレイリストを無効にしてコードを updateDisplayList(); に入れると、大きなプラスになります。

余談ですが。あなたの実際のコードが、内部にコンテナーしかない VBox を使用しないことを願っています。この単純な例では、containerA と containerB を完全に削除して、VBox に 3 つのボタンだけを配置できない理由はありません。

于 2010-05-28T02:41:34.593 に答える