4 Replies Latest reply on Oct 17, 2006 5:57 PM by navi_balraj

    Auto-resize a panel

    digitalentropy Level 1
      Hello,

      I have a panel holding a variety of content. As content is added or removed, I would like the panel to resize itself to fit, rather than adding vertical scrollbars. Does anyone know a way of accomplishing this?
        • 1. Re: Auto-resize a panel
          mike_morearty Level 1
          If the Panel does not have a specified width and height, it will resize automatically. A sample:

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" >
          <mx:Button label="Add more content" click="addContent()" />
          <mx:Panel id="mypanel" >
          <mx:Label text="hi" />
          <mx:Label text="hi" />
          <mx:Label text="hi" />
          <mx:Label text="hi" />
          </mx:Panel>

          <mx:Script>
          <![CDATA[
          private function addContent():void
          {
          var newLabel:Label = new Label();
          newLabel.text = "hi";
          mypanel.addChild(newLabel);
          }
          ]]>
          </mx:Script>
          </mx:Application>
          • 2. Re: Auto-resize a panel
            digitalentropy Level 1
            Mike,

            Thank you. This works, but only if I do not set layout="absolute" in the panel.

            I am trying to achieve the following:

            I want a panel which contains a tabbar and a viewstack. The tabbar, obviously, controls the viewstack. I would also like both these to be inset so they do not take up the full panel (i.e., there is a 10px or so border around them.)

            Unforunately, I cannot set the left/right/top/bottom attributes if the layout is not absolute. Equally frustrating is that when I set the layout to absolute, I get vertical scrollbars instead of a resized panel.

            Suggestions?
            • 3. Re: Auto-resize a panel
              digitalentropy Level 1
              Here is a sample:
              <?xml version="1.0" encoding="utf-8"?>
              <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">

              <mx:Panel id="pan" x="246" y="173" layout="absolute" styleName="OuterPanel">

              <mx:TabBar dataProvider="stack" tabHeight="33">

              </mx:TabBar>

              <mx:ViewStack id="stack" resizeToContent="true" top="33">
              <mx:Canvas label="one" width="450" height="200" backgroundColor="#000000"/>
              <mx:Canvas label="two" backgroundColor="#FF0000" width="700" height="500" borderStyle="solid" borderColor="#000000" borderThickness="4">
              </mx:Canvas>
              <mx:Canvas label="three" width="200" height="200"/>
              </mx:ViewStack>

              </mx:Panel>

              </mx:Application>

              When I click a tab, I would like the panel to resize so the selected canvas fits completely! Unforunately, scroll bars show up instead. There has to be a way to do this, I just can't figure out how. Eventually I will only care about the panel shrinking/expanding vertically, as the width will be fixed.
              • 4. Re: Auto-resize a panel
                navi_balraj
                Hi,

                how will I add a delay in resizing the panel?..kind of gradual resizing

                Thanx,
                Naveen