9 Replies Latest reply on Feb 12, 2013 9:49 PM by ashdflkjh

    Resizeable Presentation Setup for Video and 3D

    ashdflkjh

      I want to be able to have a slide show that integrates still images, text, video and 3D. I use InDesign but it is pretty constraining. PowePoint and the like have similar constraints.

       

      I can assemble a simple presentation in Flash with video integrated, etc.  but it is usually impossible to predict the resolution of the projector I will be using. Hence my question:

       

      How can I build a Flash presentation template that I shall be able to conveniently reuse and that will be resizeable?

       

      Option 1. Is it possible to make Flash to scale the stage and all content proportionately, like PowerPoint or Acrobat can do (with black areas if the screen ratios are different)?

       

      Option 2. What is the reasonable path for making resizeable/edjustable content? I looked at this (starling + feathers)

       

      http://www.adobe.com/devnet/flash/articles/designing-multidevice-multiresolution.edu.html

       

      I like the use of Stage 3D but these frameworks do not seem like a good match. It is slow to modify the content (I need to be making new presentation reguraly) and I shall not be using most of the functionality. It could work if I build several types of pages and reuse them maybe but I suspect a simpler way should exist.

       

      Thank you for pointers and advice,

       

      Maya

        • 1. Re: Resizeable Presentation Setup for Video and 3D
          moccamaximum Level 5

          This function will get you far:

           

          function goScaledFullScreen()

          {

              var screenRectangle:Rectangle = new Rectangle(0,0,stage.stageWidth,stage.stageHeight);

              stage.fullScreenSourceRect = screenRectangle;

              stage.displayState = StageDisplayState.FULL_SCREEN;

              stage.quality = StageQuality.BEST;

          }

           

          Independent of your actual monitor resoulution it will scale up any content you might load via loader to the full screen resolution.

          It has its limits though: On a Mobile device it won`t reorganize the content if you rotate the device from Landscape to Portrait. Also if you have content that is off-stage you might have to employ masks if the Monitors aspect ratio differs from your presentation one`s.

           

          You can use the Capabilities class to get the actual ResolutionX/ResolutionY of the device that runs your presentation.

           

          You might want to somehow inform your presentation if the resolution gets changed via the Resize Event

           

          If size is not an issue you might prepare your presentation in the best Quality possible (for example HD) because downsizing works in general much better (qualitywise) than upsizing.

          • 2. Re: Resizeable Presentation Setup for Video and 3D
            ashdflkjh Level 1

            Thanks a lot for the suggestion. Will give it a go.

             

            I was using Capabilities and Resize events already to force my presentation to go full screen. At this stage, I am doing everything in full HD and can live with black bars on 1900x1200 or smaller, squarer screens. But in my attempts my images would not scale down while my videos would go smaller than the full screen.

             

            Another issue was that images with text in them would look quite poor when scled down. Not sure if one can set better filtering somewhere...

             

            Mobile devices are not an issue at this stage and I have a very fast laptop, so performance has not been a problem either...

             

            Shall report back.

             

            Thanks again,

             

            Maya

            • 3. Re: Resizeable Presentation Setup for Video and 3D
              moccamaximum Level 5

              If you load images via a loader you should have function that scales the externally loaded pictures dependent on your stageSize.

               

              this could be the function that listens to your Event.Complete:

               

              function imageLoaded(e:Event):void {

                  var bit:Bitmap = e.target.content;

                  if(bit != null)

                  bit.smoothing = true;

                  centerMaximized(imageLoader);

              }

               

              and center maximized could look like this:

               

              function centerMaximized(dO:DisplayObject):void {

                  var scalefactorW:Number=(stage.stageWidth-framesize)/dO.width;

                  var scalefactorH:Number=(stage.stageHeight-framesize)/dO.height;

                  if (scalefactorW<scalefactorH) {

                      dO.scaleX=dO.scaleY=scalefactorW;

                  } else {

                      dO.scaleX=dO.scaleY=scalefactorH;

                  }

                  dO.x = (stage.stageWidth-dO.width)*.5;

                  dO.y = (stage.stageHeight-dO.height)*.5;

              }

              1 person found this helpful
              • 4. Re: Resizeable Presentation Setup for Video and 3D
                ashdflkjh Level 1

                Update. Yes, it works! Thanks a lot. As I mentioned, the quality of the downscaled images is pretty poor but maybe it is because my laptop screen is not inteded to run those resolutions. Will try with some projectors tomorrow.

                • 5. Re: Resizeable Presentation Setup for Video and 3D
                  ashdflkjh Level 1

                  Oh, just missed your message No. 3. I see. No, I am not usign a loader. Shall look it up. I am not using Flash at all really, so, clueless as to the appropriate workflows. I had the images on the timeline + plus a video on a separate layer.

                   

                  How would I use a loader if I wanted to have a series of slides intermixing text, videos, images and 3D?

                  • 6. Re: Resizeable Presentation Setup for Video and 3D
                    ashdflkjh Level 1

                    Can I just add something like this to my images on the timeline to get the smooth resizing that is equivalent to your suggestion with the loader?

                     

                    this.smoothing = true;

                     

                    var mw:Number = stage.stageWidth / this.width;

                    var mh:Number = stage.stageHeight / this.height;

                     

                    var ratio:Number = (mw < mh) ? mw:mh;

                     

                    this.width *=  ratio;

                    this.height *=  ratio;

                     

                    this.x = 0.5*(stage.stageWidth-this.width);

                    this.y = 0.5*(stage.stageHeight-this.height);

                    • 7. Re: Resizeable Presentation Setup for Video and 3D
                      moccamaximum Level 5

                      You can directly enable bitmap.smooothing for all your pictures in the Library (right-click>Properties)

                      1 person found this helpful