📝 Text Area
The Text Area widget is the primary input field for user-provided text. Unlike a Label, which is read-only, a Text Area allows for multi-line editing, character insertion, and deletion. It is most commonly used in conjunction with a Keyboard for data entry.
⚙️ Properties (Props)
The Text Area configuration is defined by the TextAreaWidget interface. It manages a dynamic string buffer and visual cursor positioning.
| Property | Type | Description |
|---|---|---|
| Text | string | The current content of the input field. |
| Placeholder | string | Hint text shown when the field is empty (e.g., "Enter Name..."). |
| Password Mode | boolean | Replaces characters with symbols (●) for secure entry. |
| One Line | boolean | Forces the text to stay on a single horizontal line. |
| Max Length | number | Limits the number of characters allowed in the field. |
🛠 Interaction and Focus
The Text Area works by capturing "Focus." When a user clicks the widget:
- The Cursor appears: A vertical line indicating the insertion point.
- Events trigger: You can trigger a Keyboard to slide into view automatically.
- Selection: Users can click to move the cursor or (if enabled) double-click to select words for replacement.
🎨 Styling the Input
In the Inspector Panel, you can define the look of the input box:
- Main: Styles the background, border, and padding around the text.
- Placeholder Color: Typically a lighter grey to distinguish it from actual user input.
- Cursor Style: Adjust the color and "blink rate" of the vertical insertion bar.
- Selected Text: Define the highlight color used when text is being copied or deleted.
⚡ Runtime API (Lua)
Text Areas are the core of user data collection in the Logic and Events system.
-- Get the user's input
local username = txt_user:get_text()
-- Clear the field after a successful submission
if submission_success then
txt_user:set_text("")
end
-- Programmatically add text to the current cursor position
txt_log:add_text("System Booted...")
-- Change to password mode dynamically
txt_pin:set_password_mode(true)
-- Move the cursor to the end of the text
txt_comment:set_cursor_pos(-1)
To make a Text Area functional, you must link it to a Keyboard. In Artok, you usually do this by setting the Keyboard's Target property to the specific Text Area widget ID.
🚀 Next Steps
- Keyboard — The essential companion for any Text Area input.
- Label — Use this for non-editable, static, or dynamic display text.
- Logic and Events — Learn how to validate email addresses or passwords entered into a Text Area.