reflex/reflex-framework

Content is vertically centered by default rather than top aligned

Closed this issue · 1 comments

I have an Application with an HGroup and that HGroup contains a single Button. The HGroup is set to a full width and height of 100% (uses default Application layout of BasicLayout). The Button is aligned to the left as expected but is vertically centered rather than top aligned. Also its vertically centered using the top point of the Button rather than taking its height and dividing it by 2.

Sample code below was used in an AIR application. All you need to do in your app XML file is set visible to true. Don't worry about setting a specific width and height. Reflex takes the default width and height into account.

<?xml version="1.0" encoding="utf-8"?>
<rx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
                       xmlns:s="library://ns.adobe.com/flex/spark" 
                       xmlns:mx="library://ns.adobe.com/flex/mx" 
                       xmlns:rx="http://rx.reflex.io/2010">

    <rx:HGroup width="100%" height="100%">
        <rx:Button label="This is a test" />
    </rx:HGroup>

</rx:Application>

By setting the "align" style on the HGroup to top doesn't have any affect. I verified this is expected since the HorizontalLayout class doesn't look for an "align" style.

added horizontalAlign and verticalAlign properties to VerticalLayout and HorizontalLayout. Closed by ba0deb9.