M5Window

M5Window 是一个可用于在用户界面中创建 window 的组件。

UiFlow2 示例

window 事件

在 UiFlow2 中打开 window_core2_example.m5f2 项目。

此示例创建一个 window 并将其与事件关联。

UiFlow2 代码块:

example.png

示例输出:

None

MicroPython 示例

window 事件

此示例创建一个 window 并将其与事件关联。

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
 13window0 = None
 14btn_lav = None
 15title_fmk = None
 16btn_nzk = None
 17btn_dkc = None
 18label_wgy = None
 19
 20
 21def btn_lav_clicked_event(event_struct):
 22    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 23
 24    label_wgy.set_text(str("Left Btn was clicked"))
 25
 26
 27def btn_nzk_clicked_event(event_struct):
 28    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 29
 30    label_wgy.set_text(str("Right Btn was clicked"))
 31
 32
 33def btn_dkc_clicked_event(event_struct):
 34    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 35
 36    window0.set_flag(lv.obj.FLAG.HIDDEN, True)
 37
 38
 39def btn_lav_event_handler(event_struct):
 40    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 41    event = event_struct.code
 42    if event == lv.EVENT.CLICKED and True:
 43        btn_lav_clicked_event(event_struct)
 44    return
 45
 46
 47def btn_nzk_event_handler(event_struct):
 48    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 49    event = event_struct.code
 50    if event == lv.EVENT.CLICKED and True:
 51        btn_nzk_clicked_event(event_struct)
 52    return
 53
 54
 55def btn_dkc_event_handler(event_struct):
 56    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 57    event = event_struct.code
 58    if event == lv.EVENT.CLICKED and True:
 59        btn_dkc_clicked_event(event_struct)
 60    return
 61
 62
 63def setup():
 64    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 65
 66    M5.begin()
 67    Widgets.setRotation(1)
 68    m5ui.init()
 69    page0 = m5ui.M5Page(bg_c=0xFFFFFF)
 70    window0 = m5ui.M5Win(x=0, y=0, w=320, h=240, parent=page0)
 71    btn_lav = window0.add_button(icon=lv.SYMBOL.LEFT, w=40)
 72    title_fmk = window0.add_title("This is a window")
 73    btn_nzk = window0.add_button(icon=lv.SYMBOL.RIGHT, w=40)
 74    btn_dkc = window0.add_button(icon=lv.SYMBOL.CLOSE, w=60)
 75    label_wgy = window0.add_text("This is label_wgy", x=0, y=0)
 76
 77    btn_lav.add_event_cb(btn_lav_event_handler, lv.EVENT.ALL, None)
 78    btn_nzk.add_event_cb(btn_nzk_event_handler, lv.EVENT.ALL, None)
 79    btn_dkc.add_event_cb(btn_dkc_event_handler, lv.EVENT.ALL, None)
 80
 81    page0.screen_load()
 82
 83
 84def loop():
 85    global page0, window0, btn_lav, title_fmk, btn_nzk, btn_dkc, label_wgy
 86    M5.update()
 87
 88
 89if __name__ == "__main__":
 90    try:
 91        setup()
 92        while True:
 93            loop()
 94    except (Exception, KeyboardInterrupt) as e:
 95        try:
 96            m5ui.deinit()
 97            from utility import print_error_msg
 98
 99            print_error_msg(e)
100        except ImportError:
101            print("please update to latest firmware")

示例输出:

None

API参考

M5Win

class m5ui.win.M5Win(*args, **kwargs)

基类:win

创建一个 window 对象。

参数:
  • x (int) – window 的 x 坐标位置。

  • y (int) – window 的 y 坐标位置。

  • w (int) – window 的宽度。

  • h (int) – window 的高度。

  • parent (lv.obj) – window 要附加到的父对象。如果未指定,则 window 会附加到默认屏幕。

UiFlow2 代码块:

None

MicroPython 代码块:

from m5ui import M5Win
import lvgl as lv

m5ui.init()
win0 = M5Win(x=120, y=80, w=60, h=30, parent=page0)
delete()

从 window 中删除项目。

UiFlow2 代码块:

label_delete.png

button_delete.png

title_delete.png

MicroPython 代码块:

label_0.delete()

button_0.delete()

text_0.delete()
set_text(txt)

