NativeText

A customizable text block for Nativeblocks.

@NativeBlock(
    keyType = "NATIVE_TEXT",
    name = "Native Text",
    description = "Nativeblocks text block",
    version = 2
)
fun NativeText()

NativeText is used to display text with various customizable properties, including font, alignment, color, and overflow behavior. It offers flexible options for both simple and complex layouts.

Features:

Customizable font family, weight, size, and color.
Alignment for multi-line and single-line text.
Configurable overflow behavior and padding.
Dynamic frame dimensions.

Example:

NativeText(
    text = "Hello, World!",
    fontFamily = "default",
    fontSize = 16.sp,
    textColor = Color.red,
    textAlign = TextAlign.Center
)

Datas

text

The text to be displayed.

@NativeBlockData(description = "The text content to be displayed.")
var text: String

Properties

width

Specifies the width of the text block.

@NativeBlockProp(
    description = "The width of the text block (e.g., 'match' or 'wrap').",
    valuePickerGroup = NativeBlockValuePickerPosition("Size"),
    valuePicker = NativeBlockValuePicker.COMBOBOX_INPUT,
    valuePickerOptions = [
        NativeBlockValuePickerOption("match", "Match parent"),
        NativeBlockValuePickerOption("wrap", "Wrap content")
    ],
    defaultValue = "wrap"
)
width: String = "wrap"

height

Specifies the height of the text block.

@NativeBlockProp(
    description = "The height of the text block (e.g., 'match' or 'wrap').",
    valuePickerGroup = NativeBlockValuePickerPosition("Size"),
    valuePicker = NativeBlockValuePicker.COMBOBOX_INPUT,
    valuePickerOptions = [
        NativeBlockValuePickerOption("match", "Match parent"),
        NativeBlockValuePickerOption("wrap", "Wrap content")
    ],
    defaultValue = "wrap"
)
height: String = "wrap"

fontFamily

The font family of the text.

@NativeBlockProp(
    description = "The font family for the text.",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    defaultValue = "default"
)
fontFamily: String = "default"

textColor

The color of the text.

@NativeBlockProp(
    description = "The color of the text in hexadecimal format.",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.COLOR_PICKER,
    defaultValue = "#ffffffff"
)
textColor: Color = Color.White

textAlign

The alignment of the text.

@NativeBlockProp(
    description = "The alignment of the text (e.g., 'start', 'center').",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.DROPDOWN,
    valuePickerOptions = [
        NativeBlockValuePickerOption("start", "start"),
        NativeBlockValuePickerOption("center", "center"),
        NativeBlockValuePickerOption("end", "end"),
        NativeBlockValuePickerOption("justify", "justify")
    ],
    defaultValue = "start"
) textAlign: TextAlign = TextAlign.Start

fontWeight

Specifies the font weight of the text.

@NativeBlockProp(
    description = "The weight of the font for the text (e.g., 'normal', 'bold').",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.DROPDOWN,
    valuePickerOptions = [
        NativeBlockValuePickerOption("thin", "thin"),
        NativeBlockValuePickerOption("extraLight", "extraLight"),
        NativeBlockValuePickerOption("light", "light"),
        NativeBlockValuePickerOption("normal", "normal"),
        NativeBlockValuePickerOption("medium", "medium"),
        NativeBlockValuePickerOption("semiBold", "semiBold"),
        NativeBlockValuePickerOption("bold", "bold"),
        NativeBlockValuePickerOption("extraBold", "extraBold"),
        NativeBlockValuePickerOption("black", "black")
    ],
    defaultValue = "normal"
) fontWeight: FontWeight = FontWeight.Normal

overflow

Specifies the overflow behavior of the text.

@NativeBlockProp(
    description = "The overflow behavior of the text (e.g., 'clip', 'ellipsis').",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.DROPDOWN,
    valuePickerOptions = [
        NativeBlockValuePickerOption("clip", "clip"),
        NativeBlockValuePickerOption("ellipsis", "ellipsis"),
        NativeBlockValuePickerOption("visible", "visible")
    ],
    defaultValue = "clip"
)
overflow: TextOverflow = TextOverflow.Clip

minLines

The minimum number of lines for the text.

@NativeBlockProp(
    description = "The minimum number of lines to display.",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.NUMBER_INPUT,
    defaultValue = "1"
)
minLines: Int = 1

maxLines

The maximum number of lines for the text.

@NativeBlockProp(
    description = "The maximum number of lines to display.",
    valuePickerGroup = NativeBlockValuePickerPosition("Font"),
    valuePicker = NativeBlockValuePicker.NUMBER_INPUT,
    defaultValue = "9999"
)
maxLines: Int = 9999