Tizen Native API  6.5
Dali::Toolkit::FlexContainer Class Reference

FlexContainer implements a subset of the flexbox spec (defined by W3C): More...

Inheritance diagram for Dali::Toolkit::FlexContainer:
Dali::Toolkit::Control Dali::CustomActor Dali::Actor Dali::Handle Dali::BaseHandle

Classes

struct  ChildProperty
 Enumeration for the instance of child properties belonging to the FlexContainer class. More...
struct  Property
 Enumeration for the instance of properties belonging to the FlexContainer class. More...

Public Types

enum  FlexDirection
 Enumeration for the direction of the main axis in the flex container. This determines the direction that flex items are laid out in the flex container. More...
enum  ContentDirection
 Enumeration for the primary direction in which content is ordered in the flex container and on which sides the “start” and “end” are. More...
enum  Justification
 Enumeration for the alignment of the flex items when the items do not use all available space on the main-axis. More...
enum  Alignment
 Enumeration for the alignment of the flex items or lines when the items or lines do not use all the available space on the cross-axis. More...
enum  WrapType
 Enumeration for the wrap type of the flex container when there is no enough room for all the items on one flex line. More...
enum  PropertyRange
 Enumeration for the start and end property ranges for this control. More...

Public Member Functions

 FlexContainer ()
 Creates a FlexContainer handle; this can be initialized with FlexContainer::New() Calling member functions with an uninitialized handle is not allowed.
 FlexContainer (const FlexContainer &handle)
 Copy constructor. Creates another handle that points to the same real object.
FlexContaineroperator= (const FlexContainer &handle)
 Assignment operator. Changes this handle to point to another real object.
 ~FlexContainer ()
 Destructor.

Static Public Member Functions

static FlexContainer New ()
 Creates the FlexContainer control.
static FlexContainer DownCast (BaseHandle handle)
 Downcasts an Object handle to FlexContainer.

Detailed Description

FlexContainer implements a subset of the flexbox spec (defined by W3C):

https://www.w3.org/TR/css3-flexbox/

It aims at providing a more efficient way to lay out, align and distribute space among items in the container, even when their size is unknown or dynamic.

FlexContainer has the ability to alter the width and height of its children (i.e. flex items) to fill the available space in the best possible way on different screen sizes. FlexContainer can expand items to fill available free space, or shrink them to prevent overflow.

Below is an illustration of the various directions and terms as applied to a flex container with the "flex direction" defined as "row".

     flex container
    --------------------------------------------------------------- cross start
    | ------------------ --------|--------------------------- |
    | |                | |       |                          | |
    | |                | |       |                          | |
    | |  flex item 1   | |       |    flex item 2           | | main axis
    |-|----------------|-|-------|--------------------------|-|------------>
    | |                | |       |                          | |
    | |                | |       |                          | |
    | |                | |       |                          | |
    | ------------------ --------|--------------------------- |
    -----------------------------|--------------------------------- cross end
    |                            |                            |
    | main start                 | cross axis                 | main end
    |                            |                            |
                                 v

Per-child Custom properties for script supporting:

The following custom properties of the actor are checked to decide how to lay out the actor inside the flex container.

These properties are registered dynamically to the child and are non-animatable.

| Property Name | Type | |-------------------------|-------------| | flex | float | | alignSelf | integer | | flexMargin | Vector4 |

The available values for alignSelf are: ALIGN_AUTO, ALIGN_FLEX_START, ALIGN_CENTER, ALIGN_FLEX_END, ALIGN_STRETCH

 "name":"icon",
 "type":"ImageView",
 "image":"image.png",
   "properties": {
     "flex":1,                        // Property to make the item to receive the specified proportion of the free space in the container.
     "alignSelf":"flexStart",         // Property to specify how the item will align along the cross axis.
     "flexMargin":[10, 10, 10, 10]    // Property to specify the space around the item.
   }
Since:
3.0, DALi version 1.1.35

Member Enumeration Documentation

Enumeration for the alignment of the flex items or lines when the items or lines do not use all the available space on the cross-axis.

Since:
3.0, DALi version 1.1.35
Enumerator:
ALIGN_AUTO 

Inherits the same alignment from the parent (only valid for "alignSelf" property)

Since:
3.0, DALi version 1.1.35
ALIGN_FLEX_START 

At the beginning of the container.

Since:
3.0, DALi version 1.1.35
ALIGN_CENTER 

At the center of the container.

