2 Replies Latest reply on Dec 20, 2007 2:47 PM by jjsoini

    Scale9Grid and content alignment

      I've just started using fb3 and while converting my fb2 project, I've come to notice that the scale9grid of the container's skin now by default affects how the content is aligned. Although otherwise changes to margin/padding attributes feel welcome, this in particular makes me feel like going back to the dark ages of html tables, where content can't overlap with the surrounding skin parts and has to fit inside the stretching part of the skin.

      Okay, pretty quickly I discovered that setting ClipContent to false allows placing the content in relation to the container's (and skin's) top-left corner but still, for instance, setting content's width or height to 100% sets it's size to match the scale9grid's inner rectangle instead of container's size.

      It's still possible to hack through this by setting negative padding values to counter the effect of the scale9 margins but it's really a drag. Container's width and height still match the size of the skin, not the stretching square of the scale9, so why can't the content alignment and paddings default to this?
        • 1. Re: Scale9Grid and content alignment
          jjsoini Level 1
          also vertical and horizontal alignment don't work properly.. all in all, having scalegrid affect how content is placed is simply a step backward and makes it so much harder to customize the look of the components and place content where it's supposed to go.

          Obviously, if you're just dragging factory-built components into the stage, it's easy when you don't have to worry about margins and layout, but come on... let's not cut the wings from people who wan't some control over the look of their apps. Add a padding box in the Standard View for components and use default values for padding instead.
          • 2. Re: Scale9Grid and content alignment
            jjsoini Level 1
            ... still, setting clipContent = false is hardly a solution if you want scrollable content... unless you add another transparent container to clip the content and control scroll.

            Here's a set of skins I've made for flex2..

            Getting them right wasn't too hard although some components still lacked ability to tweak paddings/borderThickness.. Now, I wonder how far I can get with flex3 when it's trying to stretch the skin each time around the content? If you look at the panel skins, you'll notice that the skin has some graphic style behind the panel content. The stretching gridsquare is below and to the right of this, so the panel stretches alright, but it's obvious that I wouldn't want the content to follow the scalegrid in any way. Only thing the content should obey are the paddings ( 'borderThicknesses' in flex2).