Skip to main content

Textarea

A Shadcn multi-line text input.

Its height starts at min_height. The user can drag the corner to resize it (unless resizable is False), up to max_height.

Example:

shad.Textarea(placeholder="Type your message here.")
Textarea
Textarea

Inherits: LayoutControl

Properties

  • autofocus - Whether this textarea should be focused on initial display.
  • description - Helper text shown below this textarea.
  • error_text - An error message shown in red below this textarea.
  • label - The label shown above this textarea.
  • max_height - The largest height the user can resize this textarea to.
  • max_length - The maximum number of characters that can be entered.
  • min_height - The initial and smallest height.
  • placeholder - The hint shown while value is empty.
  • read_only - Whether the text can be selected but not changed.
  • resizable - Whether the user can drag the bottom-right corner to change the height.
  • value - The current text of this textarea.

Events

  • on_blur - Called when this textarea loses focus.
  • on_change - Called when the text changes.
  • on_focus - Called when this textarea receives focus.

Methods

  • focus - Requests focus for this textarea.

Example​

Shadcn Textarea​

play_arrowTry Online
import flet_shadcn_ui as shad

import flet as ft

MAX_LENGTH = 120


def main(page: ft.Page):
page.title = "Shadcn Textarea"

def handle_change(e: ft.Event[shad.Textarea]):
counter.value = f"{len(e.control.value)}/{MAX_LENGTH}"

counter = ft.Text(f"0/{MAX_LENGTH}", color=ft.Colors.ON_SURFACE_VARIANT)

page.add(
ft.SafeArea(
content=ft.Column(
width=360,
controls=[
ft.Text("Your message"),
shad.Textarea(
key="message",
placeholder="Type your message here.",
max_length=MAX_LENGTH,
on_change=handle_change,
),
counter,
],
)
)
)


if __name__ == "__main__":
ft.run(main)
textarea
Typing a message

Properties​

autofocusclass-attributeinstance-attribute​

autofocus: bool = False

Whether this textarea should be focused on initial display.

descriptionclass-attributeinstance-attribute​

description: StrOrControl | None = None

Helper text shown below this textarea.

error_textclass-attributeinstance-attribute​

error_text: str | None = None

An error message shown in red below this textarea. The border turns red too.

Set it after validating the value, and set it back to None (or an empty string) to clear the error.

labelclass-attributeinstance-attribute​

label: StrOrControl | None = None

The label shown above this textarea.

It turns red while error_text is set.

max_heightclass-attributeinstance-attribute​

max_height: Number = 500

The largest height the user can resize this textarea to.

Raises:

  • ValueError - If it is not greater than or equal to min_height.

max_lengthclass-attributeinstance-attribute​

max_length: int | None = None

The maximum number of characters that can be entered.

Raises:

  • ValueError - If it is not strictly greater than 0.

min_heightclass-attributeinstance-attribute​

min_height: Number = 80

The initial and smallest height.

Raises:

  • ValueError - If it is not strictly greater than 0.
  • ValueError - If it is not less than or equal to max_height.

placeholderclass-attributeinstance-attribute​

placeholder: StrOrControl | None = None

The hint shown while value is empty.

read_onlyclass-attributeinstance-attribute​

read_only: bool = False

Whether the text can be selected but not changed.

resizableclass-attributeinstance-attribute​

resizable: bool = True

Whether the user can drag the bottom-right corner to change the height.

valueclass-attributeinstance-attribute​

value: str = ''

The current text of this textarea.

Events​

on_blurclass-attributeinstance-attribute​

on_blur: ControlEventHandler[Textarea] | None = None

Called when this textarea loses focus.

on_changeclass-attributeinstance-attribute​

on_change: ControlEventHandler[Textarea] | None = None

Called when the text changes.

The data property of the event handler argument contains the new text.

on_focusclass-attributeinstance-attribute​

on_focus: ControlEventHandler[Textarea] | None = None

Called when this textarea receives focus.

Methods​

focusasync​

focus()

Requests focus for this textarea.