Horizontal Stack
Check out the function of the Horizontal Stack element.
Horizontal Stack is an element used in user interface layout and design. It is commonly used in UI Design. Its function is to arrange and organize elements in a horizontal layout.
You can use the Horizontal Stack element to adjust the spacing between two or more elements placed side by side. You can add various elements, including Display and Input types, into a Horizontal Stack.
The Horizontal Stack element can be used in web or mobile applications you develop.
Adding Horizontal Stack
Adding a Horizontal Stack element to your application is quite straightforward. To add a Horizontal Stack, follow these steps:
Drag and drop the Horizontal Stack element onto the screen.
You can customize the Horizontal Stack element using the Properties panel.
When you drag and drop the Horizontal Stack element onto an empty space on the screen, it automatically comes with a Row/Column. You can add the Horizontal Stack element by dragging and dropping it into a Row/Column or Panel element.
You can add a Vertical Stack element inside a Horizontal Stack.
You can add the Horizontal Stack element inside elements such as
Row,
When a Label, Input, or Button element is added inside a Horizontal Stack, these elements come with a defined width of 100 px within the Horizontal Stack.
1. Properties
When the Horizontal Stack element is selected, parameters such as Gap, Authorization, and Visibility can be viewed in the Properties panel.
These parameter areas allow you to edit special authorization settings and visibility preferences related to the Horizontal Stack. You can adjust its visibility using show/hide/conditional options. You can add text and icons inside the Horizontal Stack element. Role-based permissions can be given to the element.
Gap
Select the Horizontal Stack element. In the Properties panel, you can set the space value between elements added inside the Horizontal Stack through the Gap section. It defaults to 12 pixels, but you can change this value as desired.
You can use authorization options for the Horizontal Stack element.
Click here for a detailed examination of adding Authorization processes in elements.
Click here for a detailed examination of Authorization processes based on user roles or screen roles.
Visibility in elements is a feature used to control its visibility or accessibility in certain situations. This feature is often used in application design or functionality.
You can use visibility options to make the Horizontal Stack element always visible, hidden, or visible/hidden depending on a condition.
Click here for detailed information about adding Visibility to elements.
2.Styling
You can customize the Horizontal Stack element with the Styling panel.
You can make additional adjustments by adding Border, Fill , or Shadow to the Horizontal Stack element.
In the Horizontal Stack element, you can make visual adjustments such as Padding and Size with Layout.
In the Layout area of the Horizontal Stack element, Size and Display settings are not made. Therefore, these areas are inactive. You can do a limited alignment in the Align area.
Click here for detailed information about adding Layout to elements.
You can add color or an image to the background of the Horizontal Stack element with Fill.
Click here for detailed information about adding Fill to elements.
You can add a border to the outer edges of the Horizontal Stack and give radius.
Click here for detailed information about adding Borders to elements.
In web applications, you can add a shadow effect to the Horizontal Stack element with Shadow. Shadow is not used in mobile applications.
Click here for detailed information about adding Shadow to elements.
Last updated
