11 Replies Latest reply on May 11, 2009 10:18 AM by Gregory Lafrance

    Some layout questions

    ShaF10

      Hi Guys

       

      There are a few changes I want to make to the layout:

       

      1. I have a HBox at the top of the flex screen which I want stuck at the top as the user scrolls down.

       

      2. Whenever a component requires the user to scroll, I have noticed that there is overflow on the horizontal scroll, does anyone know how I can get rid of this without turning to horizontalScrollPolicy for the <mx:windowedapplication> tag off ?

       

      3. How can I specify the diemensions for the windows when it initially starts (i.e. maximised, or certain height/width etc) ?

       

      4. There is this grey bar approx. 30pixels high running across the bottom of the application window, how do I get rid of this ?

       

      Code below:

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%">
      
          <mx:VBox width="100%" height="100%" backgroundColor="0xEEEEEE" verticalScrollPolicy="off" horizontalScrollPolicy="off">
              
              <!-- Toolbar -->
              <mx:HBox width="100%" backgroundColor="0xCCCCCC" paddingTop="5" paddingBottom="5" paddingLeft="5">
      
              </mx:HBox>
      
              <!-- Textarea -->
              <mx:VBox id="documentContainer" paddingBottom="10" width="100%" height="100%" horizontalAlign="center">
      
              </mx:VBox>
              
          </mx:VBox>
          
      </mx:WindowedApplication>
      
        • 1. Re: Some layout questions
          Gregory Lafrance Level 6

          1. I have a HBox at the top of the flex screen which I want stuck at the top as the user scrolls down.

          Use a ControlBar

           

          2. Whenever a component requires the user to scroll, I have noticed that there is overflow on the horizontal scroll, does anyone know how I can get rid of this without turning to horizontalScrollPolicy for the <mx:windowedapplication> tag off ?

          Don't know what you mean.

           

          3. How can I specify the diemensions for the windows when it initially starts (i.e. maximised, or certain height/width etc) ?

          this.width, this.height

           

          4. There is this grey bar approx. 30pixels high running across the bottom of the application window, how do I get rid of this ?

          Post a screen shot with that area circled in red.

          • 2. Re: Some layout questions
            ShaF10 Level 1

            Thanks for the reply.

             

            1. Which property in the controlbar will make it stick to the top when scrolling ?

             

            2. Please see Fig.2 in link below - As you can see, the textarea isn't dominating all the horizontal space yet the bar is still active.

             

            3. How would I start the application in maximised mode ?

             

            4. See Fig.1 in link below

             

            IMAGE: http://img14.imageshack.us/img14/4028/applicationb.png

            • 3. Re: Some layout questions
              Fredy Gadotti

              1. <mx:ApplicationControlBar dock="true" /> will solve your problem.

               

              2. horizontalScrollPolicy="off" maybe solve this.

               

              3. If you are using AIR you should read about yourapp-app.xml file, there you can found some util information about the application properties.

               

              4.  I thought you can turn this 'off' setting borderThicknessBottom="0".

               

              I hope this was usefull.

              1 person found this helpful
              • 4. Re: Some layout questions
                ShaF10 Level 1

                Thanks for the reply.

                 

                1. Thanks

                 

                2. It does, but there are times where I may need the horizontal scroll and turning it off will leave it off permanently.

                 

                3. Thanks

                 

                4. The <mx:WindowedApplication> tag has a borderThickness property but not a borderThicknessBottom property. However, Ive set the borderThickness to 0 to no avail.

                 

                Message was edited by: ShaF10

                • 5. Re: Some layout questions
                  Gregory Lafrance Level 6

                  This code works.

                   

                  <?xml version="1.0" encoding="utf-8"?>
                  <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
                    creationComplete="init();">
                    <mx:Script>
                      <![CDATA[
                        import flash.system.Capabilities;
                       
                        private function init():void{
                          this.statusBar.visible = false;
                          this.width = Capabilities.screenResolutionX;
                          this.height = Capabilities.screenResolutionY;
                          this.maximize();
                        }
                      ]]>
                    </mx:Script>
                    <mx:ApplicationControlBar width="100%" dock="true">
                      <mx:Label text="Stuck at Top" fontSize="20"/>
                    </mx:ApplicationControlBar>
                    <mx:TextArea height="2000" text="Greg is here."/>
                  </mx:WindowedApplication>

                  1 person found this helpful
                  • 6. Re: Some layout questions
                    ShaF10 Level 1

                    Thanks, thats resolved most issues. But if you execute the application you'll see the bar at the bottom. Its not visible because the background colour is the same as the rest of the app. How do I get rid of that?

                    • 7. Re: Some layout questions
                      Gregory Lafrance Level 6

                      this.statusBar.visible = false;

                       

                      If my posts answer your question or help, please mark as such.

                      • 8. Re: Some layout questions
                        ShaF10 Level 1

                        I always do.

                         

                        The statusbar.visible = false doesn't work ..

                        • 9. Re: Some layout questions
                          Gregory Lafrance Level 6

                          But it worked in the code I provided. How does your code differ from mine that could cause it not to work?

                          • 10. Re: Some layout questions
                            ShaF10 Level 1

                            Your example has the problem too. Make the window small enough to activate the scroll bars or change the background colour and it should be visible.

                            • 11. Re: Some layout questions
                              Gregory Lafrance Level 6

                              I don't see the status bar, but the space it occupies still seems to be occupied. I tried this but it did not work:

                               

                              this.statusBar.includeInLayout = false;

                               

                              I'm sorry. I guess I got you almost there.