13 Replies Latest reply on Apr 28, 2009 5:05 PM by Shakalandro

    Exporting a normal swf

    Shakalandro

      So when I export my flex app I get this annoying grayish-blue background that fills up the entre webpage as part of the swf. Also, the content of the swf resizes itself past wht I have drawn. Is there a way to get the extraneous background to go away and to stop the file from resizing itself. I want to just get a normal swf file exported so I can embed it in my web page.

       

      planetvance.com/laf/artGallery.swf

        • 1. Re: Exporting a normal swf
          ATIF FAROOQ Level 3

          hi,

             for setting background color there are two ways one by setting backgroundColor property in your application and second by setting the color of your swf movie in embed Tag in your html Wrapper and there you can also set widht and height of your application

          • 2. Re: Exporting a normal swf
            Gregory Lafrance Level 6

            You can set the background to white:

             

            <mx:Application backgroundColor="0xFFFFFF" backgroundGradientColors="[0xFFFFFF, 0xFFFFFF]"

            xmlns:mx="

            http://www.adobe.com/2006/mxml"/>

             

            How is your content contained? If you are using Canvas, maybe that is a problem. Can you post sample code?

            • 3. Re: Exporting a normal swf
              Shakalandro Level 1

              Yes, I did that. I don't want to change the color, I want the background to not exist. It is making the swf file's contents be too large.

               

              maybe this page is a better example, since you can see the source code.

               

              planetvance.com/laf/art.php

              • 4. Re: Exporting a normal swf
                Shakalandro Level 1

                Yeah, its not a very intense app, so I'll just post the whole thing.

                 

                package {
                   
                    import flash.display.*;
                    import flash.events.Event;
                    import flash.events.MouseEvent;
                    import flash.net.URLLoader;
                    import flash.net.URLRequest;
                    import flash.text.TextField;
                    import flash.text.TextFieldAutoSize;
                   
                    public class artGallery extends Sprite {
                       
                        private const WIDTH:int = 550;
                        private const HEIGHT:int = 400;
                        private const BORDER:int = 20;
                        private const BUTTONSIZE:int = 30;
                        private const OUTLINE:int = 4;
                        private var xmlLoader:URLLoader;
                        private var xmlData:XML;
                        private var pictures:Array;
                        private var comments:Array;
                        private var commentText:TextField;
                        private var pictureWindow:Sprite;
                        private var next:Sprite;
                        private var previous:Sprite;
                        private var box:Shape;
                        private var currentImageNum:Number;
                       
                        public function artGallery() {
                            xmlLoader = new URLLoader();
                            xmlData = null;
                            pictures = new Array();
                            comments = new Array();
                            currentImageNum = 0;
                            box = new Shape();
                            this.addChild(box);
                           
                            xmlLoader.addEventListener(Event.COMPLETE, loadXML);
                            xmlLoader.load(new URLRequest("pictures.xml"));
                            pictureWindow = new Sprite();
                            //Outline
                            this.graphics.beginFill(0x4682B4);
                            this.graphics.drawRoundRect(0, 0, WIDTH, HEIGHT, BORDER, BORDER);
                            //Actual window
                            this.graphics.beginFill(0xDEB887);
                            this.graphics.drawRoundRect(OUTLINE, OUTLINE, WIDTH - OUTLINE * 2, HEIGHT - OUTLINE * 2, BORDER, BORDER);
                           
                            next = new Sprite();
                            next.graphics.lineStyle(3, 0x4682B4);
                            next.graphics.beginFill(0xAA0000);
                            next.graphics.lineTo(0, BUTTONSIZE);
                            next.graphics.lineTo(BUTTONSIZE, BUTTONSIZE / 2);
                            next.graphics.lineTo(0, 0);
                            next.graphics.endFill();
                            next.y = HEIGHT - BUTTONSIZE - OUTLINE;
                            next.x = WIDTH / 2 + OUTLINE;
                            next.addEventListener(MouseEvent.MOUSE_DOWN, nextImage);
                           
                            previous = new Sprite();
                            previous.graphics.lineStyle(3, 0x4682B4);
                            previous.graphics.beginFill(0xAA0000);
                            previous.graphics.lineTo(0, BUTTONSIZE);
                            previous.graphics.lineTo(-BUTTONSIZE, BUTTONSIZE / 2);
                            previous.graphics.lineTo(0, 0);
                            previous.graphics.endFill();
                            previous.y = HEIGHT - BUTTONSIZE - OUTLINE;
                            previous.x = WIDTH / 2 - OUTLINE;
                            previous.addEventListener(MouseEvent.MOUSE_DOWN, previousImage);
                           
                            commentText = new TextField();
                                       
                            pictureWindow.addChild(new Sprite());
                            addChild(commentText);
                            addChild(pictureWindow);
                            addChild(next);
                            addChild(previous);
                            trace("window-width: " + pictureWindow.width + " comment-x: " + commentText.x + " comment-y: " + commentText.y);
                        }
                        private function loadXML(e:Event):void {
                            xmlData = new XML(e.target.data);
                            parseXML(xmlData);
                        }
                       
                        private function parseXML(xmlData:XML):void {
                            var data:XMLList = xmlData.children().children();
                            var counter:Number = 0;
                            for each (var thing:String in data) {
                                if (counter % 2 == 0) {
                                    pictures.push(thing);
                                } else {
                                    comments.push(thing);
                                }
                                counter++;
                            }
                            loadImage(pictures[currentImageNum]);
                        }   
                       
                        private function loadImage(imageURL:String):void {
                            var loader:Loader = new Loader();
                            loader.load(new URLRequest(imageURL));
                            loader.contentLoaderInfo.addEventListener(Event.INIT, resizeAndPlace);
                        }
                       
                        private function resizeAndPlace(e:Event):void {
                            var targetLoader:Loader = Loader(e.target.loader);
                           
                            pictureWindow.addChild(targetLoader.content);
                            if (pictureWindow.numChildren != 0) {
                                pictureWindow.removeChildAt(0);
                            }
                            pictureWindow.height = HEIGHT - BORDER - BUTTONSIZE - OUTLINE * 3;
                            pictureWindow.scaleX = pictureWindow.scaleY;
                            if (pictureWindow.width > WIDTH - BORDER) {
                                pictureWindow.width = WIDTH - BORDER;
                                pictureWindow.scaleY = pictureWindow.scaleX;
                            }
                            pictureWindow.x = (WIDTH - pictureWindow.width) / 2;
                            pictureWindow.y = BORDER / 2;
                           
                            this.removeChild(box);
                            box.graphics.clear()
                            box.graphics.lineStyle(3, 0x4682B4);
                            box.graphics.moveTo(pictureWindow.x - 1, pictureWindow.y - 1);
                            box.graphics.lineTo(pictureWindow.x - 1, pictureWindow.height + pictureWindow.y  + 1);
                            box.graphics.lineTo(pictureWindow.width + pictureWindow.x + 1, pictureWindow.height + pictureWindow.y  + 1);
                            box.graphics.lineTo(pictureWindow.width + pictureWindow.x + 1, pictureWindow.y - 1);
                            box.graphics.lineTo(pictureWindow.x - 1, pictureWindow.y - 1);
                            //pictureWindow.graphics.drawRoundRect(pictureWindow.x, pictureWindow.y, pictureWindow.width, pictureWindow.height, 5, 5);
                            this.addChild(box);
                            commentText.text = comments[currentImageNum];
                            commentText.autoSize = TextFieldAutoSize.CENTER;
                            commentText.x = (WIDTH - commentText.width) / 2;
                            commentText.y = HEIGHT - next.height - OUTLINE * 4;
                        }
                       
                        private function nextImage(e:MouseEvent):void {
                            currentImageNum++;
                            if (currentImageNum > pictures.length - 1) {
                                currentImageNum = 0;
                            }
                            loadImage(pictures[currentImageNum]);
                        }
                       
                        private function previousImage(e:MouseEvent):void {
                            currentImageNum--;
                            if (currentImageNum < 0) {
                                currentImageNum = pictures.length - 1;
                            }
                            loadImage(pictures[currentImageNum]);
                        }
                    }
                }

                • 5. Re: Exporting a normal swf
                  ATIF FAROOQ Level 3

                  set width and height to 100% in your html

                  • 6. Re: Exporting a normal swf
                    Shakalandro Level 1

                    that makes it disappear entirely

                    • 7. Re: Exporting a normal swf
                      ATIF FAROOQ Level 3

                      the movie you are loading in your swf is not the same size of your main swf which is 550 X 400 so both swf's sould have same size

                      • 8. Re: Exporting a normal swf
                        Shakalandro Level 1

                        I don't quite understand what you are saying. So you mean the file size of my swf is different from teh width and height I specified in the html. Perhaps I don't know how to set the size of my exported swf. I have constants for width and height...I just figured that the file's width and height would shrink to match the contents.

                        • 9. Re: Exporting a normal swf
                          ATIF FAROOQ Level 3

                                  you need to reduce your WIDTH and HEIGHT constants in order to make your button controls to come in your movie view.

                                  because your button controls x and y is set according to these constants but still they are not coming inside the movie completely . I hope this will help

                                  private const WIDTH:int = 550;  ///>>>make this to 530
                                  private const HEIGHT:int = 400; ///>>>make this to 390

                          • 10. Re: Exporting a normal swf
                            Shakalandro Level 1

                            No, that doesn't help. If you look at the page, you'll see a rounded blue border within the flash. That is a roundRect that I drew and it exists down below where you can see, regardless of my height and width constants. The gray to the right of it was not drawn by me...flex is adding it.

                            • 11. Re: Exporting a normal swf
                              Shakalandro Level 1

                              Okay I think I figured out half of it. I had to set the the stage's scaleMode to be NO_SCALE. and manually set the stage's width and height using the stageWidth and stageHeight properties. However, I still cannot get the movie to orient itself squarely in the upperleft corner as it should.

                              • 12. Re: Exporting a normal swf
                                ATIF FAROOQ Level 3

                                are you compiling with mxmlc compiler from the command line ?

                                 

                                add this argument to set your own background color of your movie in mxmlc compiler arguments.

                                 

                                -default-background-color=0xffffff

                                • 13. Re: Exporting a normal swf
                                  Shakalandro Level 1

                                  No, I got it, the methods I mentioned before in combination with stage.align = StageAlign.TOP_LEFT does it. Thanks.