The ASDoc was generated a while ago and can be found in my Apache people 
directory:

http://people.apache.org/~pent/asdoc-flexjs/index.html

This is temporary, of course.

Peter Ent
Adobe Systems/Apache Flex Project

From: Marcus Fritze 
<[email protected]<mailto:[email protected]>>
Reply-To: <[email protected]<mailto:[email protected]>>
Date: Thursday, December 10, 2015 at 8:03 AM
To: <[email protected]<mailto:[email protected]>>
Subject: Re: [FlexJS] Container horizontalAlign="center" / 
verticalAlign="middle" possible

Thank you for your detailed explanations.

It works. Nice!

This brings to my next questions:

Do we have ASDocs / any API documentation for flexJS. If yes, where can I find 
it.
Maybe we should also add a link on http://flex.apache.org/ under documentation.

And currently no max-width / max-height supported? Setting this in style will 
also not work.

Thanks.

Marcus


Am 09.12.2015 um 22:07 schrieb Alex Harui 
<[email protected]<mailto:[email protected]>>:

And one more thing: if we see enough demand, we'd probably just create a
CenteringLayout or something like that is specifically designed to center
a child.

<js:Container width=„100%“ height=„100%“>
 <js:beads>
   <js:CenteringLayout />
 </js:beads>
 <js:Container width=„150“ height=„150“>
   <js:Label text="Hello World“/>
 </js:Container>
</js:Container>

And even:

<js:CenteringContainer width=„100%“ height=„100%“>
 <js:Container width=„150“ height=„150“>
   <js:Label text="Hello World“/>
 </js:Container>
</js:CenteringContainer>



-Alex

On 12/9/15, 12:46 PM, "Alex Harui" <[email protected]<mailto:[email protected]>> 
wrote:



On 12/9/15, 11:07 AM, "Marcus Fritze" 
<[email protected]<mailto:[email protected]>>
wrote:

Hi,

I started playing around a little bit with FlexJS. Is it possible to
align a container in the vertical middle / horizontal center, like in
FlexSDK.

Something like:

<js:Container width=„100%“ height=„100%“ verticalAlign=„middle“
horizontalAlign=„center">

<js:Container width=„150“ height=„150“>
<js:Label text="Hello World“/>
</js:Container>

</js:Container>

So the sub-Container should be located in the center middle of the top
Container.


In the JS output, we want to use as much default browser behavior as
possible so when folks fool around with their CSS, it does what is
expected.

There is no CSS style called horizontalCenter, so that property isn't
currently supported in BasicLayout, which is the default layout for
Container.  Instead, you can use margin-left="auto" and
margin-right="auto" to center a child.  And remember, the margins go on
the child, it isn't a command for the parent layout.  So it would look
like:

<js:Container width=„100%“ height=„100%“>
  <js:Container width=„150“ height=„150“
style="marginLeft:auto;marginRight:auto">
      <js:Label text="Hello World“/>
  </js:Container>
</js:Container>

It turns out that verticalAlign is not supported on non-inline elements.
If you choose HorizontalLayout, verticalAlign should work.

A fancier absolute layout could implement verticalAlign and
HorizontalCenter, but it will run more code on the JS side and thus be
fatter and slower.  We'll probably build one in order to make a component
set that is more like Spark, but we don't have one now.


HTH,
-Alex



Reply via email to