设置 window 按钮/标签/标题的文本。

参数:

txt (str) – 要为 window 按钮/标签/标题设置的文本。

返回:

None

UiFlow2 代码块:

button_set_text.png

label_set_text.png

title_set_text.png

MicroPython 代码块:

button_0.set_text("Select an option")

label_0.set_text("M5Stack")

title_0.set_text("Hello M5Stack")
set_style_text_font(font, part)

设置 window 按钮文本的字体。

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

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

返回:

None

UiFlow2 代码块:

button_set_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)

设置 window 按钮/标签/标题的颜色。

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

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

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

返回:

None

UiFlow2 代码块:

button_set_text_color.png

label_set_text_color.png

title_set_text_color.png

MicroPython 代码块:

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

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

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

设置 window 按钮/标签/标题的背景颜色。

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

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

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

返回:

None

UiFlow2 代码块:

button_set_bg_color.png

label_set_bg_color.png

title_set_bg_color.png

MicroPython 代码块:

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

label_0.set_bg_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.DEFAULT)

title_0.set_bg_color(lv.color_hex(0x000000), 255, lv.PART.MAIN | lv.STATE.DEFAULT)
set_long_mode(mode)

设置 window 标签/标题的长文本模式。

参数:

mode (int) – 要设置的长文本模式。

UiFlow2 代码块:

label_set_long_mode.png

title_set_long_mode.png

MicroPython 代码块:

label_0.set_long_mode(lv.label.LONG_MODE.WRAP)
set_flag(flag, value)

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

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

  • value (bool) – 为 True 时添加标志,为 False 时移除标志。

UiFlow2 代码块:

button_set_flag.png

label_set_flag.png

title_set_flag.png

MicroPython 代码块:

window_0.set_flag(lv.obj.FLAG.HIDDEN, True)
set_pos(x, y)

设置 window 的位置。

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

  • y (int) – window 的 y 坐标。

UiFlow2 代码块:

set_pos.png

MicroPython 代码块:

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

设置 window 的 x 坐标。

参数:

x (int) – window 的 x 坐标。

UiFlow2 代码块:

set_x.png

MicroPython 代码块:

window_0.set_x(100)
set_y(y)

设置 window 的 y 坐标。

参数:

y (int) – window 的 y 坐标。

UiFlow2 代码块:

set_y.png

MicroPython 代码块:

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

设置 window 的尺寸。

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

  • height (int) – window 的高度。

返回:

None

UiFlow2 代码块:

set_size.png

MicroPython 代码块:

window_0.set_size(100, 50)
align_to(obj, align, x, y)

将 window 对齐到其他对象。

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

  • align (int) – 对齐方式类型。

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

  • y (int) – 相对于对齐对象的 y 偏移量。

UiFlow2 代码块:

align_to.png

MicroPython 代码块:

window_0.align_to(page_0, lv.ALIGN.CENTER, 0, 0)
set_state(state, value)

设置进度条的状态。如果 value 为 True,则设置状态;为 False 时取消状态。

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

  • value (bool) – 为 True 时设置状态;为 False 时取消状态。

返回:

None

UiFlow2 代码块:

button_set_state.png

MicroPython 代码块:

window_0.set_state(lv.STATE.PRESSED, True)
toggle_flag(flag)

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

参数:

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

返回:

None

UiFlow2 代码块:

button_toggle_flag.png

MicroPython 代码块:

window_0.toggle_flag(lv.obj.FLAG.HIDDEN)
set_style_radius(radius, part)

设置 window 按钮的圆角半径。

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

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

返回:

None

UiFlow2 代码块:

button_set_radius.png

MicroPython 代码块:

button_0.set_style_radius(10, lv.PART.MAIN | lv.STATE.DEFAULT)
set_shadow(color, opa, align, offset_x, offset_y)

为标签/标题设置阴影。

参数:
  • color (int) – 阴影的颜色,十六进制格式或整数。

  • opa (int) – 阴影的不透明度(0-255)。

  • align (int) – 阴影相对于标签/标题的对齐方式。

  • offset_x (int) – 阴影的水平偏移量。

  • offset_y (int) – 阴影的垂直偏移量。

返回:

None

UiFlow2 代码块:

label_set_shadow.png

title_set_shadow.png

