Text
It is a property that allows us to integrate hard or fixed text, not editable from the render
Appearance
Background color : The option to modify the background of your control allows you to personalize its appearance. When you click on it, a window will open that will allow you to select from various color variables, such as your primary or secondary tone, or even enter a specific hexadecimal code. In addition, you will find other settings that will allow you to further customize the background of your control.
Text color :The option to modify the text color of your control allows you to personalize its appearance. When you click on it, a window will open that will allow you to select from various color variables, such as your primary or secondary tone, or even enter a specific hexadecimal code for a custom color.
Typography
Font size : This option allows you to adjust the font size of your control by entering a numeric value represented in pixels in the "custom" mode. You can also activate the "global" option by clicking on the lock-shaped icon, which will turn gray with the label "global". This way, it will have the size that you have set in the default options of the style bar as default. You can switch back to the "custom" option by changing the value or clicking on the icon again until it turns blue with the label "custom".
Style :
Text align : "This option allows you to align your paragraphs in different ways:
Centered text (centrally aligns your text).
Justified (aligns the text on both edges).
Left-aligned (aligns your text towards the left edge of your control).
Right-aligned (aligns the text towards the right edge of your control)."
Dimentions
Size : This option allows you to configure the size of your control both in height and width. It has two measurement systems: percentage (%) and pixels (px).
In the percentage system, you can enter a numerical value from 0 to 100, and the size of the control will automatically adjust to the percentage indicated with respect to the size of the container that contains it. For example, if you indicate a size of 50%, the control will occupy half of the screen, regardless of the size of the device. To activate this option, make sure that the corresponding icon is in blue.
On the other hand, in the pixel system, you can indicate a numerical value to determine the size of the control in pixels. This measurement will remain constant, regardless of the dimensions of the device. You can indicate any number of pixels between 0 and the maximum allowed. To activate this option, make sure that the corresponding icon is in gray.
Margin
Inner margin : This option allows you to modify the internal margin of your control, providing a separation from its border towards the inside and giving a margin of separation to the internal controls. You must enter a numerical value represented in pixels.
Outer margin : This option allows you to add an external margin to your control, which means it will add a margin starting from the edge of your control outwards, marking a separation from the controls around it. You must enter a numerical value that will be represented in pixels. You can modify all margins at the same time or disable the chain and modify them individually.
Borders
Border Width : This option allows you to add a border to your control, from the outside to the inside of it. You can modify the border on the top, right, bottom, and left sides of the control. You can adjust each of them individually or anchor them to have the same proportion every time you modify one. The value entered is numerical and expressed in pixels.
With these options, you can customize the border of your control and adjust it to your design needs.
Border Radius : This option allows you to modify the rounding of the corners of your controls. You can adjust the top-right corner, bottom-right corner, bottom-left corner, and top-left corner. You can modify each of them individually or anchor them to have the same proportion every time you modify one. The value entered is numeric and expressed in pixels. The higher the value, the greater the rounding of the corner.
With these options, you can customize the rounding of the corners of your control and adjust it to your design needs.
Border color : The option to modify the color of your control's border gives you the possibility to personalize its appearance. When you click on this option, a window will open that will allow you to choose from various color variables, such as your primary or secondary tone, or even enter a specific hexadecimal code. Additionally, you will find other settings that will allow you to further customize the background of your control.
Border style : This option allows you to modify the border style of your control, offering you three different options to choose from: "dotted", "dashed", and "solid".
Última actualización
