[FlexJS] OneFlexibleChildVerticalLayout

classic Classic list List threaded Threaded
16 messages Options
Reply | Threaded
Open this post in threaded view
|

[FlexJS] OneFlexibleChildVerticalLayout

yishayw
Perter (or anyone else),

Any idea why this [1] app isn't showing the non-flexible green container (cont2)?

[1] https://paste.apache.org/cRdQ
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

piotrz
Hi Yishay,

I think cause height of "cont2" is 0, when I add some height it appears.

I checked it with Peter's branch "feature/chart-work"

Piotr
Apache Flex PMC
piotrzarzycki21@gmail.com
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
Yes, Harbs and I inspected the HTML and container sizes are no longer sized to content, which makes this test app fail. I'm wondering what Peter has in mind to help us make sizing to content work.
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

piotrz
This post was updated on .
Yishay,

Are you expecting that "cont2" will be expanded by his child container which has height="20" ?

Piotr
Apache Flex PMC
piotrzarzycki21@gmail.com
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Harbs
Yes. That’s what used to happen in the old layouts.

> On Apr 2, 2017, at 6:23 AM, piotrz <[hidden email]> wrote:
>
> Yishay,
>
> You are expecting that "cont2" will be expanded by his child container which
> has height="20" ?
>
> Piotr
>
>
>
> -----
> Apache Flex PMC
> [hidden email]
> --
> View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-OneFlexibleChildVerticalLayout-tp60953p60956.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.

Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

piotrz
Hi Harbs,

Adding to "cont2" VerticalFlexLayout [1] bead will work in that case, but not sure whether it is acceptable for you.

[1] https://paste.apache.org/aBPD

Piotr
Apache Flex PMC
piotrzarzycki21@gmail.com
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
That works for the test case, but in our real case we have a toolbar container which lays its children out horizontally and sizes its height according to its child buttons. Changing the layout to VerticalFlexLayout doesn't seem right...
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Peter Ent
Hi - just saw this (Sunday morning here).

When you use the "flexible" layouts, you don't need percent sizing. If you
do put explicit or percent sizing in, the layout code (SWF side) probably
won't do the right thing with it and I'd have to see what HTML does with
it.

I'm still understanding the HTML sizing and layout process. The
feature/chart-work has better - but by no means perfect - layouts. I've
been looking at several examples, like the Tour, and finding small things
to change in the code to make the layouts better.

On the JS-side, the VerticalFlexLayout, HorizontalFlexLayout,
OneFlexiableChild*, etc layouts ALL use CSS Flexbox in one way or another.
If you don't care about making your app work on the SWF side, consider
always using Groups and putting your sizing and styling into CSS, just as
you would if you were writing the code in HTML/JS rather than MXML/AS.
Container, layouts, etc. are all really for the SWF side; their JS code
bits just go and change various style settings so you don't have to it in
CSS.

If you want a column with one child taking up the majority of the space,
then make sure the container will have an

We may have more complex layouts that would have to be written in JS, so
the layout "engine" is designed to do that.

One thing that did change is that layouts no longer resize their container
when you have size-to-fit. That is, if you do:

<js:VContainer>
   <js:TextButton text="Button 1" etc />
   <js:TextButton text="Button 2" etc />
</js:VContainer>

The VerticalLayout will not resize the Container to fit the content. The
Container (actually, GroupView), will do that after it runs the layout. So
if you are seeing that a container is NOT sizing to fit its content -
that's a bug. I have however, found cases in HTML where a DIV will not
size to fit its content. Still not 100% sure on those cases, yet.

Thanks for trying this out and a big Thank You for your patience.

Peter

On 4/2/17, 7:54 AM, "yishayw" <[hidden email]> wrote:

>That works for the test case, but in our real case we have a toolbar
>container which lays its children out horizontally and sizes its height
>according to its child buttons. Changing the layout to VerticalFlexLayout
>doesn't seem right...
>
>
>
>--
>View this message in context:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fle
>x-development.2333347.n4.nabble.com%2FFlexJS-OneFlexibleChildVerticalLayou
>t-tp60953p60959.html&data=02%7C01%7C%7C42f1df302dc54f552bdb08d479c02dab%7C
>fa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636267313684441085&sdata=ns9ofe
>gHWKWSG%2BirEEPwMEhiP0KI6wejHg7drvV7j60%3D&reserved=0
>Sent from the Apache Flex Development mailing list archive at Nabble.com.

Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
Peter Ent wrote
<js:VContainer>
   <js:TextButton text="Button 1" etc />
   <js:TextButton text="Button 2" etc />
