0 Replies Latest reply on Dec 17, 2010 1:17 AM by Mykola3296

    Layout measurement inconsistent in composition (may be related to FM-1166 and FM-932)

    Mykola3296

      Hello!

       

      I've come across a layout mesurement incosistency leading to unpredictable scaling applied to media elements in relative composition / layout API.

      The problem may be a related to FM-1166 and FM-932.

       

      What was required:

      1) Player with 3 "areas": main video, adv. overlay above, control bar

      2) Player should scale contents when risizing stage (fullscreen etc).

      3) Player should correctly scale content that is bigger or smaller than current display area.

       

      What was done:

      1) Created main video content with poster image and video and put to serial (for simplicity). Element was layed out to take 100% of width and height leaving 80 pixels below for "control bar".

      2) A "control bar" was created as a MediaElement scaling to 100% of available width and taking 80 pixels at the bottom. The only trait the element has is a DisplayObject (a simple sprite) - and IT IS A THE SOURCE OF A PROBLEM!

      3) An overlayed advert. movie that is placed above the main video. Created to illustrate the problem and make it more obvious.

      4) All 3 elements were put to ParallelElement. ABSOLUTE layout was applied to that parallel. The layout values are being changed during stage resize.

      5) Resulting parallel was put to MediaPlayer/MediaContainer

       

      What we see after playback starts:

      1) A poster frame, overlayed adverticement, control bar appear and look ok.

      1_element_playing.png

      2) When switching to main video - layout crashes. Mind that the video size (in pixels) is greater than player area.

      2_element_playing.png

      The source of a problem

      I've figured out that the problem appears if you try to insert a MediaElement that ALREADY HAS THE DISPLAY TRAIT to a composition that HAS NOT BEEN LOADED TO MEDIACONTAINER yet.

      The problem goes to measuring the parallel size with no "upper" layout renderer (MediaContainer) set or something like this.

      The use of, say, image element insted of "control bar" - the element with DisplayTrait appearing after being put to media container - works perfect.

      The other experiment was putting a control bar to composition AFTER putting a composition to MediaContainer - also works.

      Here is the scheme:

      1) Create parallel

      2) Create "control bar"

      3) Put parallel to MediaContainer

      4) Put "control bar" to parallel

      The result is illustrated with the following screenshot:

      2_element_playing_if_inserted_after_being_put_to_container.png

      I've monkey pattched the CompositeDisplayObjectTrait.as to see the measurement results while playing the composition with

       

                /**
                 * @private
                 */          
                override public function get mediaWidth():Number
                {
                     if (this is ParallelDisplayObjectTrait) trace ("WIDTH: " + _childrenContainer.measuredWidth);
                     return _childrenContainer.measuredWidth;
                }
                
                /**
                 * @private
                 */          
                override public function get mediaHeight():Number
                {
                     if (this is ParallelDisplayObjectTrait) trace ("HEIGHT: " + _childrenContainer.measuredHeight);
                     return _childrenContainer.measuredHeight;
                }
      
       
      

       

      Here is the measurements for faulty and correct layout dims while playing:

       

       

      Good:  

       

       

      WIDTH: NaN

      HEIGHT: NaN

      HEIGHT: NaN

      WIDTH: NaN

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

      WIDTH: 480

      HEIGHT: 360

       

       

      Faulty:

       

      WIDTH: NaN

      HEIGHT: NaN

      HEIGHT: NaN

      WIDTH: NaN

      WIDTH: 100

      HEIGHT: 70

      WIDTH: 100

      HEIGHT: 70

      WIDTH: 640

      HEIGHT: 352

      WIDTH: 640

      HEIGHT: 352

      WIDTH: 640

      HEIGHT: 360

      WIDTH: 640

      HEIGHT: 360

      WIDTH: 640

      HEIGHT: 352

      WIDTH: 640

      HEIGHT: 352

       

       

       

       

      Unfortunately, I did not manage to get to the way to fix a problem - got lost in layout API :O)

       

      Here is the link to the sample project I was using along with screenshots:

      http://cid-a715721156054732.office.live.com/embedicon.aspx/.Public/OSMFLayout

       

      I hope I was helpfull for you to manage the problem - it is very annoying and the results of laying out children in relative layout are often unpredictable.

       

      Thank you!

      Best regards and Merry Christmas!

      Nikolai

       

      Message was edited by: Mykola3296