GitHub/Basalt2
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

deploy: fc44bc4d8b

Browse Source
This commit is contained in:
NoryiE
2025-09-13 20:28:52 +00:00
parent 9e1112f3bd
commit 4ccefcac9f
48 changed files with 3036 additions and 1565 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
docs/references/elements/Flexbox.md
View File

@@ -1,52 +1,46 @@
# Flexbox : Container
This is the Flexbox class. It is a container that arranges its children in a flexible layout.
### Usage
```lua
local flex = main:addFlexbox({background=colors.black, width=30, height=10})
flex:addButton():setFlexGrow(1)
flex:addButton():setFlexGrow(1)
flex:addButton():setFlexGrow(1)
```
# Flexbox
_This is the Flexbox class. It is a container that arranges its children in a flexible layout.
The flexbox element adds the following properties to its children:
_
### Usage
```lua
flex:addButton():setFlexGrow(1) -- The flex-grow property defines the ability for a flex item to grow if necessary.
flex:addButton():setFlexShrink(1) -- The flex-shrink property defines the ability for a flex item to shrink if necessary.
flex:addButton():setFlexBasis(1) -- The flex-basis property defines the default size of an element before the remaining space is distributed.
```
Extends: `Container`
## Properties
|Property|Type|Default|Description|
|---|---|---|---|
|flexDirection|string|"row"|The direction of the flexbox layout "row" or "column"
|flexSpacing|number|1|The spacing between flex items
|flexJustifyContent|string|"flex-start"|The alignment of flex items along the main axis
|flexWrap|boolean|false|Whether to wrap flex items onto multiple lines
|flexUpdateLayout|boolean|false|Whether to update the layout of the flexbox
|flexDirection|string|"row"|The direction of the flexbox layout "row" or "column"|
|flexSpacing|number|1|The spacing between flex items|
|flexJustifyContent|string|"flex-start"|The alignment of flex items along the main axis|
|flexAlignItems|string|"flex-start"|The alignment of flex items along the cross axis|
|flexCrossPadding|number|0|The padding on both sides of the cross axis|
|flexWrap|boolean|false|Whether to wrap flex items onto multiple lines|
## Functions
|Method|Returns|Description|
|---|---|---|
|[Flexbox:addChild](#flexbox-addchild)|Flexbox|Adds a child element to the flexbox
|[Flexbox:addLineBreak](#flexbox-addlinebreak)|Flexbox|Adds a new line break to the flexbox.
|[Flexbox.new](#flexbox-new)|Flexbox|Creates a new Flexbox instance|
|[Flexbox:init](#flexbox-init-props-basalt)|Flexbox|Initializes the Flexbox instance|
|[Flexbox:addChild](#flexbox-addchild-element)|Flexbox|Adds a child element to the flexbox|
|[Flexbox:removeChild](#flexbox-removechild-element)|Flexbox|Removes a child element from the flexbox|
|[Flexbox:addLineBreak](#flexbox-addlinebreak-self)|Flexbox|Adds a new line break to the flexbox.|
|[Flexbox:render](#flexbox-render)|-|Renders the flexbox and its children|
## Flexbox.new()
### Returns
* `Flexbox` `object` The newly created Flexbox instance
## Protected Functions
## Flexbox:init(props, basalt)
### Parameters
* `props` `table` The properties to initialize the element with
* `basalt` `table` The basalt instance
|Method|Returns|Description|
|---|---|---|
|Flexbox:init|Flexbox|Initializes the Flexbox instance
|Flexbox:removeChild|Flexbox|Removes a child element from the flexbox
|Flexbox:render|-|Renders the flexbox and its children
### Returns
* `Flexbox` `self` The initialized instance
## Flexbox:addChild(element)
Adds a child element to the flexbox
### Parameters
@@ -55,13 +49,21 @@ Adds a child element to the flexbox
### Returns
* `Flexbox` `self` The flexbox instance
## Flexbox:removeChild(element)
### Parameters
* `element` `Element` The child element to remove
### Returns
* `Flexbox` `self` The flexbox instance
## Flexbox:addLineBreak(self)
Adds a new line break to the flexbox
### Parameters
* `self` `Flexbox` The element itself
### Returns
* `nil` `nil` nil
* `Flexbox`
## Flexbox:render()