M5Button

M5Button 是一个可用于在用户界面中创建按钮的小部件。点击按钮时,按钮会触发相应的操作。

UiFlow2 应用示例

事件按钮

在 UiFlow2 中打开 cores3_button_event_example.m5f2 项目。

此示例创建一个按钮,单击时会触发一个事件。

UiFlow2 代码块:

cores3_button_event_example.png

示例输出:

None

MicroPython 应用示例

事件按钮

此示例创建一个按钮,单击时会触发一个事件。

MicroPython 代码块:

 1# SPDX-FileCopyrightText: 2025 M5Stack Technology CO LTD
 2#
 3# SPDX-License-Identifier: MIT
 4
 5import os, sys, io
 6import M5
 7from M5 import *
 8import m5ui
 9import lvgl as lv
10
11
12page0 = None
13button0 = None
14label0 = None
15
16
17def button0_pressed_event(event_struct):
18    global page0, button0, label0
19
20    label0.set_text(str("pressed"))
21
22
23def button0_released_event(event_struct):
24    global page0, button0, label0
25
26    label0.set_text(str("released"))
27
28
29def button0_event_handler(event_struct):
30    global page0, button0, label0
31    event = event_struct.code
32    if event == lv.EVENT.PRESSED and True:
33        button0_pressed_event(event_struct)
34    if event == lv.EVENT.RELEASED and True:
35        button0_released_event(event_struct)
36    return
37
38
39def setup():
40    global page0, button0, label0
41
42    M5.begin()
43    m5ui.init()
44    page0 = m5ui.M5Screen(bg_c=0xFFFFFF)
45    button0 = m5ui.M5Button(
46        text="click me",
47        x=117,
48        y=102,
49        bg_c=0x2196F3,
50        text_c=0xFFFFFF,
51        font=lv.font_montserrat_14,
52        parent=page0,
53    )
54    label0 = m5ui.M5Label(
55        "label0",
56        x=136,
57        y=33,
58        text_c=0x000000,
59        bg_c=0xFFFFFF,
60        bg_opa=0,
61        font=lv.font_montserrat_14,
62        parent=page0,
63    )
64
65    button0.add_event_cb(button0_event_handler, lv.EVENT.ALL, None)
66
67    page0.screen_load()
68
69
70def loop():
71    global page0, button0, label0
72    M5.update()
73
74
75if __name__ == "__main__":
76    try:
77        setup()
78        while True:
79            loop()
80    except (Exception, KeyboardInterrupt) as e:
81        try:
82            m5ui.deinit()
83            from utility import print_error_msg
84
85            print_error_msg(e)
86        except ImportError:
87            print("please update to latest firmware")

示例输出:

None

API参考

M5Button

class m5ui.button.M5Button(*args, **kwargs)

基类:button

创建一个按钮对象。

参数:
  • text (str) – 按钮上显示的文本。

  • x (int) – The x position of the button.

  • y (int) – 按钮的 y 位置。

  • w (int) – 按钮的宽度。设置为 0 时,按钮将自动调整大小以适合文本。

  • h (int) – 按钮的高度。设置为 0 时,按钮将自动调整大小以适应文本。

  • bg_c (int) – 按钮的背景颜色(十六进制格式)。

  • text_c (int) – 按钮的文本颜色(十六进制格式)。

  • font (lv.lv_font_t) – 按钮文本使用的字体。

  • parent (lv.obj) – 按钮所附加到的父对象。如果未指定,则按钮将附加到默认屏幕。

UiFlow2 代码块:

None

MicroPython 代码块:

from m5ui import M5Button
import lvgl as lv

m5ui.init()
button_0 = M5Button(text="Click Me", x=10, y=10, bg_c=0x2196F3, text_c=0xFFFFFF, parent=page0)
set_flag(flag, value)

在对象上设置一个标志。如果 value 为 True,则添加该标志;如果 value 为 False,则移除该标志。

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

  • value (bool) – 如果为 True,则添加标志;如果为 False,则删除标志。

返回:

None

UiFlow2 代码块:

set_flag.png

MicroPython 代码块:

button_0.set_flag(lv.obj.FLAG.HIDDEN, True)
toggle_flag(flag)

切换对象上的标志。如果设置了标志,则移除该标志;如果未设置,则添加该标志。

参数:

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

返回:

None

UiFlow2 代码块:

toggle_flag.png

MicroPython 代码块:

button_0.toggle_flag(lv.obj.FLAG.HIDDEN)
set_state(state, value)

设置按钮的状态。如果 value 为 True,则设置状态;如果为 False,则取消设置状态。

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

  • value (bool) – 如果为 True,则状态已设置;如果为 False,则状态未设置。

返回:

None

UiFlow2 代码块:

set_state.png

MicroPython 代码块:

button_0.set_state(lv.STATE.PRESSED, True)
toggle_state(state)

切换按钮的状态。如果按钮状态已设置,则表示未设置;如果按钮状态未设置,则表示已设置。