MicroPython 代码块:

label_0.set_shadow(color=0x000000, opa=128, align=lv.ALIGN.BOTTOM_RIGHT, offset_x=5, offset_y=5)
unset_shadow()

移除标签/标题的阴影。

UiFlow2 代码块:

label_unset_shadow.png

title_unset_shadow.png

MicroPython 代码块:

label_0.unset_shadow()
get_text()

获取按钮/标签/标题的文本。

返回:

按钮/标签/标题的文本。

返回类型:

str

UiFlow2 代码块:

button_get_text.png

label_get_text.png

title_get_text.png

MicroPython 代码块:

button_0.get_text()

label_0.get_text()

text_0.get_text()
toggle_state(state)

切换按钮的状态。如果该状态已设置则取消设置,未设置则添加设置。

参数:

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

返回:

None

UiFlow2 代码块:

button_toggle_state.png

MicroPython 代码块:

button_0.toggle_state(lv.STATE.PRESSED)
add_event_cb(handler, event, user_data)

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

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

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

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

返回:

None

UiFlow2 代码块:

button_event.png

MicroPython 代码块:

def btn_ono_clicked_event(event_struct):
    global page0, window_0, label_lkg, btn_ono, btn_pjm, label0

    print('hello M5')


def btn_ono_event_handler(event_struct):
    global page0, window_0, label_lkg, btn_ono, btn_pjm, label0
    event = event_struct.code
    if event == lv.EVENT.CLICKED and True:
        btn_ono_clicked_event(event_struct)
    return

btn_ono.add_event_cb(btn_ono_event_handler, lv.EVENT.ALL, None)
add_title(text, text_c=2171169, text_opa=255, bg_c=14737632, bg_opa=255, font=lvgl.font_montserrat_14)

向 window 添加标题标签。

参数:
  • text (str) – 要在 window 上显示的文本。

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

  • text_opa (int) – 标签文本的不透明度(0-255)。

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

  • bg_opa (int) – 标签背景的不透明度(0-255)。

  • font (lv.font) – 用于标签的字体。

返回:

创建的标签对象 m5ui.M5Label

返回类型:

lv.obj

UiFlow2 代码块:

add_title.png

add_title2.png

MicroPython 代码块:

win0.add_title("A title", text_c=0x212121, text_opa=255, bg_c=0xE0E0E0, bg_opa=255, font=lv.font_montserrat_14)
add_text(text, x=0, y=0, text_c=2171169, text_opa=255, bg_c=16185078, bg_opa=255, font=lvgl.font_montserrat_14)

向 window 添加文本标签。

参数:
  • text (str) – 要在 window 上显示的文本。

  • x (int) – 标签的 x 坐标位置。

  • y (int) – 标签的 y 坐标位置。

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

  • text_opa (int) – 标签文本的不透明度(0-255)。

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

  • bg_opa (int) – 标签背景的不透明度(0-255)。

  • font (lv.font) – 用于标签的字体。

返回:

创建的标签对象 m5ui.M5Label

返回类型:

lv.obj

UiFlow2 代码块:

add_text.png

add_text2.png

MicroPython 代码块:

win0.add_text("A title", text_c=0x212121, text_opa=255, bg_c=0xF6F6F6, bg_opa=255, font=lv.font_montserrat_14)
add_button(icon=None, text='', w=80, bg_c=2201331, bg_opa=255, text_c=16777215, text_opa=255, font=lvgl.font_montserrat_14)

向 window 添加按钮。

参数:
  • icon (int) – 按钮上要显示的图标。

  • text (str) – 按钮上要显示的文本。

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

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

  • bg_opa (int) – 按钮背景的不透明度(0-255)。

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

  • text_opa (int) – 按钮文本的不透明度(0-255)。

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

返回:

创建的按钮对象 m5ui.M5Button

返回类型:

lv.obj

UiFlow2 代码块:

add_button.png

add_button2.png

MicroPython 代码块:

win0.add_button(icon=lv.SYMBOL.BULLET, text_c=0xffffff, text_opa=255, bg_c=0x2196f3, bg_opa=255, font=lv.font_montserrat_14)

win0.add_button(text='M5', text_c=0xffffff, text_opa=255, bg_c=0x2196f3, bg_opa=255, font=lv.font_montserrat_14)