M5TextArea

M5TextArea是一个可以在用户界面中创建文本输入区域的控件。它允许用户输入和编辑多行文本，支持占位符、滚动和各种样式选项。

UiFlow2 应用示例

基础文本区域

在UiFlow2中打开|cores3_textarea_basic_example.m5f2|项目。

此示例演示如何向文本框添加文本内容以及使用按钮清除文本框的内容。

UiFlow2 代码块：

示例输出：

None

MicroPython 应用示例

基础文本区域

此示例演示如何向文本框添加文本内容以及使用按钮清除文本框的内容。

MicroPython 代码块：

# SPDX-FileCopyrightText: 2025 M5Stack Technology CO LTD
#
# SPDX-License-Identifier: MIT

import os, sys, io
import M5
from M5 import *
import m5ui
import lvgl as lv
import time


page0 = None
textarea0 = None
button0 = None


line = None


def button0_clicked_event(event_struct):
    global page0, textarea0, button0, line

    textarea0.set_text("")
    line = 1


def button0_event_handler(event_struct):
    global page0, textarea0, button0, line
    event = event_struct.code
    if event == lv.EVENT.CLICKED and True:
        button0_clicked_event(event_struct)
    return


def setup():
    global page0, textarea0, button0, line

    M5.begin()
    Widgets.setRotation(1)
    m5ui.init()
    page0 = m5ui.M5Page(bg_c=0xFFFFFF)
    textarea0 = m5ui.M5TextArea(
        text="",
        placeholder="Placeholder...",
        x=19,
        y=26,
        w=266,
        h=124,
        font=lv.font_montserrat_14,
        bg_c=0xFFFFFF,
        border_c=0xE0E0E0,
        text_c=0x212121,
        parent=page0,
    )
    button0 = m5ui.M5Button(
        text="clear text",
        x=22,
        y=172,
        bg_c=0x2196F3,
        text_c=0xFFFFFF,
        font=lv.font_montserrat_14,
        parent=page0,
    )

    button0.add_event_cb(button0_event_handler, lv.EVENT.ALL, None)

    page0.screen_load()
    line = 1


def loop():
    global page0, textarea0, button0, line
    M5.update()
    textarea0.add_text(str((str("line") + str(line))))
    time.sleep(1)
    line = (line if isinstance(line, (int, float)) else 0) + 1


if __name__ == "__main__":
    try:
        setup()
        while True:
            loop()
    except (Exception, KeyboardInterrupt) as e:
        try:
            m5ui.deinit()
            from utility import print_error_msg

            print_error_msg(e)
        except ImportError:
            print("please update to latest firmware")

示例输出：

None

API参考

M5TextArea

class m5ui.textarea.M5TextArea(*args, **kwargs)

基类：textarea

创建一个文本框控件。

参数:

• text (str) – 文本框的初始文本内容。

• placeholder (str) – 文本框为空时的占位符文本。

• x (int) – 文本框的X坐标位置。

• y (int) – 文本框的Y坐标位置。

• w (int) – 文本框的宽度。

• h (int) – 文本框的高度。

• font (lv.font_t) – 用于文本的字体。

• bg_c (int) – 文本框的背景颜色。

• border_c (int) – 文本框的边框颜色。

• text_c (int) – 文本框的文本颜色。

• parent (lv.obj) – 文本框的父对象。如果未指定，将设置为活动屏幕。

set_flag(flag, value)

在对象上设置标志。如果 value 为True，则添加标志；如果为False，则移除标志。

参数:

• flag (int) – 要设置的标志。

• value (bool) – 如果为True，则添加标志；如果为False，则移除标志。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_flag(lv.obj.FLAG.HIDDEN, True)

toggle_flag(flag)

切换对象上的标志。如果标志已设置，则移除它；如果未设置，则添加它。

参数:

flag (int) – 要切换的标志。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.toggle_flag(lv.obj.FLAG.HIDDEN)

set_state(state, value)

设置文本框的状态。如果 value 为True，则设置状态；如果为False，则取消设置状态。

参数:

• state (int) – 要设置的状态。

• value (bool) – 如果为True，则设置状态；如果为False，则取消设置状态。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_state(lv.STATE.PRESSED, True)

toggle_state(state)

切换文本框的状态。如果状态已设置，则取消设置；如果未设置，则设置它。

参数:

state (int) – 要切换的状态。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.toggle_state(lv.STATE.PRESSED)

add_event_cb(handler, event, user_data)

为文本框添加事件回调。当指定的事件发生时，将调用回调函数。

参数:

• handler (function) – 要调用的回调函数。

• event (int) – 要监听的事件。

• user_data (Any) – 传递给回调函数的可选用户数据。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

def textarea_0_ready_event(event_struct):
    global page0, button0
    print("released")

def textarea_0_value_changed_event(event_struct):
    global page0, button0
    print("value changed")

def textarea_0_focused_event(event_struct):
    global page0, button0
    print("focused")

def textarea_0_defocused_event(event_struct):
    global page0, button0
    print("focused")

