根据窗口大小调整容器大小

Question

根据用户偏好，我有一个窗口女巫正在根据creationcomplete阶段调整大小。 这部分很好。 但是在这个窗口中存在s：Group（maincontainer2），即使宽度和高度以百分比表示，s：Group大小也是新窗口测量的大小。

我尝试用percentheigt和percentwidth来解决这个问题，但没有结果。 如果有人知道如何解决这个问题，我会很乐意阅读。

非常感谢

<?xml version="1.0" encoding="utf-8"?> 
<windowSkin:wCustomWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
          xmlns:s="library://ns.adobe.com/flex/spark" 
          xmlns:mx="library://ns.adobe.com/flex/mx" 
          skinClass="fr.interis.ui.windowSkin.CustomWindowSkin" 
          resizable="true" 
          creationComplete="wcustomwindow1_creationCompleteHandler(event)" 
          preinitialize="wContactPat_loadServices(event)" 
          xmlns:windowSkin="fr.interis.ui.windowSkin.*" 
          minWidth="400" minHeight="300" 

          xmlns:customNavTab="fr.interis.component.customNavTab.*" 
          xmlns:componentGlob="fr.interis.ui.componentGlob.*"> 
    <fx:Declarations> 
     <!-- Placer ici les éléments non visuels (services et objets de valeur, par exemple). --> 
     <s:HTTPService id = "phpContactPat" 
         fault = "serviceFault(event)" 
         method="POST" 
         resultFormat="e4x" 
         result = "resultContactPat(event)"/> 
    </fx:Declarations> 


    <fx:Script> 
     <![CDATA[ 
      import fr.interis.config.urlManager; 
      import fr.interis.ui.componentGlob.IconManager; 
      import fr.interis.util.DateUtility; 
      import fr.interis.util.FileSerializer; 
      import fr.interis.util.UserPrefs; 
      import fr.interis.util.windowPlace; 
      import fr.kapit.flex.ui.spark.loginBox.RetrievePasswordSkin; 

      import mx.collections.XMLListCollection; 
      import mx.controls.Button; 
      import mx.events.FlexEvent; 
      import mx.events.ItemClickEvent; 
      import mx.events.ResizeEvent; 
      import mx.rpc.events.FaultEvent; 
      import mx.rpc.events.ResultEvent; 

      import spark.events.GridSelectionEvent; 
      private var pg:UserPrefs; 





      private function closeMyWindow():void 
      { 
       stage.nativeWindow.dispatchEvent(new Event("myEventClose", true)); 
       stage.nativeWindow.close(); 
      } 

      private function onMyEventClose(e:Event):void 
      { 
       pg = new UserPrefs(); 
       this.pg.appPosX = stage.nativeWindow.x; 
       this.pg.appPosY = stage.nativeWindow.y; 
       this.pg.appWidth = stage.nativeWindow.width; 
       this.pg.appHeight = stage.nativeWindow.height; 
       FileSerializer.writeObjectToFile(this.pg, "prefcontactPat.up"); 

      } 

      private function serviceFault(event:FaultEvent):void 
      { 
       trace("Erreur "+ event.fault.message); 
      } 

      protected function wcustomwindow1_creationCompleteHandler(event:FlexEvent):void 
      { 
       stage.nativeWindow.addEventListener("myEventClose",onMyEventClose); 

       var pos:windowPlace = new windowPlace("prefcontactPat.up"); 
       stage.nativeWindow.x = pos.windowX; 
       stage.nativeWindow.y = pos.windowY; 
       stage.nativeWindow.height = pos.windowH; 
       stage.nativeWindow.width = pos.windowW; 





      } 



     ]]> 
    </fx:Script> 

    <s:VGroup paddingLeft="7" paddingRight="7" id="mainContainer" left="7" right="7" top="40" bottom="4"> 

     <s:HGroup width="100%" height="53" id="titleWin"> 

      <s:Image x="0" y="0" width="53" height="53" /> 

      <s:VGroup width="40%"> 
       <s:HGroup width="100%" height="50%"> <!-- Nom prenom--> 
        <s:Label text="{_patientNomPrenom}" id="lNomPrenom" fontWeight="bold"/> 
       </s:HGroup> 

       <s:HGroup width="100%" height="50%"> <!-- Naissance--> 
        <s:Label text="{_patientNaissance}" id="lNaissance" /> 
       </s:HGroup> 

      </s:VGroup> 

      <s:VGroup width="40%"> <!-- Modif--> 

       <s:Label id="ldhCrea" 
         textAlign="left" styleName="dataCreaModif"/> 
       <s:Label id="ldhModif" 
         textAlign="left" styleName="dataCreaModif"/> 
      </s:VGroup> 

     </s:HGroup> 



     <s:Group id="mainContainer2" width="100%"> 

      <s:layout> 
       <s:VerticalLayout paddingLeft="10" paddingRight="10" 
            paddingTop="5" paddingBottom="15"/> 
      </s:layout> 
      <!-- partie centrale--> 
      <s:DataGrid id="dgContactPat" fontWeight="normal" 
         dataProvider="{xmlCollContacts}" 
         width="100%" height="80%" selectionChange="dgContactPat_selectionChangeHandler(event)"> 
       <s:columns> 
        <s:ArrayList> 
         <s:GridColumn dataField="crIndex" visible="false"/> 
         <s:GridColumn dataField="ctTTypeCorrP" headerText="Relation" /> 
         <s:GridColumn dataField="crCorrespNP" headerText="Correspondant" /> 
         <s:GridColumn dataField="crTSpecialiteP" headerText="Spécialité" /> 
         <s:GridColumn dataField="crNumTel1" headerText="Téléphone" /> 
         <s:GridColumn dataField="crTelecopie" headerText="Fax" /> 
         <s:GridColumn dataField="crCodePostal" headerText="CP" /> 
         <s:GridColumn dataField="crTVilleP" headerText="Ville" /> 
        </s:ArrayList> 
       </s:columns> 
      </s:DataGrid> 



     </s:Group> 


    </s:VGroup> 



