Почему дочерние элементы моей всплывающей панели появляются за пределами панели? - PullRequest
Новая
       29

Почему дочерние элементы моей всплывающей панели появляются за пределами панели?

0 голосов
/ 12 августа 2011

Я использую всплывающий менеджер flex 4, чтобы открыть панель, но дочерние элементы панели не остаются внутри панели.Но когда я закрываю всплывающее окно, дети удаляются.

Вот так: (извините, я не могу публиковать фотографии) 

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

Кто-нибудь знает почему?Вот мой код: 

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

И вот что я выскакиваю: 

<?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>

Любая помощь по этому вопросу была бы блестящей, спасибо.

Ответы [ 2 ]

0 голосов
/ 12 августа 2011

Пожалуйста, избегайте X и Y позиции, это также может привести к позициям объектов.

0 голосов
/ 12 августа 2011

Попробуйте использовать следующее: 

<?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.

...