ポップアップパネルの子がパネル外に表示されるのはなぜですか？

Question

フレックス4ポップアップマネージャを使用してパネルをポップアップしていますが、パネルの子がパネル内に留まっていません。しかし、私がポップアップを閉じると、子供たちは取り除かれています。このよう

：（申し訳ありません私は写真を投稿することはできません）

  ---------- 
      l________l 
      l  l 
    ..... please enterl 
      l--------1 

誰もがなぜ知っていますか？ 、

<?xml version="1.0" encoding="utf-8"?> 
<s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" width="218" height="168" skinClass="PanelSkin" title="Reset Details"> 


    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 

      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.managers.PopUpManager; 

      // Handle the close button and Cancel button. 
      private function handleCloseEvent():void { 
       PopUpManager.removePopUp(this); 
      } 

     ]]> 
    </fx:Script> 

    <mx:Form horizontalCenter="0" verticalCenter="0"> 
     <mx:FormHeading label="Please enter your e-mail address and your login details will be e-mailed to you"/> 
     <mx:FormItem label="E-mail"> 
      <s:TextInput id="userInput" x="78" y="49"/> 
     </mx:FormItem> 
     <mx:FormItem direction="horizontal"> 
      <s:Button id="okButton" label="Submit" skinClass="ButtonSkin" /> 
      <s:Button id="cancelButton" label="Cancel" skinClass="ButtonSkin"/> 
     </mx:FormItem> 
    </mx:Form> 

</s:Panel> 

この上の任意のヘルプは素晴らしいだろう感謝：

var forgotPopup:Panel = PopUpManager.createPopUp(this, forgottenForm, true) as Panel; 
     PopUpManager.centerPopUp(forgotPopup); 

そして、ここでは私がポップアップするんだよ。ここに私のコードです。

Answer 1

次を使用してみてください：

<?xml version="1.0" encoding="utf-8"?> 
<s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" width="218" height="168" skinClass="PanelSkin" title="Reset Details"> 


    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 

      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.managers.PopUpManager; 

      // Handle the close button and Cancel button. 
      private function handleCloseEvent():void { 
       PopUpManager.removePopUp(this); 
      } 

     ]]> 
    </fx:Script> 

    <mx:Form left="10" right="10" top="10" bottom="10"> 
     <mx:FormHeading label="Please enter your e-mail address and your login details will be e-mailed to you"/> 
     <mx:FormItem label="E-mail"> 
      <s:TextInput id="userInput" x="78" y="49"/> 
     </mx:FormItem> 
     <mx:FormItem direction="horizontal"> 
      <s:Button id="okButton" label="Submit" skinClass="ButtonSkin" /> 
      <s:Button id="cancelButton" label="Cancel" skinClass="ButtonSkin"/> 
     </mx:FormItem> 
    </mx:Form> 

</s:Panel> 

あなたはヘッダワードがラップさせる必要がある場合は、標準FormHeadingを拒否しLabelに置き換える必要があります。

<?xml version="1.0" encoding="utf-8"?> 
<s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" width="218" height="168" skinClass="PanelSkin" title="Reset Details"> 


    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 

      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.managers.PopUpManager; 

      // Handle the close button and Cancel button. 
      private function handleCloseEvent():void { 
       PopUpManager.removePopUp(this); 
      } 

     ]]> 
    </fx:Script> 

    <mx:Form left="10" right="10" top="10" bottom="10"> 
     <s:Label width="100%" text="Please enter your e-mail address and your login details will be e-mailed to you" fontWeight="bold" /> 
     <mx:FormItem label="E-mail"> 
      <s:TextInput id="userInput" x="78" y="49"/> 
     </mx:FormItem> 
     <mx:FormItem direction="horizontal"> 
      <s:Button id="okButton" label="Submit" skinClass="ButtonSkin" /> 
      <s:Button id="cancelButton" label="Cancel" skinClass="ButtonSkin"/> 
     </mx:FormItem> 
    </mx:Form> 

</s:Panel> 

しかし、あるスイッチするための最良の方法Spark Formになります。これはFlex 4.5以降で利用可能です。

Answer 2

XとYの位置を避けてください これはまた、オブジェクトの位置を引き起こす可能性があります。