.. _stdlib_ui_flow_layout_component:

============
UIFlowLayout
============


++++++++++++
Enumerations
++++++++++++

.. _enum-ui_layout_base-LayoutDirection:

.. das:attribute:: LayoutDirection

Direction of the layout.

:Values: * **Horizontal** = 0x0u8 - Arranges children horizontally.

         * **Vertical** = 0x1u8 - Arranges children vertically.


+++++++
Classes
+++++++

.. _struct-ui_flow_layout_component-UIFlowLayout:

.. das:attribute:: UIFlowLayout : Component

.. note:: ``UIFrame``  component is automatically added to the node if it is not already present

This component arranges node's children sequentially wrapping them to the next row if they don't fit horizontally using specified ``spacing``, ``padding`` and ``alignment``.

If child node doesn't have ``UIFrame`` component, it won't participate in layouting.

.. note:: To work properly, ``UICanvas`` component is required in one of the parent nodes.

:Fields: * **direction** :  :ref:`LayoutDirection <enum-ui_layout_base-LayoutDirection>`  = ui_layout_base::LayoutDirection.Horizontal - Direction of the layout. Default is ``Horizontal``.

         * **alignment** :  :ref:`LayoutAlignment <enum-ui_layout_base-LayoutAlignment>`  - Alignment of the layout within the parent frame. Default is ``TopLeft``.

         * **spacing** : float2 - Spacing between children.

         * **padding** : float4 - Padding in pixels, `float4(left, top, right, bottom)`.


.. _function-ui_flow_layout_component_UIFlowLayout_rq_layout_UIFlowLayout:

.. das:function:: UIFlowLayout.layout()

Applies flow layouting strategy to the children of the node.

.. note::
    This function is called automatically every frame.

.. _function-ui_flow_layout_component_UIFlowLayout_rq_apply_UIFlowLayout_array_ls_NodeId_gr__hh_:

.. das:function:: UIFlowLayout.apply(childrenNodes: array<NodeId>#)

Applies flow layouting to the given children.

:Arguments: * **childrenNodes** : array< :ref:`NodeId <handle-public_scene-NodeId>` >#