Skip to main content
A newer version of this page is available. .

Flow Layout Mode

  • 2 minutes to read

In Flow Layout Mode, widgets are not held in any kind of containers like stack groups in Stack Layout Mode or columns and rows in Table Layout Mode. Instead, each successive widget follows the previous widget, forming a column or row according to the selected direction. The figure below illustrates a WidgetView with the Flow Layout Mode applied.

WidgetView - Flow Layout Mode

To apply this mode, set the WidgetView.LayoutMode to FlowLayout. All settings for this layout mode are stored in the WidgetView.FlowLayoutProperties section that provides access to the following properties.

  • FlowLayoutProperties.FlowDirection - allows you to choose one of four possible directions (RightToLeft, LeftToRight, BottomUp, TopDown), based on which the View will arrange its widgets.
  • FlowLayoutProperties.FlowLayoutItems - stores all widgets displayed within this mode. This collection differs from the BaseView.Documents collection that keeps all documents owned by this View. The FlowLayoutItems collection stores only those documents that are currently displayed within this flow layout mode View. Secondly, all documents within this collection are stored in the same order as they appear at runtime. Re-arranging widgets will modify their order within the FlowLayoutItems collection.
  • FlowLayoutProperties.ItemDragMode - allows you to choose between Move and Swap drag modes. In Move mode, the document being dragged can be placed before or after any widget, causing the previous widgets to slide one step forward or back respectively. In Swap mode, the dragged widget can be dropped upon another widget to make these widgets swap their positions.
  • FlowLayoutProperties.WrapContent - gets or sets whether the View content should be wrapped. Widgets follow each other in a specific direction until they reach the View’s border. If content wrapping is enabled, the next widget will start a new column or row. Otherwise, if the WrapContent property equals false, widgets will continue following each other even if this means some of them are placed outside the View’s borders (and as a result, outside of the end-user’s sight).