</js:VContainer>

The VerticalLayout will not resize the Container to fit the content. The
Container (actually, GroupView), will do that after it runs the layout. So
if you are seeing that a container is NOT sizing to fit its content -
that's a bug.
That seems to be the case here.
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Harbs
It looks like the problem is that layoutViewAfterContentLayout(); is now wrapped in a COMPILE::SWF block.

> On Apr 2, 2017, at 8:56 AM, yishayw <[hidden email]> wrote:
>
> Peter Ent wrote
>> <js:VContainer>
>>
>> <js:TextButton text="Button 1" etc />
>>
>> <js:TextButton text="Button 2" etc />
>> </js:VContainer>
>> The VerticalLayout will not resize the Container to fit the content. The
>> Container (actually, GroupView), will do that after it runs the layout. So
>> if you are seeing that a container is NOT sizing to fit its content -
>> that's a bug.
>
> That seems to be the case here.
>
>
>
>
> --
> View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-OneFlexibleChildVerticalLayout-tp60953p60961.html
> Sent from the Apache Flex Development mailing list archive at Nabble.com.

Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Peter Ent
Yes - In the feature/chart-work branch it is not. That was an oversight on
my part. As soon as I get MDL framework back up and running I think I can
safely merge my feature branch into develop, but I will give you all time
to do a final check.

‹peter

On 4/2/17, 9:33 AM, "Harbs" <[hidden email]> wrote:

>It looks like the problem is that layoutViewAfterContentLayout(); is now
>wrapped in a COMPILE::SWF block.
>
>> On Apr 2, 2017, at 8:56 AM, yishayw <[hidden email]> wrote:
>>
>> Peter Ent wrote
>>> <js:VContainer>
>>>
>>> <js:TextButton text="Button 1" etc />
>>>
>>> <js:TextButton text="Button 2" etc />
>>> </js:VContainer>
>>> The VerticalLayout will not resize the Container to fit the content.
>>>The
>>> Container (actually, GroupView), will do that after it runs the
>>>layout. So
>>> if you are seeing that a container is NOT sizing to fit its content -
>>> that's a bug.
>>
>> That seems to be the case here.
>>
>>
>>
>>
>> --
>> View this message in context:
>>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fl
>>ex-development.2333347.n4.nabble.com%2FFlexJS-OneFlexibleChildVerticalLay
>>out-tp60953p60961.html&data=02%7C01%7C%7Cd3f7731e7b8b4bbf312e08d479ccd719
>>%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636267368090489377&sdata=a4
>>giL0RsenJ%2BjkXMQV9K0rd1cLrafUMkMzkZk%2FzoKS8%3D&reserved=0
>> Sent from the Apache Flex Development mailing list archive at
>>Nabble.com.
>

Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
I tried using the feature/chart branch but since our project uses mdl, I'm getting a runtime error. So it's difficult to test.
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
In reply to this post by Peter Ent
I just tested the test case upthread on feature/chart-work and I'm getting the same problem. 'cont2' does not get sized and is not shown.
Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Peter Ent
Something is not right with the layouts. I'm looking into it today.
‹peter

On 4/3/17, 2:43 AM, "yishayw" <[hidden email]> wrote:

>I just tested the test case upthread on feature/chart-work and I'm getting
>the same problem. 'cont2' does not get sized and is not shown.
>
>
>
>--
>View this message in context:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fle
>x-development.2333347.n4.nabble.com%2FFlexJS-OneFlexibleChildVerticalLayou
>t-tp60953p60975.html&data=02%7C01%7C%7C96b52cdb2e66494ea8c308d47a5deed0%7C
>fa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636267991233417705&sdata=6Ug8jd
>VRghPx47WMNiewf7e1qfhIIf1wjwqJmmP2eAg%3D&reserved=0
>Sent from the Apache Flex Development mailing list archive at Nabble.com.

