1 Reply Latest reply on May 17, 2006 1:51 PM by Newsgroup_User

    Depth control problem in Flex 2

    Level 7
      Hi! all.

      I have a question about the depth control in PopUpManager of Flex 2.

      As proved by my English, I'm not good at English.
      So, I made a mockup for what I wanted to explain.

      http://purplespider.cafe24.com/dev/flex2/fw/flash8window.html
      Please, check it first.


      Anyway,
      as you may can see now, I have 4 floating windows, of them, Tools and
      Layers windows are always laid above Work1 and Work2 windows.
      But, there are laid below menu and statebar components.

      As you already know, this is very common approach in GUI layout.
      I usually did it in Flash 8 or 7 with DepthManager and Layer(Container
      MovieClip which constrains the depth of child MovieClip).

      I want to do the same thing in Flex 2.
      However, when I make TitleWindow float through PopUpManager, whatever
      the parent MovieClip is, that floating TitleWindow always goes to the
      top most depth.
      I want to constrain the depth of the floating Window.

      I was looking for substitute of DepthManager, but there was no that kind
      of thing in Flex 2 anymore.
      Document just said that there is no use of DepthManager.

      So, I guess I miss something.
      Or, do I have to make my own PopUpManager or something?

      What is the best way to handle this in Flex 2?
      Any suggestion or clue will help me a lot.

      Thanks in advance.

      Don in Kobe.


        • 1. Re: Depth control problem in Flex 2
          Level 7
          Hello Don -

          So, you are correct - the Depth Manager is gone as of Flex 2. Now, there is
          native functionality in the player that manages the layering of objects.
          Take a look at DisplayObjectContainer methods like addChildAt(),
          removeChildAt(), getChildIndex() and setChildIndex(). Those methods affect
          the layering of child objects - when you use setChildIndex() to specify an
          index position that is already occupied, the child objects all re-shuffle
          accordingly.

          So, in your question below, you would constrain the depth of certain objects
          by using setChildIndex() to set the depth of the child as you see fit;
          popups would follow the same convention.

          Now that we understand how to do this at a conceptual level, lets figure out
          the guts of it. SystemManager has a public property called popUpChildren
          which is a list of the topmost popup windows being parented by the
          SystemManager. As popups are created, references to them are added to the
          popUpChildren list. What you will want to do is re-shuffle the layering of
          the popups in popUpChildren so that your newly created popUp is at a
          particular index.

          Below is some sample code I threw together. What it does is ensures that a
          particular popup, popUp1, is always at the top (ie: has the highest index).
          I'm hoping you can use this code as a stepping stone for your own work.

          Best of luck -

          Deepa Subramaniam
          Flex SDK Developer

          --test.mxml--

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">

          <mx:Script>
          import mx.managers.PopUpManager;
          import mx.managers.SystemManager;
          import mx.managers.PopUpManagerChildList;
          import mx.core.IFlexDisplayObject;

          private var popUp1:IFlexDisplayObject;

          private function createFirstPopUp():void
          {
          popUp1 = PopUpManager.createPopUp(this, childOne);
          }

          private function createSecondPopUp():void
          {
          PopUpManager.createPopUp(this, childTwo);

          //I always want popUp1 to be on the top
          systemManager.popUpChildren.setChildIndex(DisplayObject(popUp1),
          systemManager.popUpChildren.numChildren -1);
          }

          </mx:Script>

          <mx:Button click="createFirstPopUp(); " />
          <mx:Button click="createSecondPopUp(); " />


          </mx:Application>

          "DK" <pkunzip@shinbiro.com> wrote in message
          news:e4fcc8$8pl$1@forums.macromedia.com...
          > Hi! all.
          >
          > I have a question about the depth control in PopUpManager of Flex 2.
          >
          > As proved by my English, I'm not good at English.
          > So, I made a mockup for what I wanted to explain.
          >
          > http://purplespider.cafe24.com/dev/flex2/fw/flash8window.html
          > Please, check it first.
          >
          >
          > Anyway,
          > as you may can see now, I have 4 floating windows, of them, Tools and
          > Layers windows are always laid above Work1 and Work2 windows.
          > But, there are laid below menu and statebar components.
          >
          > As you already know, this is very common approach in GUI layout.
          > I usually did it in Flash 8 or 7 with DepthManager and Layer(Container
          > MovieClip which constrains the depth of child MovieClip).
          >
          > I want to do the same thing in Flex 2.
          > However, when I make TitleWindow float through PopUpManager, whatever the
          > parent MovieClip is, that floating TitleWindow always goes to the top most
          > depth.
          > I want to constrain the depth of the floating Window.
          >
          > I was looking for substitute of DepthManager, but there was no that kind
          > of thing in Flex 2 anymore.
          > Document just said that there is no use of DepthManager.
          >
          > So, I guess I miss something.
          > Or, do I have to make my own PopUpManager or something?
          >
          > What is the best way to handle this in Flex 2?
          > Any suggestion or clue will help me a lot.
          >
          > Thanks in advance.
          >
          > Don in Kobe.
          >
          >