</windowSkin:wCustomWindow> 

的wCustomWindow

<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:fb="http://ns.adobe.com/flashbuilder/2009" 
       xmlns:Layout="skin.Layout.*" 
       alpha.disabledGroup="0.5"> 

     <fx:Metadata> 
      [HostComponent("fr.interis.ui.windowSkin.wCustomWindow")] 
     </fx:Metadata> 



     <s:states> 
      <s:State name="normal" /> 
      <s:State name="disabled" stateGroups="disabledGroup" /> 
      <s:State name="normalAndInactive" stateGroups="inactiveGroup" /> 
      <s:State name="disabledAndInactive" stateGroups="disabledGroup, inactiveGroup" /> 
     </s:states> 

     <s:Rect id="backgroundRect" 
       left="0" 
       right="0" 
       top="0" 
       bottom="0" 
       alpha="0" 
       > 
      <s:fill> 
       <s:SolidColor alpha="0"/> 
      </s:fill> 
     </s:Rect> 

     <s:Group bottom="0" left="0" right="0" 
       top="0" > 
      <!--Fond de la fenetre--> 
      <s:Rect bottom="0" left="0" right="0" 
        top="0" 
        radiusX="8" radiusY="8" > 
       <s:fill> 
        <s:SolidColor color="#656565" alpha=".7" /> 
       </s:fill> 
       <s:stroke> 
        <s:SolidColorStroke color="#666666" /> 
       </s:stroke> 
      </s:Rect> 

      <s:Group height="38" id="moveArea" 
        left="0" right="0"> 

       <!--Barre bleu avec filet--> 
       <s:Rect height="25" left="10" right="10" top="10"> 
        <s:fill> 
         <s:SolidColor color="#055a90" /> 
        </s:fill> 
        <s:stroke> 
         <s:SolidColorStroke color="#666666" /> 
        </s:stroke> 
       </s:Rect> 



       <s:BitmapImage id="icon" 
           left="5" verticalCenter="0" /> 

       <s:Label id="titleDisplay" 
         styleName="swindowTitle" 
         left="60" top="18" verticalAlign="middle" 
         /> 

       <!--Zone de bouton--> 

       <s:HGroup right="12" verticalCenter="0"> 

        <s:Button id="btMinimize" buttonMode="true" 
           skinClass="skin.components.MinimizeButtonSkin"/> 

        <s:Button id="btMaximize" buttonMode="true" 
           skinClass="skin.components.MaximizeButtonSkin"/> 

        <s:Button id="closeButton" buttonMode="true" 
           skinClass="skin.components.CloseButtonSkin"/> 

       </s:HGroup> 

      </s:Group> 

      <!--Fond de la zone principale--> 

      <s:Rect id="background" left="10" top="35" right="10" bottom="10"> 
       <s:fill> 
        <s:LinearGradient rotation="-90"> 
         <s:GradientEntry color="#edf0f7"/> 
         <s:GradientEntry color="#fcfbfb" /> 
        </s:LinearGradient> 
       </s:fill> 
       <s:stroke> 
        <s:SolidColorStroke color="#666666" /> 
       </s:stroke> 
      </s:Rect> 

      <!--Zone dans laquelle les elements vont se positionner--> 

      <s:Group id="contentGroup" left="15" right="15" top="43" bottom="15" minWidth="0" 
        minHeight="0" 
        width.disabled="100%" height.disabled="100%" 
        width.disabledAndInactive="100%" height.disabledAndInactive="100%" 
        width.normalAndInactive="100%" height.normalAndInactive="100%"> 

      </s:Group> 



      <s:Button height="14" id="btResize" width="14" 
         bottom="0" right="0" 
         skinClass="spark.skins.spark.windowChrome.GripperSkin" 
         buttonMode="false"/> 

     </s:Group> 

    </s:SparkSkin> 

