Center

Overview

The CENTER widget centers its child within its parent. If the parent has no constraints, CENTER will size itself to the first constraints found within the widget tree and center its children within those constraints.

Table of Contents

• Overview
• Usage
  • Ideals:
  • Restrictions:
• Attributes :: VisibleWidget (inherited attributes)
• Examples - (fig. a) - (img. a)
• Other Widgets You May Find Useful:

Usage

CENTER is best used to center a single child within its parent.

Ideals:

• Used with a single child inside of it, which in turn may contain multiple children.

Restrictions:

• If CENTER wraps multiple children, it will place those children in a stack, causing the children to overlap.
• If there are no constraints imposed by the parent, CENTER will walk up the tree and use constraints of the closest parent, with the screen size being the highest level.
• If a widget has siblings, consider using the center attribute on BOX, ROW(./Row) or COLUMN(./Column).

Attributes :: VisibleWidget (inherited attributes)

Name	Type	Default	Description	Req

Examples

(fig. a)

An XML example of an ICON centered with a BOX.

<FML>
    <BOX width="300" height="500" elevation="10" color="blue">
        <CENTER>
            <ICON icon="lens" color="red"/>
        </CENTER>
    </BOX>
</FML>

See it in Action

(img. a)

Other Widgets You May Find Useful:

• Layout Basics
• BOX
• COLUMN
• ROW
• STACK