You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by Harbs <ha...@gmail.com> on 2016/07/26 16:37:17 UTC

FlexJS min/max width/height

Any objections to me adding min and max widths and heights to UIBase?

Is there a bead that’s more appropriate?

Re: FlexJS min/max width/height

Posted by Harbs <ha...@gmail.com>.
Canvas does not have “elements". You can apply CSS to a canvas element, but that will not help for anything drawn on the canvas.

If we have “Rect”, “Circle” “Path”, etc. for Canvas, these will have to be abstractions of the canvas drawing APIs. This is totally doable (as EaselJS did and I believe Lizhi did as well), but any calculations such as minWidth would need to be done manually. We can’t rely on CSS for that.

On Jul 26, 2016, at 11:04 PM, Alex Harui <ah...@adobe.com> wrote:

> 
> 
> On 7/26/16, 12:51 PM, "Harbs" <ha...@gmail.com> wrote:
> 
>> No Canvas doe not have this built in.
> 
> I guess I'm having trouble understanding you today.  You said using CSS
> wouldn't work for Canvas elements.  What does that mean?
> 
> -Alex
> 


Re: FlexJS min/max width/height

Posted by Alex Harui <ah...@adobe.com>.

On 7/26/16, 12:51 PM, "Harbs" <ha...@gmail.com> wrote:

>No Canvas doe not have this built in.

I guess I'm having trouble understanding you today.  You said using CSS
wouldn't work for Canvas elements.  What does that mean?

-Alex


Re: FlexJS min/max width/height

Posted by Harbs <ha...@gmail.com>.
No Canvas doe not have this built in.

We’ll cross that bridge when we get to it. ;-)

On Jul 26, 2016, at 10:43 PM, Alex Harui <ah...@adobe.com> wrote:

> 
> 
> On 7/26/16, 11:58 AM, "Harbs" <ha...@gmail.com> wrote:
> 
>> OK. I forgot that there was a css property for this.
>> 
>> That should work for everything but canvas elements. That might be OK..
> 
> Does Canvas have min/max?  If so, then our implementation of Canvas in the
> HTML5 swc would as well, but it wouldn't be in UIBase.
> 
> -Alex
> 


Re: FlexJS min/max width/height

Posted by Alex Harui <ah...@adobe.com>.

On 7/26/16, 11:58 AM, "Harbs" <ha...@gmail.com> wrote:

>OK. I forgot that there was a css property for this.
>
>That should work for everything but canvas elements. That might be OK..

Does Canvas have min/max?  If so, then our implementation of Canvas in the
HTML5 swc would as well, but it wouldn't be in UIBase.

-Alex


Re: FlexJS min/max width/height

Posted by Harbs <ha...@gmail.com>.
OK. I forgot that there was a css property for this.

That should work for everything but canvas elements. That might be OK..

On Jul 26, 2016, at 7:43 PM, Alex Harui <ah...@adobe.com> wrote:

> 
> 
> On 7/26/16, 9:37 AM, "Harbs" <ha...@gmail.com> wrote:
> 
>> Any objections to me adding min and max widths and heights to UIBase?
>> 
>> Is there a bead that’s more appropriate?
> 
> I'd rather it go in a bead since, IMO, it isn't needed by everybody.  In
> JS aren't these styles?  If so, they can be added to SimpleCSSStyles or a
> new SimpleCSSStylesWithMinMax.
> 
> -Alex
> 


Re: FlexJS min/max width/height

Posted by Alex Harui <ah...@adobe.com>.

On 7/26/16, 1:58 PM, "Harbs" <ha...@gmail.com> wrote:

>Two issues:
>
>1. I’m not sure I understand how SimpleCSSStyles is working. Not every
>style value is enumerated there. For example, I noticed that width and
>height are being set to styles in various places, but they are not
>enumerated.

SimpleCSSStyles and similar classes are intended to allow declarative
setting of styles in MXML.  Not every CSS style is there because otherwise
it would take a huge amount of memory per instance and most of it wouldn't
be used.  It doesn't matter which styles are defined on these classes as
long as it is the ones you want to declare in your MXML.  Folks can make
up their own derivatives of SimpleCSSStyles with a different set of
properties that suits their needs.  There is a BindableCSSStyles as well
that is need to dispatch change events if you change a style at runtime.

>2. I’m not sure I understand the flow of bead behaviors:
>
>Imagine we have a layout bead which sets and reads width and height of
>components. If the min/max sizes of the components is being set in
>another bead on the CSS, I don’t understand how the layout bead is
>supposed to know the true size of the element. If it’s not being set by
>styles, it seems like we can easily end up in a situation where the
>“constrained size bead” and the layout bead could end up playing never
>ending ping-pong. The layout bead would resize and send an event, the
>contraint bead would fix the min size and send an event, back to the
>layout bead ad infinitum.

Width/height is a special case.  It is a property as well as a style.  We
could change it to be just a style, but Flex folks are pretty used to
using width/height to read back the computed width and may not want to use
the various JS APIs.

The current VerticalLayout doesn't factor in min/max styles.  A
VerticalLayoutWithMinMax would get the CSS for min/max values, or maybe
ask measurement beads that could otherwise compute min/max values.

VerticalLayout actually doesn't read a child's width because it doesn't
need to.  Either a child's width is computed from the parent (via
left/right, margin-left/margin-right, percentWidth) or is computed from
its content.  I think once you factor in min/max you may need to think
about the width.  Like regular Flex, there are setWidth and explicitWidth
methods and properties.  setWidth does not set explicitWidth so you can
tell if folks have asked for a specific width or a width is just the last
computed width.

HTH,
-Alex


Re: FlexJS min/max width/height

Posted by Harbs <ha...@gmail.com>.
Two issues:

1. I’m not sure I understand how SimpleCSSStyles is working. Not every style value is enumerated there. For example, I noticed that width and height are being set to styles in various places, but they are not enumerated.
2. I’m not sure I understand the flow of bead behaviors:

Imagine we have a layout bead which sets and reads width and height of components. If the min/max sizes of the components is being set in another bead on the CSS, I don’t understand how the layout bead is supposed to know the true size of the element. If it’s not being set by styles, it seems like we can easily end up in a situation where the “constrained size bead” and the layout bead could end up playing never ending ping-pong. The layout bead would resize and send an event, the contraint bead would fix the min size and send an event, back to the layout bead ad infinitum.

Please educate me… ;-)

Harbs

On Jul 26, 2016, at 7:43 PM, Alex Harui <ah...@adobe.com> wrote:

>  If so, they can be added to SimpleCSSStyles or a new SimpleCSSStylesWithMinMax.


Re: FlexJS min/max width/height

Posted by Alex Harui <ah...@adobe.com>.

On 7/26/16, 9:37 AM, "Harbs" <ha...@gmail.com> wrote:

>Any objections to me adding min and max widths and heights to UIBase?
>
>Is there a bead that’s more appropriate?

I'd rather it go in a bead since, IMO, it isn't needed by everybody.  In
JS aren't these styles?  If so, they can be added to SimpleCSSStyles or a
new SimpleCSSStylesWithMinMax.

-Alex