和主机部分

package fr.interis.ui.windowSkin 
{ 
    import flash.display.NativeWindowDisplayState; 
    import flash.display.NativeWindowSystemChrome; 
    import flash.display.NativeWindowType; 
    import flash.events.Event; 
    import flash.events.EventDispatcher; 
    import flash.events.KeyboardEvent; 
    import flash.events.MouseEvent; 
    import flash.events.NativeWindowBoundsEvent; 
    import flash.ui.Keyboard; 

    import flashx.textLayout.elements.BreakElement; 

    import mx.core.IUIComponent; 
    import mx.core.IVisualElementContainer; 
    import mx.core.UIComponent; 
    import mx.events.FlexEvent; 
    import mx.events.ResizeEvent; 
    import mx.managers.WindowedSystemManager; 

    import spark.components.Group; 
    import spark.components.Label; 
    import spark.components.Window; 
    import spark.components.supportClasses.ButtonBase; 
    import spark.effects.Resize; 
    import spark.primitives.BitmapImage; 

    [Event(name="creationComplete", type="mx.events.FlexEvent")] 


    public class wCustomWindow extends Window//NativeWindow// 
    { 

     private var _systemManager:WindowedSystemManager; 
     private var _window:IVisualElementContainer; 

     [SkinPart(required = "false")] 
     public var btMinimize : ButtonBase; 

     [SkinPart(required = "false")] 
     public var btMaximize : ButtonBase; 

     [SkinPart(required = "false")] 
     public var btResize:ButtonBase; 

     [SkinPart(required = "false")] 
     public var closeButton:ButtonBase; 

     [SkinPart(required = "false")] 
     public var icon:BitmapImage; 

     [SkinPart(required = "false")] 
     public var moveArea:Group; 

     [SkinPart(required = "false")] 
     public var titleDisplay:Label; 


     private var _iconSource:Object; 
     private var _resizeCorner:String = "BR"; 
     private var _titleLabelText:Label; 

     public function wCustomWindow() 
     { 
      super();  

      // Set window properties 
      this.systemChrome = NativeWindowSystemChrome.NONE; //car sinon pas d'affichage du menu sous windows 
      //this.transparent = true; 
      this.type = NativeWindowType.UTILITY; 
      this.addEventListener(KeyboardEvent.KEY_DOWN, keyDownListener); 
     } 



     private function windowResizeHandler(event:Event):void 
     { 
      // prise en compte de la valeur mini 
      UIComponent(_window).height = stage.stageHeight; 
      UIComponent(_window).width = stage.stageWidth; 
     } 



     public function get iconSource():Object 
     { 
      return _iconSource; 
     } 

     public function set iconSource(value:Object):void 
     { 
      _iconSource = value; 
      if(icon) 
       if(icon.source!=value) 
        icon.source=value; 
     } 

     public function get titleText():String 
     { 
      return _titleLabelText.text; 
     } 

     public function set titleText(value:String):void 
     { 
      _titleLabelText.text= value; 
     } 

     protected override function partAdded(partName:String, instance:Object):void 
     { 
      super.partAdded(partName, instance); 

      switch(partName) 
      { 
       case 'icon': 
       { 
        icon.source = _iconSource; 
        break; 
       } 

       case 'titleDisplay': 
       { 
        //titleDisplay.text = _titleLabelText.text; 
        break; 

       } 
       case 'moveArea': 
       { 
        moveArea.addEventListener(MouseEvent.MOUSE_DOWN, startMove); 
        break; 
       } 

       case 'btResize': 
       { 
        btResize.addEventListener(MouseEvent.MOUSE_DOWN, startResize); 
        btResize.addEventListener(MouseEvent.MOUSE_UP,removeResize); 
        btResize.addEventListener(MouseEvent.MOUSE_OUT,removeResize); 
        btResize.addEventListener(MouseEvent.CLICK,removeResize); 

        break; 
       } 

       case 'btMinimize': 
       { 
        EventDispatcher(instance).addEventListener(MouseEvent.CLICK, minimizeW); 
        break; 
       } 

       case 'btMaximize': 
       { 
        EventDispatcher(instance).addEventListener(MouseEvent.CLICK, maximizeW); 
        break; 
       } 

       case 'closeButton': 
       { 

        closeButton.addEventListener(MouseEvent.CLICK, closeWindow); 

        break; 
       } 

      } 
     } 





     protected override function partRemoved(partName:String, instance:Object):void 
     { 
      super.partRemoved(partName, instance); 

      switch(partName) 
      { 
       case 'moveArea': 
       { 
        moveArea.removeEventListener(MouseEvent.MOUSE_DOWN,startMove); 
        break; 
       } 

       case 'btResize': 
       { 
        //EventDispatcher(instance).removeEventListener(MouseEvent.MOUSE_DOWN,startResize); 
        btResize.removeEventListener(MouseEvent.MOUSE_DOWN,startResize); 
        break; 
       } 

       case 'btMinimize': 
       { 
        EventDispatcher(instance).removeEventListener(MouseEvent.CLICK,minimizeW); 
        break; 
       } 

       case 'btMaximize': 
       { 
        EventDispatcher(instance).removeEventListener(MouseEvent.CLICK,maximizeW); 
        break; 
       } 
       case 'closeButton': 
       { 
        closeButton.removeEventListener(MouseEvent.CLICK,closeWindow); 

        break; 
       } 
       default: 
       { 
        break; 
       } 
      } 

     } 

     protected function maximizeW(e:MouseEvent):void 
     { 
      stage.nativeWindow.displayState == NativeWindowDisplayState.MAXIMIZED?stage.nativeWindow.restore():stage.nativeWindow.maximize(); 
     } 

     protected function minimizeW(e:MouseEvent):void 
     { 
      stage.nativeWindow.minimize(); 
     } 

     private function keyDownListener (e:KeyboardEvent):void { 

      if (e.keyCode == Keyboard.ESCAPE) { 
       stage.nativeWindow.dispatchEvent(new Event("myEventClose", true)); 
       stage.nativeWindow.close(); 
      } 
     } 

     protected function closeWindow(e:MouseEvent):void 
     { 
      stage.nativeWindow.dispatchEvent(new Event("myEventClose", true)); 

      stage.nativeWindow.close(); 

     } 

     protected function startMove(e:MouseEvent):void 
     { 
      stage.nativeWindow.startMove(); 
     } 

     protected function removeResize(e:MouseEvent):void 
     { 
      btResize.removeEventListener(MouseEvent.MOUSE_DOWN,startResize); 
      btResize.removeEventListener(MouseEvent.MOUSE_MOVE, startResize); 

     } 
     protected function startResize(e:MouseEvent):void 
     { 
      if(stage.nativeWindow.resizable) 
      { 
       stage.nativeWindow.startResize(_resizeCorner); 

       btResize.addEventListener(MouseEvent.MOUSE_UP,removeResize); 
       btResize.removeEventListener(MouseEvent.MOUSE_MOVE, startResize); 

       updateDisplayList(stage.nativeWindow.width,stage.nativeWindow.height); 
      } 
     } 
    } 
} 

Answer 1

我想尝试设置，mainContainer2高度= “100％” 如果没有按” t本身工作也许你需要手动触发一个invalidateSize（）和validateNow（）在它之后，你分配本地窗口大小，但并不完全确定为什么这不会自动导致它的子节点失效（可能与使用BasicLayout或绝对布局有关，因此它不考虑子节点的大小？不确定）。此外，我会尝试使用外部mainContainer的百分比大小，并查看是否有关根据左右值执行布局的问题导致问题，如果有的话，您可以将其全部包装到另一个组中，并将这些填充应用于其布局。