def textarea_0_event_handler(event_struct):
    event = event_struct.code
    if event == lv.EVENT.VALUE_CHANGED and True:
        textarea_0_value_changed_event(event_struct)
    elif event == lv.EVENT.READY and True:
        textarea_0_ready_event(event_struct) # 单行模式下才会触发
    elif event == lv.EVENT.FOCUSED:
        textarea_0_focused_event(event_struct)
    elif event == lv.EVENT.DEFOCUSED:
        textarea_0_defocused_event(event_struct)
    return

textarea_0.add_event_cb(textarea_0_event_handler, lv.EVENT.ALL, None)

set_bg_color(color, opa, part)

设置文本框的背景颜色。

参数:

• color (int) – 要设置的颜色。

• opa (int) – 颜色的不透明度。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_bg_color(lv.color_hex(0xFFFFFF), 255, lv.PART.MAIN | lv.STATE.DEFAULT)

set_style_radius(radius, part)

设置滑块组件的角半径。

参数:

• radius (int) – 要设置的半径。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

slider_0.set_style_radius(10, lv.PART.MAIN | lv.STATE.DEFAULT)

set_border_color(color, opa, part)

设置文本框的边框颜色。

参数:

• color (int) – 要设置的颜色。

• opa (int) – 颜色的不透明度。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_border_color(lv.color_hex(0xE0E0E0), 255, lv.PART.MAIN | lv.STATE.DEFAULT)

set_style_border_width(width, part)

设置文本框的边框宽度。

参数:

• width (int) – 要设置的宽度。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_style_border_width(2, lv.PART.MAIN | lv.STATE.DEFAULT)

set_placeholder_text(text)

设置当文本框为空时显示的占位符文本。

参数:

text (str) – 要设置的占位符文本。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_placeholder_text("Enter text here...")

set_text_color(color, opa, part)

设置文本的颜色。

参数:

• color (int) – 要设置的颜色。

• opa (int) – 颜色的不透明度。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_text_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.DEFAULT)

set_style_text_font(font, part)

设置textarea文本的字体。

参数:

• font (lv.font_t) – 要设置的字体。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_style_text_font(lv.font_montserrat_14, lv.PART.MAIN | lv.STATE.DEFAULT)

set_style_text_align(align, part)

设置 textarea 的文本对齐方式。

参数:

• align (int) – 要设置的对齐方式（例如，lv.TEXT_ALIGN.LEFT、lv.TEXT_ALIGN.CENTER）。

• part (int) – 要应用样式的对象部分（例如，lv.PART.MAIN）。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_style_text_align(lv.TEXT_ALIGN.LEFT, lv.PART.MAIN | lv.STATE.DEFAULT)

set_text(text)

设置textarea的文本内容。

参数:

text (str) – 要设置的文本。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_text("Hello World")
textarea_0.set_text("") # Clear the text content

get_text()

获取textarea当前的文本内容。

返回:

当前文本内容。

返回类型:

str

UiFlow2 代码块：

MicroPython 代码块：

text = textarea_0.get_text()

add_text(text)

将文本添加到文本框的当前内容。

参数:

text (str) – 要添加的文本。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.add_text(" Additional text")

set_max_length(length)

设置可在文本框中输入的文本的最大长度。

参数:

length (int) – 文本的最大长度。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_max_length(256)

set_password_mode(en)

设置文本框是否应处于密码模式（即字符被隐藏）。

参数:

en (bool) – True 表示启用密码模式，False 表示禁用。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_password_mode(True)

set_accepted_chars(chars)

设置文本框可接受的字符。只有这些字符才允许输入。

参数:

chars (str) – 可接受的字符串。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_accepted_chars("abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789")

set_pos(x, y)

设置文本框的位置。

参数:

• x (int) – 文本框的 x 坐标。

• y (int) – 文本框的 y 坐标。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_pos(100, 100)

set_x(x)

设置文本框的 x 坐标。

参数:

x (int) – 文本框的 x 坐标。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_x(100)

set_y(y)

设置文本框的 y 坐标。

参数:

y (int) – 文本框的 y 坐标。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_y(100)

align_to(obj, align, x, y)

将文本框与另一个对象对齐。

参数:

• obj (lv.obj) – 要对齐的对象。

• align (int) – 对齐类型。

• x (int) – 与对齐对象的 x 偏移量。

• y (int) – 与对齐对象的 y 偏移。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.align_to(page_0, lv.ALIGN.CENTER, 0, 0)

set_size(width, height)

设置文本框的大小。

参数:

• width (int) – 文本框的宽度。

• height (int) – 文本框的高度。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_size(200, 100)

set_width(width)

设置文本框的宽度。

参数:

width (int) – 文本框的宽度。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_width(200)

set_height(height)

设置文本框的高度。

参数:

height (int) – 文本框的高度。

返回:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_height(100)

get_width()

获取文本框的宽度。

返回:

文本框的宽度。

返回类型:

int

UiFlow2 代码块：

MicroPython 代码块：

width = textarea_0.get_width()

get_height()

获取文本框的高度。

返回:

文本框的高度。

返回类型:

int

UiFlow2 代码块：

MicroPython 代码块：

height = textarea_0.get_height()

set_one_line(en)

设置文本框是单行还是多行。

参数:

• text (bool) – 表示单行，表示多行。

• en (bool)

返回:

None

返回类型:

None

UiFlow2 代码块：

MicroPython 代码块：

textarea_0.set_one_line(True)