Reply | Threaded
Open this post in threaded view
|

Re: [FlexJS] OneFlexibleChildVerticalLayout

Peter Ent
Hi,

I believe I have fixed part of the problem. Please refresh your copy of
feature/chart-work. There was a problem with the
OneFlexibleChildVerticalLayout.

However, there is also another problem, but that might take longer to
resolve. In the meantime, leave your example exactly as you have it.

Ideally, the flexible child should not have a height specified since that
is the child whose height you want to be determined by the layout; you
don't know how high to make it. But for some reason (yet to be
determined), removing the height attribute causes it to have a height of
zero.

When I now run your sample using the correction I just pushed, I see a
green bar all the way across the top of the browser and blue fills the
rest of the browser space.

Regards,
Peter

On 4/3/17, 8:50 AM, "Peter Ent" <[hidden email]> wrote:

>Something is not right with the layouts. I'm looking into it today.
>‹peter
>
>On 4/3/17, 2:43 AM, "yishayw" <[hidden email]> wrote:
>
>>I just tested the test case upthread on feature/chart-work and I'm
>>getting
>>the same problem. 'cont2' does not get sized and is not shown.
>>
>>
>>
>>--
>>View this message in context:
>>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fl
>>e
>>x-development.2333347.n4.nabble.com%2FFlexJS-OneFlexibleChildVerticalLayo
>>u
>>t-tp60953p60975.html&data=02%7C01%7C%7C96b52cdb2e66494ea8c308d47a5deed0%7
>>C
>>fa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636267991233417705&sdata=6Ug8j
>>d
>>VRghPx47WMNiewf7e1qfhIIf1wjwqJmmP2eAg%3D&reserved=0
>>Sent from the Apache Flex Development mailing list archive at Nabble.com.
>

Reply | Threaded
Open this post in threaded view
|

RE: [FlexJS] OneFlexibleChildVerticalLayout

yishayw
Hi Peter,

Yes, we noticed the problem where 100% is needed but takes up all the space. I’m glad you’re working on it. In the meantime we were able to hack something to get around this problem but I’m looking forward to implementing a cleaner solution so do let us know when that’s fixed. Would have been nice if we had a proper unit test for layouts…

Thanks,
Yishay

From: Peter Ent<mailto:[hidden email]>
Sent: Monday, April 3, 2017 4:46 PM
To: [hidden email]<mailto:[hidden email]>
Subject: Re: [FlexJS] OneFlexibleChildVerticalLayout

Hi,

I believe I have fixed part of the problem. Please refresh your copy of
feature/chart-work. There was a problem with the
OneFlexibleChildVerticalLayout.

However, there is also another problem, but that might take longer to
resolve. In the meantime, leave your example exactly as you have it.

Ideally, the flexible child should not have a height specified since that
is the child whose height you want to be determined by the layout; you
don't know how high to make it. But for some reason (yet to be
determined), removing the height attribute causes it to have a height of
zero.

When I now run your sample using the correction I just pushed, I see a
green bar all the way across the top of the browser and blue fills the
rest of the browser space.

Regards,
Peter

On 4/3/17, 8:50 AM, "Peter Ent" <[hidden email]> wrote:

>Something is not right with the layouts. I'm looking into it today.
>‹peter
>
>On 4/3/17, 2:43 AM, "yishayw" <[hidden email]> wrote:
>
>>I just tested the test case upthread on feature/chart-work and I'm
>>getting
>>the same problem. 'cont2' does not get sized and is not shown.
>>
>>
>>
>>--
>>View this message in context:
>>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fl
>>e
>>x-development.2333347.n4.nabble.com%2FFlexJS-OneFlexibleChildVerticalLayo
>>u
>>t-tp60953p60975.html&data=02%7C01%7C%7C96b52cdb2e66494ea8c308d47a5deed0%7
>>C
>>fa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636267991233417705&sdata=6Ug8j
>>d
>>VRghPx47WMNiewf7e1qfhIIf1wjwqJmmP2eAg%3D&reserved=0
>>Sent from the Apache Flex Development mailing list archive at Nabble.com.
>