3 Replies Latest reply on Nov 12, 2010 4:20 PM by Peter Flynn (Adobe)

    Panini->Burrito widht/height

    Azagtog

      Hello, was working with panini project imported to burrito, and figured out stange issue. For example, let's add some bitmap image to panini, set it width, height, save project, and import it ot builder. And what? No width and height here. Thats sad. Same for buttons, etc.

      Same for stage size, when imported to burrito - width and height are being set to 100%, but not to fixed size.

      Maybe there is some way to import with saving width and height, help?

       

      Also, BitmapImage can be filled using "letterbox", but there is no option for this in catalyst.

        • 1. Re: Panini->Burrito widht/height
          Peter Flynn (Adobe) Adobe Employee

          Hi Azagtog,

           

          I'm not sure I entirely understand the problem.  It might be helpful if you could post some code snippets showing what you're seeing vs. what you expected.

           

          But in the meantime I'll take a stab at answering some of your questions...

           

          By default, new projects created in Panini are resizable.  This means that the application's size is set to 100% (of the browser/window size).  If you want a fixed size project instead, like in Catalyst CS5, simply uncheck the "Resizable" checkbox in the New Project dialog (or later, in Modify > Artboard Settings).

           

          I don't believe BitmapImage has a "letterbox" fillMode option.  Could you be thinking of videos instead, where a letterbox scaleMode is available?

           

          - Peter

          • 2. Re: Panini->Burrito widht/height
            Azagtog Level 1

            Examples.

            I create new Catalyst project, with resizable unchecked. Let's say width and height are 300x300.

            Then I import .png image, size 160x160. I select image, and in its Properties-Common I set size 160x160(its set automaticly, but just to check I set manualy).

            Let's switch to code mode now.

             

            <s:BitmapImage x="77" y="77" smooth="true" source="@Embed('/assets/images/image.png')"/>
            

             


            No width and height here. Why?

             

            Moving on. Let's import this project to Flash Builder. Open Main.mxml Let's say I want to display user's photo in this image, but it should be no bigger than 160x160. So I select this bitmapimage in builder, and set it size, again.

             

            <s:BitmapImage x="77" y="77" width="160" height="160" smooth="true"
                                   source="@Embed('/assets/images/image.png')"/>
            

             

            I also want this image to automaticly scale user photo, but saving aspect ratio. So fillMode="scale" doesn't work for me, because it doesn't save aspect ratio.

            Obviously I need scaleMode letterbox.

             

            <s:BitmapImage x="77" y="77" width="160" height="160" smooth="true"
                                   source="@Embed('/assets/images/image.png')" scaleMode="letterbox"/>
            

             

            And guess what? I get warning:

            The property spark.primitives.BitmapImage.scaleMode is not allowed. Right-click for more information.

            That's bad. So what I do to get rid of this warnings - I write some code.

             

            <s:BitmapImage id="img" x="77" y="77" width="160" height="160" smooth="true"
                                   source="@Embed('/assets/images/image.png')" complete="img.scaleMode='letterbox';"/>
            

             

            And it works perfectly fine. Why scaleMode is not allowed?

            • 3. Re: Panini->Burrito widht/height
              Peter Flynn (Adobe) Adobe Employee

              Good catch!  I had forgotten BitmapImage has a scaleMode setting in addition to fillMode.  Although that property is currently not considered Catalyst-compatible, we will look into adding support for it before "Panini" ships.

               

              In general, plenty of things that are valid in Flex are not yet supported in Flash Catalyst.  There are various reasons for this -- some constructs aren't conducive to WYSIWYG editing, and some just take time to support.  Although Panini won't permit everything you could ever hand-code, we are committed to supprting more and more of the Flex APIs in our future releases.

               

              Regarding image width/height...  By default, images in Catalyst are just displayed at the asset's "natural" size (100%), so we don't bother cluttering the code with unneeded width/height attributes.  If you resize the image, it will have width/height explicitly set from then on.

               

              Hope that helps clarify things,

               

              - Peter

              1 person found this helpful