flex-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From OmPrakash Muppirala <bigosma...@gmail.com>
Subject Re: [FLEXJS] Layout
Date Mon, 10 Aug 2015 07:47:13 GMT
On Sat, Aug 8, 2015 at 10:04 PM, Alex Harui <aharui@adobe.com> wrote:

> On 8/8/15, 2:47 PM, "omuppi1@gmail.com on behalf of OmPrakash Muppirala"
> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >On Fri, Aug 7, 2015 at 9:50 PM, Alex Harui <aharui@adobe.com> wrote:
> >
> >> One of my goals for FlexJS is to leverage as much code in the browser as
> >> possible.  That’s why there are button components that thinly wrap the
> >> HTML button element.  You can pay-as-you-go and select heavier buttons
> >> that allow more complex skinning and/or styling.
> >>
> >> I thought we’d be able to leverage the browser’s layout code for
> >>vertical
> >> and horizontal layout.  The current version sets the children to
> >> display:block or display:inline-block.  That’s much less code than
> >>running
> >> a loop on the children, figuring out margins, left/right constraints,
> >>etc,
> >> and therefore less code to write, debug and maintain.
> >>
> >
> >I think it would be better if we start using the flexbox model [
> >http://caniuse.com/#feat=flexbox]
> >
> >Horizontal layout would be:
> >
> >display: flex;
> >flex-direction: row
> >justify-content: space-between;
> Certainly, we can add a FlexBoxLayout.  My main complaint is that
> HorizontalLayout via inline-block doesn’t work like I and hundreds of
> others on SO think it should so we all end up asking the same question.
I understand the issue with inline-block for HorizontalLayout, but why do
we have to use it in FlexJS?  CSS's FlexBox has already solved Horizontal
and Vertical layouts for most of these use cases.  IMO, there is no need
for a FlexBoxLayout, just a HorizontalLayout, which is implemented in CSS
using the FlexBox model.

> >
> >
> >>
> >> But these days, I’m starting to wonder if one of the benefits of FlexJS
> >> will be in the availability of layouts that pretty much use
> >> position:absolute to control everything.  There are lots of funky rules
> >> and workarounds for how browsers deal with display:inline-block, for
> >> example.
> >
> >
> >> Anyway, I’m wondering if there is anything, besides performance, we
> >>might
> >> give up by giving up on display:inline-block and writing our own
> >> horizontal layout.
> >>
> >
> >I am worried we will end up with too many edge cases for responsive layout
> >requirements.
> Yeah, me too, although there is a chance we’ll do it “better”.  The forums
> are full of folks running into unexpected behavior.  Maybe we will win the
> day by having our layouts be responsive but more predictable.

+1 for this.  For the record, I love how Flex removes layout out of CSS and
puts it in code/MXML.  In FlexJS, we could do the same, except that behind
the scenes, we use the non-intuitive but appropriate CSS layouts.

> Another thing I find unexpected about HTML layouts is how height is
> managed.  In the FlexJSStore, lots of containers are “sized to content” in
> that either width or height or both aren’t specified.  In such a
> situation, HTML layouts don’t work that well.  I may end up setting the
> missing width or height style as part of layout.

Does "width: auto; height:auto" not work for as expected?


  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message