Since:
3.0, DALi version 1.1.35
ALIGN_FLEX_END 

At the end of the container.

Since:
3.0, DALi version 1.1.35
ALIGN_STRETCH 

Stretch to fit the container.

Since:
3.0, DALi version 1.1.35

Enumeration for the primary direction in which content is ordered in the flex container and on which sides the “start” and “end” are.

Since:
3.0, DALi version 1.1.35
Enumerator:
INHERIT 

Inherits the same direction from the parent.

Since:
3.0, DALi version 1.1.35
LTR 

From left to right.

Since:
3.0, DALi version 1.1.35
RTL 

From right to left.

Since:
3.0, DALi version 1.1.35

Enumeration for the direction of the main axis in the flex container. This determines the direction that flex items are laid out in the flex container.

Since:
3.0, DALi version 1.1.35
Enumerator:
COLUMN 

The flexible items are displayed vertically as a column.

Since:
3.0, DALi version 1.1.35
COLUMN_REVERSE 

The flexible items are displayed vertically as a column, but in reverse order.

Since:
3.0, DALi version 1.1.35
ROW 

The flexible items are displayed horizontally as a row.

Since:
3.0, DALi version 1.1.35
ROW_REVERSE 

The flexible items are displayed horizontally as a row, but in reverse order.

Since:
3.0, DALi version 1.1.35

Enumeration for the alignment of the flex items when the items do not use all available space on the main-axis.

Since:
3.0, DALi version 1.1.35
Enumerator:
JUSTIFY_FLEX_START 

Items are positioned at the beginning of the container.

Since:
3.0, DALi version 1.1.35
JUSTIFY_CENTER 

Items are positioned at the center of the container.

Since:
3.0, DALi version 1.1.35
JUSTIFY_FLEX_END 

Items are positioned at the end of the container.

Since:
3.0, DALi version 1.1.35
JUSTIFY_SPACE_BETWEEN 

Items are positioned with equal space between the lines.

Since:
3.0, DALi version 1.1.35
JUSTIFY_SPACE_AROUND 

Items are positioned with equal space before, between, and after the lines.

Since:
3.0, DALi version 1.1.35

Enumeration for the start and end property ranges for this control.

Since:
3.0, DALi version 1.1.35
Enumerator:
PROPERTY_START_INDEX 
Since:
3.0, DALi version 1.1.35
PROPERTY_END_INDEX 

Reserve property indices.

Since:
3.0, DALi version 1.1.35
CHILD_PROPERTY_START_INDEX 
Since:
3.0, DALi version 1.1.35
CHILD_PROPERTY_END_INDEX 

Reserve child property indices.

Since:
3.0, DALi version 1.1.35

Reimplemented from Dali::Toolkit::Control.

Enumeration for the wrap type of the flex container when there is no enough room for all the items on one flex line.

Since:
3.0, DALi version 1.1.35
Enumerator:
NO_WRAP 

Flex items laid out in single line (shrunk to fit the flex container along the main axis)

Since:
3.0, DALi version 1.1.35
WRAP 

Flex items laid out in multiple lines if needed.

Since:
3.0, DALi version 1.1.35

Constructor & Destructor Documentation

Creates a FlexContainer handle; this can be initialized with FlexContainer::New() Calling member functions with an uninitialized handle is not allowed.

Since:
3.0, DALi version 1.1.35

Copy constructor. Creates another handle that points to the same real object.

Since:
3.0, DALi version 1.1.35
Parameters:
[in]handleThe handle to copy from

Destructor.

This is non-virtual since derived Handle types must not contain data or virtual methods.

Since:
3.0, DALi version 1.1.35

Member Function Documentation

Downcasts an Object handle to FlexContainer.

If handle points to a FlexContainer, the downcast produces valid handle. If not, the returned handle is left uninitialized.

Since:
3.0, DALi version 1.1.35
Parameters:
[in]handleHandle to an object
Returns:
Handle to a FlexContainer or an uninitialized handle

Reimplemented from Dali::Toolkit::Control.

Creates the FlexContainer control.

Since:
3.0, DALi version 1.1.35
Returns:
A handle to the FlexContainer control

Reimplemented from Dali::Toolkit::Control.

FlexContainer& Dali::Toolkit::FlexContainer::operator= ( const FlexContainer handle)

Assignment operator. Changes this handle to point to another real object.

Since:
3.0, DALi version 1.1.35
Parameters:
[in]handleHandle to an object
Returns:
A reference to this