On Fri, Oct 17, 2014 at 1:31 PM, OmPrakash Muppirala <bigosma...@gmail.com> wrote:
> On Thu, Oct 16, 2014 at 10:37 PM, Alex Harui <aha...@adobe.com> wrote: > >> >> >> On 10/16/14, 1:04 PM, "OmPrakash Muppirala" <bigosma...@gmail.com> wrote: >> >> >On Thu, Oct 16, 2014 at 12:49 PM, Alex Harui <aha...@adobe.com> wrote: >> > >> >> >> >> >> >> On 10/16/14, 12:30 PM, "OmPrakash Muppirala" <bigosma...@gmail.com> >> >>wrote: >> >> >> >> > >> >> >Agreed, there does not have to be just one approach. Most common use >> >>of >> >> >9-slice skinning would be in buttons, scroll bars, title bars, icons, >> >>etc. >> >> >It should be possible to add this support in a separate namespace. >> >> Just curious: If you have vectors, why do you need 9-slice? Do you >> >> really want portions of the vectors to scale differently? >> >> >> >> >> >Yes, that is the usage. For example, a rounded button with with a corner >> >radius of 10 can be scaled from 100x30 to 150x30 based on the text. But, >> >if we want to maintain the same corner radius of 10, we will need regions >> >in the skin to indicate which portions can scale and which should not. >> >This is the kind of scenario where we will want to use 9-slice scaling. >> > >> >This way, we can build skin for a 100x30 button, specify the 9-slice >> >scaling rules and let the framework take care of scaling it to various >> >sizes. >> Interesting. It never occurred to me that FXG didn’t have percentages or >> other constraints and that’s why folks used 9-slice when resizing. At >> least, the spec seems to only allow percentages in a few places. >> MXML-based skins don’t need 9-slice when resized because you can specify >> percentages or right/left/top/bottom and the vectors like a rectangle with >> rounded corners gets re-drawn and keeps its rounded corners. I think >> 9-slice can cause subtle artifacts in gradients, so re-drawing the vectors >> is better. >> >> A quick look says that SVG does support percentages. Not sure if it also >> supports LTRB, but that would imply to me that folks should be able to >> specify SVG art that does resize cleanly without 9-slice. >> > > Specifying percentages or LTRB does not the solve the problem of > maintaining the stroke thickness while scaling. When buttons scale, we > want the stroke widths to remain same. That is where 9-slice helps. If > not, you will have to specify a stroke width for every scale. > > >> >> That said, I don’t know if any tools like Illustrator allow you to specify >> % or LTRB in SVG output. But maybe we should give up on FXG and focus on >> runtime rendering of SVG in Flash. Or extend FXG to support percentages >> in more places (although then you can’t compile it into a SWF >> DefineShape/DefineSprite). Or just use MXMLG-like syntax like I think you >> just got working. >> >> One other question: having resizable button skins is great for prototyping >> an application, but how many folks go to production with resizable >> buttons? One designer I worked with long ago wanted no more than three >> sizes of buttons in a UI. The OK and Cancel buttons would be the same >> size, no shrinking or growing to fit the text. In current Flex, the SDK >> ships with resizable MXML skins, but folks can replace some pieces with >> not-so-resizable FXG graphics. >> > > Take scroll thumb for an example. It is a button that one can click and > move. At the same time, its height (or width, depending on scrollbar > direction) should adjust according to the amount of content that is being > scrolled. It's skin must have a 9-slice grid defined so that it looks good > at any size. > Also relevant is the use case of supporting multiple screen densities. We want to use the same vector assets for a button displayed in each supported dpi. For example, you create an asset for 160 dpi and specify its scale grid. Then we can scale the asset up for 480 dpi and still show the same stroke width, rounded corners, etc. The alternative would be to create multiple assets for multiple dpis. Thanks, Om > > Thanks, > Om > > >> >> >> > >> > >> >I was thinking of re-purposing the Android >> >4.x skins as well. It would be fun to see how an Android-y web app looks >> >like. >> And the IOS skins as well. >> >> -Alex >> >> >
