滑块

例程

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import lvgl as lv
import lvgl_helper as lv_h
import lcd
import time
from machine import Timer
import touchscreen as ts

lcd.init()
ts.init()
lv.init()

disp_buf1 = lv.disp_buf_t()
buf1_1 = bytearray(320*10)
lv.disp_buf_init(disp_buf1,buf1_1, None, len(buf1_1)//4)
disp_drv = lv.disp_drv_t()
lv.disp_drv_init(disp_drv)
disp_drv.buffer = disp_buf1
disp_drv.flush_cb = lv_h.flush
disp_drv.hor_res = 320
disp_drv.ver_res = 240
lv.disp_drv_register(disp_drv)

indev_drv = lv.indev_drv_t()
lv.indev_drv_init(indev_drv)
indev_drv.type = lv.INDEV_TYPE.POINTER
indev_drv.read_cb = lv_h.read
lv.indev_drv_register(indev_drv)

def on_slider_changed(self, obj=None, event=-1):
    slider_value = slider.get_value()
    textView.set_text("Value: %d" % (slider_value))
    print("slider:", slider_value)

scr = lv.obj()
slider = lv.slider(scr)
slider.align(lv.scr_act(), lv.ALIGN.CENTER, 0, 0)
slider.set_width(200)
slider.set_height(30)
slider.set_range(0, 100)
slider.set_value(0, 0)
slider.set_event_cb(on_slider_changed)

textView = lv.label(scr)
textView.align(lv.scr_act(), lv.ALIGN.CENTER, -50, -50)
textView.set_text("Value:0")

lv.scr_load(scr)

tim = time.ticks_ms()
while True:
    if time.ticks_ms()-tim > 5:
        tim = time.ticks_ms()
        lv.task_handler()
        lv.tick_inc(5)

实验准备

  1. 将 野火K210 AI视觉相机 连接到 CanMV IDE

  2. 执行程序

运行结果

1.运行程序后，可以看到 野火K210 AI视觉相机 会显示下面内容

野火logo

2.按住白色小方块，往右边拖，可以看到下面内容

野火logo

3.按住白色小方块，再往右边拖，可以看到下面内容

野火logo

讲解

1
2
3
4
5
6
import lvgl as lv
import lvgl_helper as lv_h
import lcd
import time
from machine import Timer
import touchscreen as ts

  • 这些库提供了LVGL框架、LCD显示、触摸屏支持和一些辅助函数。

1
2
3
lcd.init()
ts.init()
lv.init()

  • 这三行代码分别初始化了LCD显示、触摸屏和LVGL库

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
disp_buf1 = lv.disp_buf_t()
buf1_1 = bytearray(320*10)
lv.disp_buf_init(disp_buf1,buf1_1, None, len(buf1_1)//4)
disp_drv = lv.disp_drv_t()
lv.disp_drv_init(disp_drv)
disp_drv.buffer = disp_buf1
disp_drv.flush_cb = lv_h.flush
disp_drv.hor_res = 320
disp_drv.ver_res = 240
lv.disp_drv_register(disp_drv)

  • 这些代码创建了一个显示缓冲区disp_buf1，并设置了一个显示驱动程序disp_drv，包括缓冲区、刷新回调函数、水平分辨率和垂直分辨率。

1
2
3
4
5
indev_drv = lv.indev_drv_t()
lv.indev_drv_init(indev_drv)
indev_drv.type = lv.INDEV_TYPE.POINTER
indev_drv.read_cb = lv_h.read
lv.indev_drv_register(indev_drv)

  • 这些代码创建并初始化了一个输入设备驱动程序对象indev_drv，用于处理触摸屏输入。

1
2
3
4
def on_slider_changed(self, obj=None, event=-1):
    slider_value = slider.get_value()
    textView.set_text("Value: %d" % (slider_value))
    print("slider:", slider_value)

  • 当滑块的值发生变化时，这个函数会被调用，它获取滑块的新值，并更新标签textView的文本以显示这个值。

1
2
3
4
5
6
7
8
scr = lv.obj()
slider = lv.slider(scr)
slider.align(lv.scr_act(), lv.ALIGN.CENTER, 0, 0)
slider.set_width(200)
slider.set_height(30)
slider.set_range(0, 100)
slider.set_value(0, 0)
slider.set_event_cb(on_slider_changed)

  • 这些代码创建了一个滑块和一个标签，将它们放置在屏幕上，并设置了它们的属性和回调函数。

1
2
3
textView = lv.label(scr)
textView.align(lv.scr_act(), lv.ALIGN.CENTER, -50, -50)
textView.set_text("Value:0")

  • 这些代码创建了一个滑块和一个标签，将它们放置在屏幕上，并设置了它们的属性和回调函数。

1
2
3
4
5
6
7
lv.scr_load(scr)
tim = time.ticks_ms()
while True:
    if time.ticks_ms()-tim > 5:
        tim = time.ticks_ms()
        lv.task_handler()
        lv.tick_inc(5)

  • 这段代码加载了屏幕，并进入了一个无限循环。循环中，它每隔5毫秒调用lv.task_handler()来处理LVGL的任务，并使用lv.tick_inc(5)来通知LVGL时间已经过去了5毫秒，这样可以更新屏幕和其他LVGL相关的任务。