# FlowLayoutPanel Namespace: **Wisej.Web** Assembly: **Wisej.Framework** (3.5.0.0) * [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) * [ScrollableControl](https://docs.wisej.com/api/v3.5/wisej.web/containers/scrollablecontrol) * [Panel](https://docs.wisej.com/api/v3.5/wisej.web/containers/wisej.web.panel) * [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) Represents a panel that dynamically arranges its controls horizontally or vertically in automatic rows or columns. {% tabs %} {% tab title="C#" %} ```csharp public class FlowLayoutPanel : Panel, IExtenderProvider ``` {% endtab %} {% tab title="VB.NET" %} ```visual-basic Public Class FlowLayoutPanel Inherits Panel Implements IExtenderProvider ``` {% endtab %} {% endtabs %} Arranges child controls horizontally or vertically. Ignores the control location, dock style and anchoring. Uses the following properties of the child controls: * [Margin](https://docs.wisej.com/api/v3.5/general/control#margin) Increases the space around the control. * FillWeight Stretches the width of control proportionally, according to the fill weights of all the controls, to use the remaining space in the row. * [MinimumSize](https://docs.wisej.com/api/v3.5/general/control#minimumsize) Enforces the minimum size of controls stretched using the FillWeight value. * [MaximumSize](https://docs.wisej.com/api/v3.5/general/control#maximumsize) Enforces the maximum size of controls stretched using the FillWeight value. * FlowBreak Determines whether to create a new row or a new column after the control. Uses the following properties of the parent [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) control: * [FlowDirection](#flowdirection) Wraps child controls to a new column ([TopDown](https://docs.wisej.com/api/v3.5/wisej.web/containers/wisej.web.flowdirection#fields), or [BottomUp](https://docs.wisej.com/api/v3.5/wisej.web/containers/wisej.web.flowdirection#fields)) or to a new row ([LeftToRight](https://docs.wisej.com/api/v3.5/wisej.web/containers/wisej.web.flowdirection#fields), [RightToLeft](https://docs.wisej.com/api/v3.5/wisej.web/containers/wisej.web.flowdirection#fields)). * [WrapContents](#wrapcontents) When set to false, child controls do not wrap and are either clipped or scrolled. * [Padding](https://docs.wisej.com/api/v3.5/wisej.web/general/wisej.web.padding) Increases the distance between the child controls and the borders of the parent panel. ## Constructors ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)FlowLayoutPanel() Initializes a new instance of the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) class. ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)FlowLayoutPanel(controls, direction) Initializes a new instance of the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) class with the specified initial settings. | Name | Type | Description | | ------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | | **controls** | [Control\[\]](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The array of child controls to add to the panel. | | **direction** | [FlowDirection](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel/wisej.web.flowdirection) | The flow direction of the layout of the child controls. | ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)FlowLayoutPanel(location, size, controls, direction) Initializes a new instance of the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) class with the specified initial settings. | Name | Type | Description | | ------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | | **location** | [Point](https://docs.microsoft.com/dotnet/api/system.drawing.point) | The location of the panel on its parent control. | | **size** | [Size](https://docs.microsoft.com/dotnet/api/system.drawing.size) | The size of the panel. | | **controls** | [Control\[\]](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The array of child controls to add to the panel. | | **direction** | [FlowDirection](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel/wisej.web.flowdirection) | The flow direction of the layout of the child controls. | ## Properties ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)FlowDirection [FlowDirection](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel/wisej.web.flowdirection): Returns or sets a value indicating the flow direction of the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) control. (Default: `LeftToRight`) ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)LayoutEngine [LayoutEngine](https://github.com/iceteagroup/wisej-docs-api/blob/v3.5/wisej.web.layout/containers/layoutengine/layoutengine/README.md): Returns the control's layout engine. ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)WrapContents [Boolean](https://docs.microsoft.com/dotnet/api/system.boolean): Returns or sets whether the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel) control should wrap its contents or let the contents be clipped. (Default: `True`) ## Methods ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)GetFillWeight(control) Determines whether to proportionally stretch the width or the control to fill the remaining space it the containing row. | Parameter | Type | Description | | ----------- | -------------------------------------------------------------------- | ------------------ | | **control** | [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The child control. | **Returns:** [Int32](https://docs.microsoft.com/dotnet/api/system.int32). The fill weight value associated with the control. The FillWeight property defines the relative width of a control in a row managed by the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel). The default value is 0 and the maximum value is 100 (the control will fill all the remaining width of the row.) ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)GetFlowBreak(control) Determines whether to create a new row or a new column, depending on the value of the [FlowDirection](#flowdirection) property, after the control. | Parameter | Type | Description | | ----------- | -------------------------------------------------------------------- | ------------------ | | **control** | [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The child control. | **Returns:** [Boolean](https://docs.microsoft.com/dotnet/api/system.boolean). true if the flow break is set; otherwise, false. ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)SetFillWeight(control, value) Determines whether to proportionally stretch the width or the control to fill the remaining space it the containing row. | Parameter | Type | Description | | ----------- | -------------------------------------------------------------------- | ----------------------------- | | **control** | [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The child control. | | **value** | [Int32](https://docs.microsoft.com/dotnet/api/system.int32) | The fill weight value to set. | The FillWeight property defines the relative width of a control in a row managed by the [FlowLayoutPanel](https://docs.wisej.com/api/v3.5/wisej.web/containers/flowlayoutpanel). The default value is 0 and the maximum value is 100 (the control will fill all the remaining width of the row.) **Throws:** * [ArgumentOutOfRangeException](https://docs.microsoft.com/dotnet/api/system.argumentoutofrangeexception) The value is less than 0 or greater than 100. ### ![](https://2194374196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVxzkjZGSCpOtYHlmOePS%2Fuploads%2Fgit-blob-2389c55cd19719a73a5ae98e1528c8dc8525cc35%2Finstance.png?alt=media)SetFlowBreak(control, value) Determines whether to create a new row or a new column, depending on the value of the [FlowDirection](#flowdirection) property, after the control. | Parameter | Type | Description | | ----------- | -------------------------------------------------------------------- | ---------------------------- | | **control** | [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) | The child control. | | **value** | [Boolean](https://docs.microsoft.com/dotnet/api/system.boolean) | The flow-break value to set. | ## Inherited By | Name | Description | | ----------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | | [BindingNavigator](https://docs.wisej.com/api/v3.5/wisej.web/data-binding/wisej.web.bindingnavigator) | Represents the navigation and manipulation user interface (UI) for controls that are bound to a data source. | ## Implements | Name | Description | | --------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | | [IBindableComponent](https://docs.wisej.com/api/v3.5/wisej.web/data-binding/wisej.web.ibindablecomponent) | Bindable components implement this interface. | | [IDropTarget](https://docs.wisej.com/api/v3.5/wisej.web/interfaces/wisej.web.idroptarget) | Controls that support drag & drop operations implement this interface. | | [IImage](https://docs.wisej.com/api/v3.5/wisej.web/interfaces/wisej.web.iimage) | Provides access to common image properties across the controls that implement this interface. | | [IWisejComponent](https://docs.wisej.com/api/v3.5/wisej.core/interfaces/wisej.core.iwisejcomponent) | All wisej components implement this interface. | | [IWisejControl](https://docs.wisej.com/api/v3.5/wisej.core/interfaces/wisej.core.iwisejcontrol) | All wisej controls derived from the [Control](https://docs.wisej.com/api/v3.5/wisej.web/general/control) class must implement this interface. | | [IWisejSerializable](https://docs.wisej.com/api/v3.5/wisej.core/interfaces/wisej.core.iwisejserializable) | Allows an object to serialize itself. |