10 Replies Latest reply on Apr 2, 2009 4:00 PM by Shelady

    PLEASE HELP WITH THE IMAGE

    Shelady Level 1
      Please let me kow what do I do to make a picture in the center of the relevant HBOX.

      The image is big so I make auto scale true but now it is all the way right and not the middle of its box.

      Here is the code

      Thanks




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



      <mx:HBox width="100%" height="20" backgroundColor="#000000" horizontalCenter="0" top="0"></mx:HBox>
      <mx:HBox width="100%" height="80" y="14">


      <mx:HBox width="18%" height="80" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
      <mx:HBox width="38%" height="80" backgroundColor="#FFD028" top="14"></mx:HBox>
      <mx:HBox width="34%" height="80" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
      <mx:HBox width="18%" height="80" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

      </mx:HBox>





      <mx:HBox width="100%" height="230" y="94">


      <mx:HBox width="18%" height="230" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
      <mx:HBox width="38%" height="230" top="14" visible="true">
      <mx:Image source="images/M1.jpeg" scaleContent="true" width="100%" height="100%" />

      </mx:HBox>
      <mx:HBox width="34%" height="230" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
      <mx:HBox width="18%" height="230" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

      </mx:HBox>





      <mx:HBox width="100%" height="200" y="94">


      <mx:HBox width="18%" height="200" top="14" left="0" backgroundColor="#FFD028" ></mx:HBox>
      <mx:HBox width="38%" height="200" backgroundColor="#FFD028" top="14"></mx:HBox>
      <mx:HBox width="34%" height="200" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
      <mx:HBox width="18%" height="200" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

      </mx:HBox>

      <mx:HBox width="100%" height="40" backgroundColor="#00000" horizontalCenter="0" bottom="0"></mx:HBox>




      </mx:Application>
        • 1. Re: PLEASE HELP WITH THE IMAGE
          Gregory Lafrance Level 6
          horizontalAlign="center"
          verticalAlign="middle"
          • 2. Re: PLEASE HELP WITH THE IMAGE
            Shelady Level 1
            THANKS THANKS THANKS

            But it is still not occuping the whole box and I can see black background from both sides.

            Any suggestations?

            Thanks
            • 3. Re: PLEASE HELP WITH THE IMAGE
              Gregory Lafrance Level 6
              If setting in MXML:
              paddingLeft="0"
              paddingTop="0"
              paddingRight="0"
              paddingBottom="0"

              If setting in ActionScript:
              myObj.setStyle("paddingLeft", 0);
              myObj.setStyle("paddingTop", 0);
              myObj.setStyle("paddingRight", 0);
              myObj.setStyle("paddingBottom", 0);
              • 4. Re: PLEASE HELP WITH THE IMAGE
                Shelady Level 1
                its mxml and nop, its not wroking. Picture is not in the center :(

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



                <mx:HBox width="100%" height="20" backgroundColor="#000000" horizontalCenter="0" top="0"></mx:HBox>
                <mx:HBox width="100%" height="80" y="14">


                <mx:HBox width="18%" height="80" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
                <mx:HBox width="34%" height="80" backgroundColor="#FFD028" top="14"></mx:HBox>
                <mx:HBox width="34%" height="80" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                <mx:HBox width="18%" height="80" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                </mx:HBox>





                <mx:HBox width="100%" height="230" y="94">


                <mx:HBox width="18%" height="230" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
                <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0">



                <mx:Image source="images/M1.jpeg" scaleContent="true" horizontalAlign="center"
                verticalAlign="middle" width="350" height="300" />



                </mx:HBox>
                <mx:HBox width="34%" height="230" backgroundColor="#FA3F0C" top="14"> </mx:HBox>

                <mx:HBox width="18%" height="230" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                </mx:HBox>





                <mx:HBox width="100%" height="200" y="94">


                <mx:HBox width="18%" height="200" top="14" left="0" backgroundColor="#FFD028" ></mx:HBox>
                <mx:HBox width="38%" height="200" backgroundColor="#FFD028" top="14"></mx:HBox>
                <mx:HBox width="34%" height="200" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                <mx:HBox width="18%" height="200" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                </mx:HBox>

                <mx:HBox width="100%" height="40" backgroundColor="#00000" horizontalCenter="0" bottom="0"></mx:HBox>




                </mx:Application>
                • 5. Re: PLEASE HELP WITH THE IMAGE
                  Gregory Lafrance Level 6
                  horizontalAlign="center" and verticalAlign="middle" should be in the HBox, not in the image tag.
                  • 6. Re: PLEASE HELP WITH THE IMAGE
                    Shelady Level 1
                    did that too but still has at least 20 pix black border on the side of the picture

                    thanks I appriciate your help.

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



                    <mx:HBox width="100%" height="20" backgroundColor="#000000" horizontalCenter="0" top="0"></mx:HBox>
                    <mx:HBox width="100%" height="80" y="14">


                    <mx:HBox width="18%" height="80" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
                    <mx:HBox width="34%" height="80" backgroundColor="#FFD028" top="14"></mx:HBox>
                    <mx:HBox width="34%" height="80" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                    <mx:HBox width="18%" height="80" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                    </mx:HBox>





                    <mx:HBox width="100%" height="230" y="94">


                    <mx:HBox width="18%" height="230" top="14" left="0" backgroundColor="#FFD028">

                    </mx:HBox>
                    <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                    paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" horizontalAlign="center"
                    verticalAlign="middle" >



                    <mx:Image source="images/M1.jpeg" scaleContent="true" width="350" height="300" />



                    </mx:HBox>
                    <mx:HBox width="34%" height="230" backgroundColor="#FA3F0C" top="14"> </mx:HBox>

                    <mx:HBox width="18%" height="230" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                    </mx:HBox>





                    <mx:HBox width="100%" height="200" y="94">


                    <mx:HBox width="18%" height="200" top="14" left="0" backgroundColor="#FFD028" ></mx:HBox>
                    <mx:HBox width="38%" height="200" backgroundColor="#FFD028" top="14"></mx:HBox>
                    <mx:HBox width="34%" height="200" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                    <mx:HBox width="18%" height="200" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                    </mx:HBox>

                    <mx:HBox width="100%" height="40" backgroundColor="#00000" horizontalCenter="0" bottom="0"></mx:HBox>




                    </mx:Application>
                    • 7. Re: PLEASE HELP WITH THE IMAGE
                      Gregory Lafrance Level 6
                      You've got lots of containers in your app. Try setting the following until you get what you want:

                      horizontalGap="0"
                      verticalGap="0"
                      paddingLeft="0"
                      paddingTop="0"
                      paddingRight="0"
                      paddingBottom="0"

                      and maybe also:
                      borderThickness="0"
                      focusThickness="0"
                      • 8. Re: PLEASE HELP WITH THE IMAGE
                        Shelady Level 1
                        Sir thank you so much because of your help I am 90% done. I wanted to put 2 pictures in the middle center boxex. I am only 10 pixels off for 'some reason ' but you helped me out a lot.

                        Thanks

                        This is the code and just almost done :)

                        please if any other suggestion to get those STUPID 10 pix


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



                        <mx:HBox width="100%" height="20" backgroundColor="#000000" horizontalCenter="0" top="0"></mx:HBox>
                        <mx:HBox width="100%" height="80" y="14">


                        <mx:HBox width="18%" height="80" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
                        <mx:HBox width="34%" height="80" backgroundColor="#FFD028" top="14"></mx:HBox>
                        <mx:HBox width="34%" height="80" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                        <mx:HBox width="18%" height="80" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                        </mx:HBox>





                        <mx:HBox width="100%" height="230" y="94">


                        <mx:HBox width="18%" height="230" top="14" left="0" backgroundColor="#FFD028">

                        </mx:HBox>
                        <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                        paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" horizontalAlign="center"
                        verticalAlign="middle" >



                        <mx:Image source="images/M1.jpeg" scaleContent="true" width="100%" height="300" />



                        </mx:HBox>
                        <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                        paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" horizontalAlign="center"
                        verticalAlign="middle" >



                        <mx:Image source="images/M5.jpeg" scaleContent="true" width="100%" height="300" />



                        </mx:HBox>

                        <mx:HBox width="18%" height="230" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                        </mx:HBox>





                        <mx:HBox width="100%" height="200" y="94">


                        <mx:HBox width="18%" height="200" top="14" left="0" backgroundColor="#FFD028" ></mx:HBox>
                        <mx:HBox width="38%" height="200" backgroundColor="#FFD028" top="14"></mx:HBox>
                        <mx:HBox width="34%" height="200" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                        <mx:HBox width="18%" height="200" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                        </mx:HBox>

                        <mx:HBox width="100%" height="40" backgroundColor="#00000" horizontalCenter="0" bottom="0"></mx:HBox>




                        </mx:Application>
                        • 9. Re: PLEASE HELP WITH THE IMAGE
                          Gregory Lafrance Level 6
                          I got rid of all the gaps. You'll need to fiddle around with it if you want to put back some of the gaps:
                          • 10. Re: PLEASE HELP WITH THE IMAGE
                            Shelady Level 1
                            with those gaps I want the mesh effect .

                            This is my last code. I am almost there but not enough.

                            I want pictures to take up all the space and leave only a little border around.

                            Any help?

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



                            <mx:HBox width="100%" height="20" backgroundColor="#000000" horizontalCenter="0" top="0"></mx:HBox>


                            <mx:HBox width="100%" height="80" y="14">
                            <mx:HBox width="18%" height="80" top="14" left="0" backgroundColor="#FFD028"></mx:HBox>
                            <mx:HBox width="34%" height="80" backgroundColor="#FFD028" top="14"></mx:HBox>
                            <mx:HBox width="34%" height="80" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                            <mx:HBox width="18%" height="80" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>
                            </mx:HBox>





                            <mx:HBox width="100%" height="230" y="94">
                            <mx:HBox width="18%" height="230" top="14" left="0" backgroundColor="#FFD028"> </mx:HBox>
                            <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                            paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" horizontalAlign="center"
                            verticalAlign="middle" >
                            <mx:Image source="images/M1.jpeg" scaleContent="true" width="100%" height="100%" horizontalAlign="center"
                            verticalAlign="middle"/>
                            </mx:HBox>
                            <mx:HBox width="34%" height="230" top="14" visible="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                            paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" horizontalAlign="center"
                            verticalAlign="middle" >



                            <mx:Image source="images/M5.jpeg" scaleContent="true" width="100%" height="100%" horizontalAlign="center"
                            verticalAlign="middle" />



                            </mx:HBox>

                            <mx:HBox width="18%" height="230" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                            </mx:HBox>





                            <mx:HBox width="100%" height="200" y="94">


                            <mx:HBox width="18%" height="200" top="14" left="0" backgroundColor="#FFD028" ></mx:HBox>
                            <mx:HBox width="38%" height="200" backgroundColor="#FFD028" top="14"></mx:HBox>
                            <mx:HBox width="34%" height="200" backgroundColor="#FA3F0C" top="14"> </mx:HBox>
                            <mx:HBox width="18%" height="200" backgroundColor="#FA3F0C" right="219" top="16"></mx:HBox>

                            </mx:HBox>

                            <mx:HBox width="100%" height="40" backgroundColor="#00000" horizontalCenter="0" bottom="0"></mx:HBox>




                            </mx:Application>