参数:

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

返回:

None

UiFlow2 代码块:

toggle_state.png

MicroPython 代码块:

button_0.toggle_state(lv.STATE.PRESSED)
set_style_text_font(font, part)

设置按钮文本的字体。

参数:
  • font (lv.lv_font_t) – 要设置的字体。

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

返回:

None

UiFlow2 代码块:

set_style_text_font.png

MicroPython 代码块:

button_0.set_style_text_font(lv.font_montserrat_14, lv.PART.MAIN | lv.STATE.DEFAULT)
set_text_color(color, opa, part)

设置按钮文本的颜色。

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

  • opa (int) – 颜色的不透明度。该值应介于 0(透明)和 255(不透明)之间。

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

返回:

None

UiFlow2 代码块:

set_text_color_pressed.png

set_text_color_released.png

MicroPython 代码块:

button_0.set_text_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.DEFAULT)
button_0.set_text_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.PRESSED)
set_bg_color(color, opa, part)

设置按钮的背景颜色。

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

  • opa (int) – 颜色的不透明度。该值应介于 0(透明)和 255(不透明)之间。

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

返回:

None

UiFlow2 代码块:

set_bg_color_pressed.png

set_bg_color_released.png

MicroPython 代码块:

button_0.set_bg_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.DEFAULT)
button_0.set_bg_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.PRESSED)
set_pos(x, y)

设置按钮的位置。

参数:
  • x (int) – 按钮的 x 坐标。

  • y (int) – 按钮的 y 坐标。

返回:

None

UiFlow2 代码块:

set_pos.png

MicroPython 代码块:

button_0.set_pos(100, 100)
set_x(x)

设置按钮的 x 坐标。

参数:

x (int) – 按钮的 x 坐标。

返回:

None

UiFlow2 代码块:

set_x.png

MicroPython 代码块:

button_0.set_x(100)
set_y(y)

设置按钮的 y 坐标。”

参数:

y (int) – 按钮的 y 坐标。

返回:

None

UiFlow2 代码块:

set_y.png

MicroPython 代码块:

button_0.set_y(100)
set_size(width, height)

设置按钮的大小。

参数:
  • width (int) – 按钮的宽度。

  • height (int) – 按钮的高度。

返回:

None

UiFlow2 代码块:

set_size.png

MicroPython 代码块:

button_0.set_size(100, 50)
set_width(width)

设置按钮的宽度。

参数:

width (int) – 按钮的宽度。

返回:

None

UiFlow2 代码块:

set_width.png

MicroPython 代码块:

button_0.set_width(100)
set_height(height)

设置按钮的高度。

参数:

height (int) – 按钮的高度。

返回:

None

UiFlow2 代码块:

set_height.png

MicroPython 代码块:

button_0.set_height(50)
align_to(obj, align, x, y)

将按钮与另一个对象对齐。

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

  • align (int) – 对齐类型。

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

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

返回:

None

UiFlow2 代码块:

align_to.png

MicroPython 代码块:

button_0.align_to(page_0, lv.ALIGN.CENTER, 0, 0)
set_style_radius(radius, part)

设置按钮的角半径。

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

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

返回:

None

UiFlow2 代码块:

set_style_radius.png

MicroPython 代码块:

button_0.set_style_radius(10, lv.PART.MAIN | lv.STATE.DEFAULT)
add_event_cb(handler, event, user_data)

为按钮添加事件回调。当指定事件发生时,将调用该回调。

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

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

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

返回:

None

UiFlow2 代码块:

event.png

MicroPython 代码块:

def button_0_pressed_event(event_struct):
    global button_0
    button_0.set_bg_color(0x000000, 255, 0)

def button_0_released_event(event_struct):
    global button_0
    button_0.set_bg_color(0xffffff, 255, 0)

def button_0_clicked_event(event_struct):
    global button_0
    button_0.set_bg_color(0x000000, 255, 0)

def button_0_event_handler(event_struct):
    global button_0
    event = event_struct.code
    if event == lv.EVENT.PRESSED and True:
        button_0_pressed_event(event_struct)
    if event == lv.EVENT.RELEASED and True:
        button_0_released_event(event_struct)
    if event == lv.EVENT.CLICKED and True:
        button_0_clicked_event(event_struct)
    if event == lv.EVENT.LONG_PRESSED and True:
        button_0_long_pressed_event(event_struct)
    return

page_0.add_event_cb(button_0_event_handler, lv.EVENT.ALL, None)
set_btn_text(text)

设置按钮的文本。

参数:

text (str) – 要在按钮上设置的文本。

返回类型:

None

UiFlow2 代码块:

set_btn_text.png

MicroPython 代码块:

button_0.set_btn_text("Click Me")
get_btn_text()

获取按钮的文本。

返回:

按钮的文本。

返回类型:

str

UiFlow2 代码块:

get_btn_text.png

MicroPython 代码块:
text = button_0.get_btn_text()