├── LICENSE ├── README.md ├── anim ├── lv_example_anim_1.py ├── lv_example_anim_2.py ├── lv_example_anim_3.py └── lv_example_anim_timeline_1.py ├── assets ├── animimg001.png ├── animimg002.png ├── animimg003.png ├── font │ ├── font-PHT-cn-20.fnt │ ├── font-PHT-en-20.fnt │ ├── font-PHT-jp-20.fnt │ ├── lv_font_simsun_16_cjk.fnt │ ├── montserrat-10.fnt │ ├── montserrat-12.fnt │ ├── montserrat-14.fnt │ ├── montserrat-16.fnt │ ├── montserrat-18.fnt │ ├── montserrat-20.fnt │ ├── montserrat-22.fnt │ ├── montserrat-24.fnt │ ├── montserrat-26.fnt │ ├── montserrat-28.fnt │ ├── montserrat-30.fnt │ ├── montserrat-32.fnt │ ├── montserrat-34.fnt │ ├── montserrat-38.fnt │ ├── montserrat-40.fnt │ ├── montserrat-42.fnt │ ├── montserrat-44.fnt │ ├── montserrat-46.fnt │ └── montserrat-48.fnt ├── img_caret_down.png ├── img_cogwheel_argb.png ├── img_hand_hour.png ├── img_hand_min.png ├── img_skew_strip.png ├── img_skew_strip_80x20_argb8888.bin ├── img_star.png ├── imgbtn_left.png ├── imgbtn_mid.png ├── imgbtn_right.png ├── skew_strip.png └── star.png ├── event ├── lv_example_event_1.py ├── lv_example_event_2.py └── lv_example_event_3.py ├── get_started ├── lv_example_get_started_1.py ├── lv_example_get_started_2.py └── lv_example_get_started_3.py ├── layouts ├── flex │ ├── lv_example_flex_1.py │ ├── lv_example_flex_2.py │ ├── lv_example_flex_3.py │ ├── lv_example_flex_4.py │ ├── lv_example_flex_5.py │ └── lv_example_flex_6.py └── grid │ ├── lv_example_grid_1.py │ ├── lv_example_grid_2.py │ ├── lv_example_grid_3.py │ ├── lv_example_grid_4.py │ ├── lv_example_grid_5.py │ └── lv_example_grid_6.py ├── libs ├── bmp │ ├── example_16bit.bmp │ ├── example_24bit.bmp │ ├── example_32bit.bmp │ └── lv_example_bmp_1.py ├── ffmpeg │ ├── birds.mp4 │ ├── ffmpeg.png │ ├── lv_example_ffmpeg_1.py │ ├── lv_example_ffmpeg_2.py │ └── lv_ffmpeg.c ├── freetype │ ├── arial.ttf │ └── lv_example_freetype_1.py ├── gif │ ├── bulb.gif │ ├── img_bulb_gif.py │ └── lv_example_gif_1.py ├── png │ ├── img_wink_png.py │ ├── lv_example_png_1.py │ └── wink.png ├── qrcode │ └── lv_example_qrcode_1.py ├── rlottie │ ├── lv_example_rlottie_1.py │ ├── lv_example_rlottie_2.py │ ├── lv_example_rlottie_approve.json │ └── lv_example_rlottie_approve.py └── sjpg │ ├── lv_example_sjpg_1.py │ └── small_image.sjpg ├── others ├── fragment │ ├── index.rst │ ├── lv_example_fragment.h │ ├── lv_example_fragment_1.c │ ├── lv_example_fragment_1.py │ └── lv_example_fragment_2.c ├── gridnav │ ├── lv_example_gridnav_1.py │ ├── lv_example_gridnav_2.py │ ├── lv_example_gridnav_3.py │ └── lv_example_gridnav_4.py ├── ime │ ├── index.rst │ ├── lv_example_ime_pinyin.h │ ├── lv_example_ime_pinyin_1.c │ └── lv_example_ime_pinyin_2.c ├── imgfont │ ├── index.rst │ ├── lv_example_imgfont.h │ └── lv_example_imgfont_1.c ├── lv_example_others.h ├── monkey │ ├── index.rst │ ├── lv_example_monkey.h │ ├── lv_example_monkey_1.c │ ├── lv_example_monkey_2.c │ └── lv_example_monkey_3.c ├── msg │ ├── lv_example_msg_1.py │ ├── lv_example_msg_2.py │ └── lv_example_msg_3.py └── snapshot │ ├── index.rst │ ├── lv_example_snapshot.h │ ├── lv_example_snapshot_1.c │ └── lv_example_snapshot_1.py ├── scroll ├── lv_example_scroll_1.py ├── lv_example_scroll_2.py ├── lv_example_scroll_3.py ├── lv_example_scroll_4.py ├── lv_example_scroll_5.py └── lv_example_scroll_6.py ├── styles ├── lv_example_style_1.py ├── lv_example_style_10.py ├── lv_example_style_11.py ├── lv_example_style_12.py ├── lv_example_style_13.py ├── lv_example_style_14.py ├── lv_example_style_2.py ├── lv_example_style_3.py ├── lv_example_style_4.py ├── lv_example_style_5.py ├── lv_example_style_6.py ├── lv_example_style_7.py ├── lv_example_style_8.py └── lv_example_style_9.py └── widgets ├── animimg └── lv_example_animimg_1.py ├── arc ├── lv_example_arc_1.py └── lv_example_arc_2.py ├── bar ├── images │ ├── Makefile │ ├── img_skew_strip │ ├── img_skew_strip.c │ ├── img_skew_strip_80x20_argb8888.bin │ └── skew_strip.png ├── lv_example_bar_1.py ├── lv_example_bar_2.py ├── lv_example_bar_3.py ├── lv_example_bar_4.py ├── lv_example_bar_5.py └── lv_example_bar_6.py ├── btn ├── lv_example_btn_1.py ├── lv_example_btn_2.py └── lv_example_btn_3.py ├── btnmatrix ├── lv_example_btnmatrix_1.py ├── lv_example_btnmatrix_2.py └── lv_example_btnmatrix_3.py ├── calendar └── lv_example_calendar_1.py ├── canvas ├── lv_example_canvas_1.py └── lv_example_canvas_2.py ├── chart ├── lv_example_chart_1.py ├── lv_example_chart_2.py ├── lv_example_chart_3.py ├── lv_example_chart_4.py ├── lv_example_chart_5.py ├── lv_example_chart_6.py ├── lv_example_chart_7.py └── lv_example_chart_9.py ├── checkbox └── lv_example_checkbox_1.py ├── colorwheel └── lv_example_colorwheel_1.py ├── dropdown ├── images │ ├── Makefile │ ├── img_caret_down │ ├── img_caret_down.c │ ├── img_caret_down_13x8_argb8888.bin │ └── img_caret_down_13x8_argb8888.png ├── lv_example_dropdown_1.py ├── lv_example_dropdown_2.py └── lv_example_dropdown_3.py ├── img ├── lv_example_img_1.py ├── lv_example_img_2.py ├── lv_example_img_3.py └── lv_example_img_4.py ├── imgbtn └── lv_example_imgbtn_1.py ├── keyboard └── lv_example_keyboard_1.py ├── label ├── lv_example_label_1.py ├── lv_example_label_2.py ├── lv_example_label_3.py ├── lv_example_label_4.c ├── lv_example_label_4.py ├── lv_example_label_5.py └── lv_example_label_6.py ├── led └── lv_example_led_1.py ├── line └── lv_example_line_1.py ├── list └── lv_example_list_1.py ├── meter ├── lv_example_meter_1.py ├── lv_example_meter_2.py ├── lv_example_meter_3.py └── lv_example_meter_4.py ├── msgbox └── lv_example_msgbox_1.py ├── obj ├── lv_example_obj_1.py └── lv_example_obj_2.py ├── roller ├── lv_example_roller_1.py ├── lv_example_roller_2.py └── lv_example_roller_3.py ├── slider ├── lv_example_slider_1.py ├── lv_example_slider_2.py └── lv_example_slider_3.py ├── span └── lv_example_span_1.py ├── spinbox └── lv_example_spinbox_1.py ├── spinner └── lv_example_spinner_1.py ├── switch └── lv_example_switch_1.py ├── table ├── lv_example_table_1.py └── lv_example_table_2.py ├── tabview ├── lv_example_tabview_1.py └── lv_example_tabview_2.py ├── textarea ├── lv_example_textarea_1.py ├── lv_example_textarea_2.py └── lv_example_textarea_3.py ├── tileview └── lv_example_tileview_1.py └── win └── lv_example_win_1.py /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Uli Raich 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # lv_mpy_examples_v8 2 | MicroPython examples for lvgl v8 3 | -------------------------------------------------------------------------------- /anim/lv_example_anim_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def anim_x_cb(label, v): 7 | label.set_x(v) 8 | 9 | def sw_event_cb(e,label): 10 | sw = e.get_target() 11 | 12 | if sw.has_state(lv.STATE.CHECKED): 13 | a = lv.anim_t() 14 | a.init() 15 | a.set_var(label) 16 | a.set_values(label.get_x(), 100) 17 | a.set_time(500) 18 | a.set_path_cb(lv.anim_t.path_overshoot) 19 | a.set_custom_exec_cb(lambda a,val: anim_x_cb(label,val)) 20 | lv.anim_t.start(a) 21 | else: 22 | a = lv.anim_t() 23 | a.init() 24 | a.set_var(label) 25 | a.set_values(label.get_x(), -label.get_width()) 26 | a.set_time(500) 27 | a.set_path_cb(lv.anim_t.path_ease_in) 28 | a.set_custom_exec_cb(lambda a,val: anim_x_cb(label,val)) 29 | lv.anim_t.start(a) 30 | 31 | # 32 | # Start animation on an event 33 | # 34 | 35 | label = lv.label(lv.scr_act()) 36 | label.set_text("Hello animations!") 37 | label.set_pos(100, 10) 38 | 39 | 40 | sw = lv.switch(lv.scr_act()) 41 | sw.center() 42 | sw.add_state(lv.STATE.CHECKED) 43 | sw.add_event_cb(lambda e: sw_event_cb(e,label), lv.EVENT.VALUE_CHANGED, None) 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /anim/lv_example_anim_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | 7 | def anim_x_cb(obj, v): 8 | obj.set_x(v) 9 | 10 | def anim_size_cb(obj, v): 11 | obj.set_size(v, v) 12 | 13 | 14 | # 15 | # Create a playback animation 16 | # 17 | obj = lv.obj(lv.scr_act()) 18 | obj.set_style_bg_color(lv.palette_main(lv.PALETTE.RED), 0) 19 | obj.set_style_radius(lv.RADIUS.CIRCLE, 0) 20 | 21 | obj.align(lv.ALIGN.LEFT_MID, 10, 0) 22 | 23 | a1 = lv.anim_t() 24 | a1.init() 25 | a1.set_var(obj) 26 | a1.set_values(10, 50) 27 | a1.set_time(1000) 28 | a1.set_playback_delay(100) 29 | a1.set_playback_time(300) 30 | a1.set_repeat_delay(500) 31 | a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 32 | a1.set_path_cb(lv.anim_t.path_ease_in_out) 33 | a1.set_custom_exec_cb(lambda a1,val: anim_size_cb(obj,val)) 34 | lv.anim_t.start(a1) 35 | 36 | a2 = lv.anim_t() 37 | a2.init() 38 | a2.set_var(obj) 39 | a2.set_values(10, 240) 40 | a2.set_time(1000) 41 | a2.set_playback_delay(100) 42 | a2.set_playback_time(300) 43 | a2.set_repeat_delay(500) 44 | a2.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 45 | a2.set_path_cb(lv.anim_t.path_ease_in_out) 46 | a2.set_custom_exec_cb(lambda a1,val: anim_x_cb(obj,val)) 47 | lv.anim_t.start(a2) 48 | -------------------------------------------------------------------------------- /assets/animimg001.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/animimg001.png -------------------------------------------------------------------------------- /assets/animimg002.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/animimg002.png -------------------------------------------------------------------------------- /assets/animimg003.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/animimg003.png -------------------------------------------------------------------------------- /assets/font/font-PHT-cn-20.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/font-PHT-cn-20.fnt -------------------------------------------------------------------------------- /assets/font/font-PHT-en-20.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/font-PHT-en-20.fnt -------------------------------------------------------------------------------- /assets/font/font-PHT-jp-20.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/font-PHT-jp-20.fnt -------------------------------------------------------------------------------- /assets/font/lv_font_simsun_16_cjk.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/lv_font_simsun_16_cjk.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-10.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-10.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-12.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-12.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-14.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-14.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-16.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-16.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-18.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-18.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-20.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-20.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-22.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-22.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-24.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-24.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-26.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-26.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-28.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-28.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-30.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-30.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-32.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-32.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-34.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-34.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-38.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-38.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-40.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-40.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-42.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-42.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-44.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-44.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-46.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-46.fnt -------------------------------------------------------------------------------- /assets/font/montserrat-48.fnt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/font/montserrat-48.fnt -------------------------------------------------------------------------------- /assets/img_caret_down.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/img_caret_down.png -------------------------------------------------------------------------------- /assets/img_cogwheel_argb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/img_cogwheel_argb.png -------------------------------------------------------------------------------- /assets/img_hand_hour.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/img_hand_hour.png -------------------------------------------------------------------------------- /assets/img_hand_min.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/img_hand_min.png -------------------------------------------------------------------------------- /assets/img_skew_strip.png: -------------------------------------------------------------------------------- 1 | skew_strip.png -------------------------------------------------------------------------------- /assets/img_skew_strip_80x20_argb8888.bin: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/img_skew_strip_80x20_argb8888.bin -------------------------------------------------------------------------------- /assets/img_star.png: -------------------------------------------------------------------------------- 1 | star.png -------------------------------------------------------------------------------- /assets/imgbtn_left.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/imgbtn_left.png -------------------------------------------------------------------------------- /assets/imgbtn_mid.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/imgbtn_mid.png -------------------------------------------------------------------------------- /assets/imgbtn_right.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/imgbtn_right.png -------------------------------------------------------------------------------- /assets/skew_strip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/skew_strip.png -------------------------------------------------------------------------------- /assets/star.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/assets/star.png -------------------------------------------------------------------------------- /event/lv_example_event_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | class Event_1(): 7 | def __init__(self): 8 | self.cnt = 1 9 | # 10 | # Add click event to a button 11 | # 12 | 13 | btn = lv.btn(lv.scr_act()) 14 | btn.set_size(100, 50) 15 | btn.center() 16 | btn.add_event_cb(self.event_cb, lv.EVENT.CLICKED, None) 17 | 18 | label = lv.label(btn) 19 | label.set_text("Click me!"); 20 | label.center() 21 | 22 | def event_cb(self,e): 23 | print("Clicked"); 24 | 25 | btn = lv.btn.__cast__(e.get_target()) 26 | label = btn.get_child(0) 27 | label.set_text(str(self.cnt)) 28 | self.cnt += 1 29 | 30 | evt1 = Event_1() 31 | -------------------------------------------------------------------------------- /event/lv_example_event_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_cb(e,label): 7 | code = e.get_code() 8 | if code == lv.EVENT.PRESSED: 9 | label.set_text("The last button event:\nLV_EVENT_PRESSED") 10 | elif code == lv.EVENT.CLICKED: 11 | label.set_text("The last button event:\nLV_EVENT_CLICKED") 12 | elif code == lv.EVENT.LONG_PRESSED: 13 | label.set_text("The last button event:\nLV_EVENT_LONG_PRESSED") 14 | elif code == lv.EVENT.LONG_PRESSED_REPEAT: 15 | label.set_text("The last button event:\nLV_EVENT_LONG_PRESSED_REPEAT") 16 | btn = lv.btn(lv.scr_act()) 17 | btn.set_size(100, 50) 18 | btn.center() 19 | 20 | btn_label = lv.label(btn) 21 | btn_label.set_text("Click me!") 22 | btn_label.center() 23 | 24 | info_label = lv.label(lv.scr_act()) 25 | info_label.set_text("The last button event:\nNone"); 26 | 27 | btn.add_event_cb(lambda e: event_cb(e,info_label), lv.EVENT.ALL, None) 28 | -------------------------------------------------------------------------------- /event/lv_example_event_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_cb(e): 7 | 8 | # The original target of the event. Can be the buttons or the container 9 | target = e.get_target() 10 | # print(type(target)) 11 | 12 | # If container was clicked do nothing 13 | if type(target) != type(lv.btn()): 14 | return 15 | 16 | # Make the clicked buttons red 17 | target.set_style_bg_color(lv.palette_main(lv.PALETTE.RED), 0) 18 | 19 | # 20 | # Demonstrate event bubbling 21 | # 22 | 23 | cont = lv.obj(lv.scr_act()) 24 | cont.set_size(320, 200) 25 | cont.center() 26 | cont.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 27 | 28 | for i in range(30): 29 | btn = lv.btn(cont) 30 | btn.set_size(80, 50) 31 | btn.add_flag(lv.obj.FLAG.EVENT_BUBBLE) 32 | 33 | label = lv.label(btn) 34 | label.set_text(str(i)) 35 | label.center() 36 | cont.add_event_cb(event_cb, lv.EVENT.CLICKED, None) 37 | -------------------------------------------------------------------------------- /get_started/lv_example_get_started_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | class CounterBtn(): 7 | def __init__(self): 8 | self.cnt = 0 9 | # 10 | # Create a button with a label and react on click event. 11 | # 12 | 13 | btn = lv.btn(lv.scr_act()) # Add a button the current screen 14 | btn.set_pos(10, 10) # Set its position 15 | btn.set_size(120, 50) # Set its size 16 | btn.align(lv.ALIGN.CENTER,0,0) 17 | btn.add_event_cb(self.btn_event_cb, lv.EVENT.ALL, None) # Assign a callback to the button 18 | label = lv.label(btn) # Add a label to the button 19 | label.set_text("Button") # Set the labels text 20 | label.center() 21 | 22 | def btn_event_cb(self,evt): 23 | code = evt.get_code() 24 | btn = evt.get_target() 25 | if code == lv.EVENT.CLICKED: 26 | self.cnt += 1 27 | 28 | # Get the first child of the button which is the label and change its text 29 | label = lv.label.__cast__(btn.get_child(0)) 30 | label.set_text("Button: " + str(self.cnt)) 31 | 32 | 33 | counterBtn = CounterBtn() 34 | 35 | -------------------------------------------------------------------------------- /get_started/lv_example_get_started_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | import time 5 | 6 | # 7 | # Create styles from scratch for buttons. 8 | # 9 | style_btn = lv.style_t() 10 | style_btn_red = lv.style_t() 11 | style_btn_pressed = lv.style_t() 12 | 13 | # Create a simple button style 14 | style_btn.init() 15 | style_btn.set_radius(10) 16 | style_btn.set_bg_opa(lv.OPA.COVER) 17 | style_btn.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3)) 18 | style_btn.set_bg_grad_color(lv.palette_main(lv.PALETTE.GREY)) 19 | style_btn.set_bg_grad_dir(lv.GRAD_DIR.VER) 20 | 21 | # Add a border 22 | style_btn.set_border_color(lv.color_white()) 23 | style_btn.set_border_opa(lv.OPA._70) 24 | style_btn.set_border_width(2) 25 | 26 | # Set the text style 27 | style_btn.set_text_color(lv.color_white()) 28 | 29 | # Create a red style. Change only some colors. 30 | style_btn_red.init() 31 | style_btn_red.set_bg_color(lv.palette_main(lv.PALETTE.RED)) 32 | style_btn_red.set_bg_grad_color(lv.palette_lighten(lv.PALETTE.RED, 2)) 33 | 34 | # Create a style for the pressed state. 35 | style_btn_pressed.init() 36 | style_btn_pressed.set_bg_color(lv.palette_main(lv.PALETTE.BLUE)) 37 | style_btn_pressed.set_bg_grad_color(lv.palette_darken(lv.PALETTE.RED, 3)) 38 | 39 | # Create a button and use the new styles 40 | btn = lv.btn(lv.scr_act()) # Add a button the current screen 41 | # Remove the styles coming from the theme 42 | # Note that size and position are also stored as style properties 43 | # so lv_obj_remove_style_all will remove the set size and position too 44 | btn.remove_style_all() # Remove the styles coming from the theme 45 | btn.set_pos(10, 10) # Set its position 46 | btn.set_size(120, 50) # Set its size 47 | btn.add_style(style_btn, 0) 48 | btn.add_style(style_btn_pressed, lv.STATE.PRESSED) 49 | 50 | label = lv.label(btn) # Add a label to the button 51 | label.set_text("Button") # Set the labels text 52 | label.center() 53 | 54 | # Create an other button and use the red style too 55 | btn2 = lv.btn(lv.scr_act()) 56 | btn2.remove_style_all() # Remove the styles coming from the theme 57 | btn2.set_pos(10, 80) # Set its position 58 | btn2.set_size(120, 50) # Set its size 59 | btn2.add_style(style_btn, 0) 60 | btn2.add_style(style_btn_red, 0) 61 | btn2.add_style(style_btn_pressed, lv.STATE.PRESSED) 62 | btn2.set_style_radius(lv.RADIUS.CIRCLE, 0); # Add a local style 63 | 64 | label = lv.label(btn2) # Add a label to the button 65 | label.set_text("Button 2"); # Set the labels text 66 | label.center() 67 | 68 | -------------------------------------------------------------------------------- /get_started/lv_example_get_started_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | 7 | def slider_event_cb(evt): 8 | slider = evt.get_target() 9 | 10 | # Refresh the text 11 | label.set_text(str(slider.get_value())) 12 | 13 | # 14 | # Create a slider and write its value on a label. 15 | # 16 | 17 | # Create a slider in the center of the display 18 | slider = lv.slider(lv.scr_act()) 19 | slider.set_width(200) # Set the width 20 | slider.center() # Align to the center of the parent (screen) 21 | slider.add_event_cb(slider_event_cb, lv.EVENT.VALUE_CHANGED, None) # Assign an event function 22 | 23 | # Create a label below the slider 24 | label = lv.label(lv.scr_act()); 25 | label.set_text("0") 26 | label.align_to(slider, lv.ALIGN.OUT_TOP_MID, 0, -15) # Align below the slider 27 | 28 | 29 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # A simple row and a column layout with flexbox 8 | # 9 | 10 | # Create a container with ROW flex direction 11 | cont_row = lv.obj(lv.scr_act()) 12 | cont_row.set_size(300, 75) 13 | cont_row.align(lv.ALIGN.TOP_MID, 0, 5) 14 | cont_row.set_flex_flow(lv.FLEX_FLOW.ROW) 15 | 16 | # Create a container with COLUMN flex direction 17 | cont_col = lv.obj(lv.scr_act()) 18 | cont_col.set_size(200, 150) 19 | cont_col.align_to(cont_row, lv.ALIGN.OUT_BOTTOM_MID, 0, 5) 20 | cont_col.set_flex_flow(lv.FLEX_FLOW.COLUMN) 21 | 22 | for i in range(10): 23 | # Add items to the row 24 | obj = lv.btn(cont_row) 25 | obj.set_size(100, lv.pct(100)) 26 | 27 | label = lv.label(obj) 28 | label.set_text("Item: {:d}".format(i)) 29 | label.center() 30 | 31 | # Add items to the column 32 | obj = lv.btn(cont_col) 33 | obj.set_size(lv.pct(100), lv.SIZE.CONTENT) 34 | 35 | label = lv.label(obj) 36 | label.set_text("Item: {:d}".format(i)) 37 | label.center() 38 | 39 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Arrange items in rows with wrap and place the items to get even space around them. 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | style.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 12 | style.set_flex_main_place(lv.FLEX_ALIGN.SPACE_EVENLY) 13 | style.set_layout(lv.LAYOUT_FLEX.value) 14 | 15 | cont = lv.obj(lv.scr_act()) 16 | cont.set_size(300, 220) 17 | cont.center() 18 | cont.add_style(style, 0) 19 | 20 | for i in range(8): 21 | obj = lv.obj(cont) 22 | obj.set_size(70, lv.SIZE.CONTENT) 23 | obj.add_flag(lv.obj.FLAG.CHECKABLE) 24 | 25 | label = lv.label(obj) 26 | label.set_text("{:d}".format(i)) 27 | label.center() 28 | 29 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Demonstrate flex grow. 8 | # 9 | 10 | cont = lv.obj(lv.scr_act()) 11 | cont.set_size(300, 220) 12 | cont.center() 13 | cont.set_flex_flow(lv.FLEX_FLOW.ROW) 14 | 15 | obj = lv.obj(cont) 16 | obj.set_size(40, 40) # Fix size 17 | 18 | obj = lv.obj(cont) 19 | obj.set_height(40) 20 | obj.set_flex_grow(1) # 1 portion from the free space 21 | 22 | obj = lv.obj(cont) 23 | obj.set_height(40) 24 | obj.set_flex_grow(2) # 2 portion from the free space 25 | 26 | obj = lv.obj(cont) 27 | obj.set_size(40, 40) # Fix size. It is flushed to the right by the "grow" items 28 | 29 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Reverse the order of flex items 8 | # 9 | cont = lv.obj(lv.scr_act()) 10 | cont.set_size(300, 220) 11 | cont.center() 12 | cont.set_flex_flow(lv.FLEX_FLOW.COLUMN_REVERSE) 13 | 14 | for i in range(6): 15 | obj = lv.obj(cont) 16 | obj.set_size(100, 50) 17 | 18 | label = lv.label(obj) 19 | label.set_text("Item: " + str(i)) 20 | label.center() 21 | 22 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_5.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def row_gap_anim(obj, v): 7 | obj.set_style_pad_row(v, 0) 8 | 9 | 10 | def column_gap_anim(obj, v): 11 | obj.set_style_pad_column(v, 0) 12 | 13 | # 14 | # Demonstrate the effect of column and row gap style properties 15 | # 16 | 17 | cont = lv.obj(lv.scr_act()) 18 | cont.set_size(300, 220) 19 | cont.center() 20 | cont.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 21 | 22 | for i in range(9): 23 | obj = lv.obj(cont) 24 | obj.set_size(70, lv.SIZE.CONTENT) 25 | 26 | label = lv.label(obj) 27 | label.set_text(str(i)) 28 | label.center() 29 | 30 | a_row = lv.anim_t() 31 | a_row.init() 32 | a_row.set_var(cont) 33 | a_row.set_values(0, 10) 34 | a_row.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 35 | 36 | a_row.set_time(500) 37 | a_row.set_playback_time(500) 38 | a_row.set_custom_exec_cb(lambda a,val: row_gap_anim(cont,val)) 39 | lv.anim_t.start(a_row) 40 | 41 | a_col = lv.anim_t() 42 | a_col.init() 43 | a_col.set_var(cont) 44 | a_col.set_values(0, 10) 45 | a_col.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 46 | 47 | a_col.set_time(3000) 48 | a_col.set_playback_time(3000) 49 | a_col.set_custom_exec_cb(lambda a,val: column_gap_anim(cont,val)) 50 | 51 | lv.anim_t.start(a_col) 52 | 53 | -------------------------------------------------------------------------------- /layouts/flex/lv_example_flex_6.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # RTL base direction changes order of the items. 8 | # Also demonstrate how horizontal scrolling works with RTL. 9 | # 10 | 11 | cont = lv.obj(lv.scr_act()) 12 | cont.set_style_base_dir(lv.BASE_DIR.RTL,0) 13 | cont.set_size(300, 220) 14 | cont.center() 15 | cont.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 16 | 17 | for i in range(20): 18 | obj = lv.obj(cont) 19 | obj.set_size(70, lv.SIZE.CONTENT) 20 | 21 | label = lv.label(obj) 22 | label.set_text(str(i)) 23 | label.center() 24 | 25 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # A simple grid 8 | # 9 | 10 | col_dsc = [70, 70, 70, lv.COORD.MAX] 11 | row_dsc = [50, 50, 50, lv.COORD.MAX] 12 | 13 | # Create a container with grid 14 | cont = lv.obj(lv.scr_act()) 15 | cont.set_style_grid_column_dsc_array(col_dsc, 0) 16 | cont.set_style_grid_row_dsc_array(row_dsc, 0) 17 | cont.set_size(300, 220) 18 | cont.center() 19 | cont.set_layout(lv.LAYOUT_GRID.value) 20 | 21 | for i in range(9): 22 | col = i % 3 23 | row = i // 3 24 | 25 | obj = lv.btn(cont) 26 | # Stretch the cell horizontally and vertically too 27 | # Set span to 1 to make the cell 1 column/row sized 28 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, col, 1, 29 | lv.GRID_ALIGN.STRETCH, row, 1) 30 | 31 | label = lv.label(obj) 32 | label.set_text("c" +str(col) + "r" +str(row)) 33 | label.center() 34 | 35 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Demonstrate cell placement and span 8 | # 9 | 10 | col_dsc = [70, 70, 70, lv.GRID_TEMPLATE.LAST] 11 | row_dsc = [50, 50, 50, lv.GRID_TEMPLATE.LAST] 12 | 13 | # Create a container with grid 14 | cont = lv.obj(lv.scr_act()) 15 | cont.set_grid_dsc_array(col_dsc, row_dsc) 16 | cont.set_size(300, 220) 17 | cont.center() 18 | 19 | # Cell to 0;0 and align to to the start (left/top) horizontally and vertically too 20 | obj = lv.obj(cont) 21 | obj.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 22 | obj.set_grid_cell(lv.GRID_ALIGN.START, 0, 1, 23 | lv.GRID_ALIGN.START, 0, 1) 24 | label = lv.label(obj); 25 | label.set_text("c0, r0") 26 | 27 | # Cell to 1;0 and align to to the start (left) horizontally and center vertically too 28 | obj = lv.obj(cont) 29 | obj.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 30 | obj.set_grid_cell(lv.GRID_ALIGN.START, 1, 1, 31 | lv.GRID_ALIGN.CENTER, 0, 1) 32 | label = lv.label(obj) 33 | label.set_text("c1, r0") 34 | 35 | # Cell to 2;0 and align to to the start (left) horizontally and end (bottom) vertically too 36 | obj = lv.obj(cont) 37 | obj.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 38 | obj.set_grid_cell(lv.GRID_ALIGN.START, 2, 1, 39 | lv.GRID_ALIGN.END, 0, 1) 40 | label = lv.label(obj) 41 | label.set_text("c2, r0"); 42 | 43 | # Cell to 1;1 but 2 column wide (span = 2).Set width and height to stretched. 44 | obj = lv.obj(cont) 45 | obj.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 46 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, 1, 2, 47 | lv.GRID_ALIGN.STRETCH, 1, 1) 48 | label = lv.label(obj) 49 | label.set_text("c1-2, r1") 50 | 51 | # Cell to 0;1 but 2 rows tall (span = 2).Set width and height to stretched. 52 | obj = lv.obj(cont) 53 | obj.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 54 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, 0, 1, 55 | lv.GRID_ALIGN.STRETCH, 1, 2) 56 | label = lv.label(obj) 57 | label.set_text("c0\nr1-2") 58 | 59 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def LV_GRID_FR(x): 7 | return lv.COORD.MAX - 100 + x 8 | # 9 | # Demonstrate grid's "free unit" 10 | # 11 | 12 | # Column 1: fix width 60 px 13 | # Column 2: 1 unit from the remaining free space 14 | # Column 3: 2 unit from the remaining free space 15 | 16 | col_dsc = [60, LV_GRID_FR(1), LV_GRID_FR(2), lv.COORD.MAX] 17 | 18 | # Row 1: fix width 60 px 19 | # Row 2: 1 unit from the remaining free space 20 | # Row 3: fix width 60 px 21 | 22 | row_dsc = [40, LV_GRID_FR(1), 40, lv.COORD.MAX] 23 | 24 | # Create a container with grid 25 | cont = lv.obj(lv.scr_act()) 26 | cont.set_size(300, 220) 27 | cont.center() 28 | cont.set_grid_dsc_array(col_dsc, row_dsc) 29 | 30 | for i in range(9): 31 | col = i % 3 32 | row = i // 3 33 | 34 | obj = lv.obj(cont) 35 | # Stretch the cell horizontally and vertically too 36 | # Set span to 1 to make the cell 1 column/row sized 37 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, col, 1, 38 | lv.GRID_ALIGN.STRETCH, row, 1) 39 | 40 | label = lv.label(obj) 41 | label.set_text("%d,%d"%(col, row)) 42 | label.center() 43 | 44 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Demonstrate track placement 8 | # 9 | 10 | col_dsc = [60, 60, 60, lv.GRID_TEMPLATE.LAST] 11 | row_dsc = [40, 40, 40, lv.GRID_TEMPLATE.LAST] 12 | 13 | 14 | # Add space between the columns and move the rows to the bottom (end) 15 | 16 | # Create a container with grid 17 | cont = lv.obj(lv.scr_act()) 18 | cont.set_grid_align(lv.GRID_ALIGN.SPACE_BETWEEN, lv.GRID_ALIGN.END) 19 | cont.set_grid_dsc_array(col_dsc, row_dsc) 20 | cont.set_size(300, 220) 21 | cont.center() 22 | 23 | 24 | for i in range(9): 25 | col = i % 3 26 | row = i // 3 27 | 28 | obj = lv.obj(cont) 29 | # Stretch the cell horizontally and vertically too 30 | # Set span to 1 to make the cell 1 column/row sized 31 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, col, 1, 32 | lv.GRID_ALIGN.STRETCH, row, 1) 33 | 34 | label = lv.label(obj) 35 | label.set_text("{:d}{:d}".format(col, row)) 36 | label.center() 37 | 38 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_5.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def row_gap_anim(obj, v): 7 | obj.set_style_pad_row(v, 0) 8 | 9 | def column_gap_anim(obj, v): 10 | obj.set_style_pad_column(v, 0) 11 | 12 | # 13 | # Demonstrate column and row gap 14 | # 15 | 16 | # 60x60 cells 17 | col_dsc = [60, 60, 60, lv.GRID_TEMPLATE.LAST] 18 | row_dsc = [40, 40, 40, lv.GRID_TEMPLATE.LAST] 19 | 20 | # Create a container with grid 21 | cont = lv.obj(lv.scr_act()) 22 | cont.set_size(300, 220) 23 | cont.center() 24 | cont.set_grid_dsc_array(col_dsc, row_dsc) 25 | 26 | for i in range(9): 27 | col = i % 3 28 | row = i // 3 29 | 30 | obj = lv.obj(cont) 31 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, col, 1, 32 | lv.GRID_ALIGN.STRETCH, row, 1) 33 | label = lv.label(obj) 34 | label.set_text("{:d},{:d}".format(col, row)) 35 | label.center() 36 | 37 | a_row = lv.anim_t() 38 | a_row.init() 39 | a_row.set_var(cont) 40 | a_row.set_values(0, 10) 41 | a_row.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 42 | a_row.set_time(500) 43 | a_row.set_playback_time(500) 44 | a_row. set_custom_exec_cb(lambda a,val: row_gap_anim(cont,val)) 45 | lv.anim_t.start(a_row) 46 | 47 | a_col = lv.anim_t() 48 | a_col.init() 49 | a_col.set_var(cont) 50 | a_col.set_values(0, 10) 51 | a_col.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 52 | a_col.set_time(500) 53 | a_col.set_playback_time(500) 54 | a_col. set_custom_exec_cb(lambda a,val: column_gap_anim(cont,val)) 55 | lv.anim_t.start(a_col) 56 | 57 | 58 | -------------------------------------------------------------------------------- /layouts/grid/lv_example_grid_6.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Demonstrate RTL direction on grid 8 | # 9 | col_dsc = [60, 60, 60, lv.GRID_TEMPLATE.LAST] 10 | row_dsc = [40, 40, 40, lv.GRID_TEMPLATE.LAST] 11 | 12 | # Create a container with grid 13 | cont = lv.obj(lv.scr_act()) 14 | cont.set_size(300, 220) 15 | cont.center() 16 | cont.set_style_base_dir(lv.BASE_DIR.RTL,0) 17 | cont.set_grid_dsc_array(col_dsc, row_dsc) 18 | 19 | for i in range(9): 20 | col = i % 3 21 | row = i // 3 22 | 23 | obj = lv.obj(cont) 24 | # Stretch the cell horizontally and vertically too 25 | # Set span to 1 to make the cell 1 column/row sized 26 | obj.set_grid_cell(lv.GRID_ALIGN.STRETCH, col, 1, 27 | lv.GRID_ALIGN.STRETCH, row, 1); 28 | 29 | label = lv.label(obj) 30 | label.set_text("{:d},{:d}".format(col, row)) 31 | label.center() 32 | 33 | -------------------------------------------------------------------------------- /libs/bmp/example_16bit.bmp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/bmp/example_16bit.bmp -------------------------------------------------------------------------------- /libs/bmp/example_24bit.bmp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/bmp/example_24bit.bmp -------------------------------------------------------------------------------- /libs/bmp/example_32bit.bmp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/bmp/example_32bit.bmp -------------------------------------------------------------------------------- /libs/bmp/lv_example_bmp_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | 7 | fs_drv = lv.fs_drv_t() 8 | fs_driver.fs_register(fs_drv, 'S') 9 | 10 | img = lv.img(lv.scr_act()) 11 | # The File system is attached to letter 'S' 12 | 13 | img.set_src("S:example_32bit.bmp") 14 | img.center() 15 | -------------------------------------------------------------------------------- /libs/ffmpeg/birds.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/ffmpeg/birds.mp4 -------------------------------------------------------------------------------- /libs/ffmpeg/ffmpeg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/ffmpeg/ffmpeg.png -------------------------------------------------------------------------------- /libs/ffmpeg/lv_example_ffmpeg_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython-ffmpeg -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | 6 | try: 7 | # 8 | # Open an image from a file 9 | # 10 | img = lv.img(lv.scr_act()) 11 | img.set_src("ffmpeg.png") 12 | img.center() 13 | except Exception as e: 14 | print(e) 15 | # TODO 16 | # fallback for online examples 17 | 18 | label = lv.label(lv.scr_act()) 19 | label.set_text("FFmpeg is not installed") 20 | label.center() 21 | 22 | -------------------------------------------------------------------------------- /libs/ffmpeg/lv_example_ffmpeg_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython-ffmpeg -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Open a video from a file 8 | # 9 | 10 | # birds.mp4 is downloaded from http://www.videezy.com (Free Stock Footage by Videezy!) 11 | # https://www.videezy.com/abstract/44864-silhouettes-of-birds-over-the-sunset 12 | player = lv.ffmpeg_player(lv.scr_act()) 13 | player.player_set_src("birds.mp4") 14 | player.player_set_auto_restart(True) 15 | # player.player_set_cmd(lv.FFMPEG_PLAYER_CMD.START) 16 | player.player_set_cmd(0) 17 | player.center() 18 | -------------------------------------------------------------------------------- /libs/freetype/arial.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/freetype/arial.ttf -------------------------------------------------------------------------------- /libs/freetype/lv_example_freetype_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | 7 | info = lv.ft_info_t() 8 | info.name ="./arial.ttf" 9 | info.weight = 24 10 | info.style = lv.FT_FONT_STYLE.NORMAL 11 | info.font_init() 12 | 13 | # Create style with the new font 14 | style = lv.style_t() 15 | style.init() 16 | style.set_text_font(info.font) 17 | style.set_text_align(lv.TEXT_ALIGN.CENTER) 18 | 19 | # Create a label with the new style 20 | label = lv.label(lv.scr_act()) 21 | label.add_style(style, 0) 22 | label.set_text("Hello world\nI'm a font created with FreeType") 23 | label.center() 24 | -------------------------------------------------------------------------------- /libs/gif/bulb.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/gif/bulb.gif -------------------------------------------------------------------------------- /libs/gif/lv_example_gif_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | from img_bulb_gif import img_bulb_gif_map 7 | 8 | fs_drv = lv.fs_drv_t() 9 | fs_driver.fs_register(fs_drv, 'S') 10 | # 11 | # Open a GIF image from a file and a variable 12 | # 13 | img_bulb_gif = lv.img_dsc_t( 14 | { 15 | "header": {"always_zero": 0, "w": 0, "h": 0, "cf": lv.img.CF.RAW}, 16 | "data_size": 0, 17 | "data": img_bulb_gif_map, 18 | } 19 | ) 20 | img1 = lv.gif(lv.scr_act()) 21 | img1.set_src(img_bulb_gif) 22 | img1.align(lv.ALIGN.RIGHT_MID, -150, 0) 23 | 24 | img2 = lv.gif(lv.scr_act()) 25 | # The File system is attached to letter 'S' 26 | 27 | img2.set_src("S:bulb.gif") 28 | img2.align(lv.ALIGN.RIGHT_MID, -250, 0) 29 | -------------------------------------------------------------------------------- /libs/png/lv_example_png_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | from img_wink_png import img_wink_png_map 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | img_wink_png = lv.img_dsc_t( 13 | { 14 | "header": {"always_zero": 0, "w": 50, "h": 50, "cf": lv.img.CF.RAW_ALPHA}, 15 | "data_size": 5158, 16 | "data": img_wink_png_map, 17 | } 18 | ) 19 | img1 = lv.img(lv.scr_act()) 20 | img1.set_src(img_wink_png) 21 | img1.align(lv.ALIGN.RIGHT_MID, -250, 0) 22 | 23 | # Create an image from the png file 24 | try: 25 | with open('wink.png','rb') as f: 26 | png_data = f.read() 27 | except: 28 | print("Could not find wink.png") 29 | sys.exit() 30 | 31 | wink_argb = lv.img_dsc_t({ 32 | 'data_size': len(png_data), 33 | 'data': png_data 34 | }) 35 | 36 | img2 = lv.img(lv.scr_act()) 37 | img2.set_src(wink_argb) 38 | img2.align(lv.ALIGN.RIGHT_MID, -150, 0) 39 | -------------------------------------------------------------------------------- /libs/png/wink.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/png/wink.png -------------------------------------------------------------------------------- /libs/qrcode/lv_example_qrcode_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | 6 | bg_color = lv.palette_lighten(lv.PALETTE.LIGHT_BLUE, 5) 7 | fg_color = lv.palette_darken(lv.PALETTE.BLUE, 4) 8 | 9 | qr = lv.qrcode(lv.scr_act(), 150, fg_color, bg_color) 10 | # Set data 11 | data = "https://lvgl.io" 12 | qr.update(data,len(data)) 13 | qr.center() 14 | # Add a border with bg_color 15 | qr.set_style_border_color(bg_color, 0) 16 | qr.set_style_border_width(5, 0) 17 | -------------------------------------------------------------------------------- /libs/rlottie/lv_example_rlottie_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | # 6 | # Load an lottie animation from flash 7 | # 8 | from lv_example_rlottie_approve import lv_example_rlottie_approve 9 | 10 | lottie = lv.rlottie_create_from_raw(lv.scr_act(), 100, 100, lv_example_rlottie_approve) 11 | lottie.center() 12 | 13 | -------------------------------------------------------------------------------- /libs/rlottie/lv_example_rlottie_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | 6 | lottie = lv.rlottie_create_from_file(lv.scr_act(), 100, 100,"lv_example_rlottie_approve.json") 7 | lottie.center() 8 | -------------------------------------------------------------------------------- /libs/sjpg/lv_example_sjpg_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | 7 | fs_drv = lv.fs_drv_t() 8 | fs_driver.fs_register(fs_drv, 'S') 9 | 10 | wp = lv.img(lv.scr_act()) 11 | # The File system is attached to letter 'S' 12 | 13 | wp.set_src("S:small_image.sjpg") 14 | wp.center() 15 | -------------------------------------------------------------------------------- /libs/sjpg/small_image.sjpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/libs/sjpg/small_image.sjpg -------------------------------------------------------------------------------- /others/fragment/index.rst: -------------------------------------------------------------------------------- 1 | 2 | Basic fragment usage 3 | """"""""""""""""""" 4 | 5 | .. lv_example:: others/fragment/lv_example_fragment_1 6 | :language: c 7 | 8 | 9 | 10 | Stack navigation example 11 | """"""""""""""""""" 12 | 13 | .. lv_example:: others/fragment/lv_example_fragment_2 14 | :language: c 15 | 16 | 17 | -------------------------------------------------------------------------------- /others/fragment/lv_example_fragment.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_fragment.h 3 | */ 4 | #ifndef LV_EXAMPLE_FRAGMENT_H 5 | #define LV_EXAMPLE_FRAGMENT_H 6 | 7 | #ifdef __cplusplus 8 | extern "C" { 9 | #endif 10 | 11 | /********************* 12 | * INCLUDES 13 | *********************/ 14 | 15 | /********************* 16 | * DEFINES 17 | *********************/ 18 | 19 | /********************** 20 | * TYPEDEFS 21 | **********************/ 22 | 23 | /********************** 24 | * GLOBAL PROTOTYPES 25 | **********************/ 26 | void lv_example_fragment_1(void); 27 | 28 | void lv_example_fragment_2(void); 29 | 30 | /********************** 31 | * MACROS 32 | **********************/ 33 | 34 | #ifdef __cplusplus 35 | } /*extern "C"*/ 36 | #endif 37 | 38 | #endif /*LV_EXAMPLE_fragment_H*/ 39 | -------------------------------------------------------------------------------- /others/fragment/lv_example_fragment_1.c: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_fragment_1.c 3 | * @brief Basic usage of obj fragment 4 | */ 5 | #include "../../lv_examples.h" 6 | 7 | #if LV_USE_FRAGMENT && LV_BUILD_EXAMPLES 8 | 9 | static void sample_fragment_ctor(lv_fragment_t * self, void * args); 10 | 11 | static lv_obj_t * sample_fragment_create_obj(lv_fragment_t * self, lv_obj_t * parent); 12 | 13 | static void sample_container_del(lv_event_t * e); 14 | 15 | static lv_obj_t * root = NULL; 16 | 17 | struct sample_fragment_t { 18 | lv_fragment_t base; 19 | const char * name; 20 | }; 21 | 22 | static const lv_fragment_class_t sample_cls = { 23 | .constructor_cb = sample_fragment_ctor, 24 | .create_obj_cb = sample_fragment_create_obj, 25 | .instance_size = sizeof(struct sample_fragment_t) 26 | }; 27 | 28 | void lv_example_fragment_1(void) 29 | { 30 | root = lv_obj_create(lv_scr_act()); 31 | lv_obj_set_size(root, LV_PCT(100), LV_PCT(100)); 32 | lv_fragment_manager_t * manager = lv_fragment_manager_create(NULL); 33 | /* Clean up the fragment manager before objects in containers got deleted */ 34 | lv_obj_add_event_cb(root, sample_container_del, LV_EVENT_DELETE, manager); 35 | 36 | lv_fragment_t * fragment = lv_fragment_create(&sample_cls, "Fragment"); 37 | lv_fragment_manager_replace(manager, fragment, &root); 38 | } 39 | 40 | 41 | static void sample_fragment_ctor(lv_fragment_t * self, void * args) 42 | { 43 | ((struct sample_fragment_t *) self)->name = args; 44 | } 45 | 46 | static lv_obj_t * sample_fragment_create_obj(lv_fragment_t * self, lv_obj_t * parent) 47 | { 48 | lv_obj_t * label = lv_label_create(parent); 49 | lv_obj_set_style_bg_opa(label, LV_OPA_COVER, 0);; 50 | lv_label_set_text_fmt(label, "Hello, %s!", ((struct sample_fragment_t *) self)->name); 51 | return label; 52 | } 53 | 54 | static void sample_container_del(lv_event_t * e) 55 | { 56 | lv_fragment_manager_t * manager = (lv_fragment_manager_t *) lv_event_get_user_data(e); 57 | lv_fragment_manager_del(manager); 58 | } 59 | 60 | #endif 61 | -------------------------------------------------------------------------------- /others/fragment/lv_example_fragment_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | # 5 | # file: lv_example_fragment_1.c 6 | # brief: Basic usage of obj fragment 7 | # 8 | 9 | def sample_container_del(e,manager): 10 | lv.fragment_manager_del(manager) 11 | 12 | root = lv.obj(lv.scr_act()) 13 | root.set_size(lv.pct(100), lv.pct(100)) 14 | manager = lv.fragment_manager_create(None) 15 | # Clean up the fragment manager before objects in containers got deleted 16 | 17 | root.add_event_cb(lambda evt: sample_container_del(evt,manager), lv.EVENT.DELETE, None) 18 | 19 | sample_cls = lv.fragment_class_t() 20 | ''' 21 | fragment = lv.fragment(sample_cls, "Fragment"); 22 | manager.replace(fragment, root) 23 | 24 | static void sample_fragment_ctor(lv_fragment_t * self, void * args) 25 | { 26 | ((struct sample_fragment_t *) self)->name = args; 27 | } 28 | 29 | static lv_obj_t * sample_fragment_create_obj(lv_fragment_t * self, lv_obj_t * parent) 30 | { 31 | lv_obj_t * label = lv_label_create(parent); 32 | lv_obj_set_style_bg_opa(label, LV_OPA_COVER, 0);; 33 | lv_label_set_text_fmt(label, "Hello, %s!", ((struct sample_fragment_t *) self)->name); 34 | return label; 35 | } 36 | 37 | static void sample_container_del(lv_event_t * e) 38 | { 39 | lv_fragment_manager_t * manager = (lv_fragment_manager_t *) lv_event_get_user_data(e); 40 | lv_fragment_manager_del(manager); 41 | } 42 | 43 | #endif 44 | ''' 45 | -------------------------------------------------------------------------------- /others/gridnav/lv_example_gridnav_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Demonstrate a a basic grid navigation 7 | # 8 | # It's assumed that the default group is set and 9 | # there is a keyboard indev 10 | 11 | cont1 = lv.obj(lv.scr_act()) 12 | lv.gridnav_add(cont1, lv.GRIDNAV_CTRL.NONE) 13 | 14 | # Use flex here, but works with grid or manually placed objects as well 15 | cont1.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 16 | cont1.set_style_bg_color(lv.palette_lighten(lv.PALETTE.BLUE, 5), lv.STATE.FOCUSED) 17 | cont1.set_size(lv.pct(50), lv.pct(100)) 18 | 19 | # Only the container needs to be in a group 20 | lv.group_get_default().add_obj(cont1) 21 | 22 | label = lv.label(cont1) 23 | label.set_text("No rollover") 24 | 25 | for i in range(10): 26 | obj = lv.btn(cont1) 27 | obj.set_size(70, lv.SIZE_CONTENT) 28 | obj.add_flag(lv.obj.FLAG.CHECKABLE) 29 | lv.group_remove_obj(obj) # Not needed, we use the gridnav instead 30 | 31 | label = lv.label(obj) 32 | label.set_text("{:d}".format(i)) 33 | label.center() 34 | 35 | # Create a second container with rollover grid nav mode. 36 | 37 | cont2 = lv.obj(lv.scr_act()) 38 | lv.gridnav_add(cont2,lv.GRIDNAV_CTRL.ROLLOVER) 39 | cont2.set_style_bg_color(lv.palette_lighten(lv.PALETTE.BLUE, 5), lv.STATE.FOCUSED) 40 | cont2.set_size(lv.pct(50), lv.pct(100)) 41 | cont2.align(lv.ALIGN.RIGHT_MID, 0, 0) 42 | 43 | label = lv.label(cont2) 44 | label.set_width(lv.pct(100)) 45 | label.set_text("Rollover\nUse tab to focus the other container") 46 | 47 | # Only the container needs to be in a group 48 | lv.group_get_default().add_obj(cont2) 49 | 50 | # Add and place some children manually 51 | ta = lv.textarea(cont2) 52 | ta.set_size(lv.pct(100), 80) 53 | ta.set_pos(0, 80); 54 | lv.group_remove_obj(ta) # Not needed, we use the gridnav instead 55 | 56 | cb = lv.checkbox(cont2) 57 | cb.set_pos(0, 170) 58 | lv.group_remove_obj(cb) # Not needed, we use the gridnav instead 59 | 60 | sw1 = lv.switch(cont2) 61 | sw1.set_pos(0, 200); 62 | lv.group_remove_obj(sw1) # Not needed, we use the gridnav instead 63 | 64 | sw2 = lv.switch(cont2) 65 | sw2.set_pos(lv.pct(50), 200) 66 | lv.group_remove_obj(sw2) # Not needed, we use the gridnav instead 67 | 68 | -------------------------------------------------------------------------------- /others/gridnav/lv_example_gridnav_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Grid navigation on a list 7 | # 8 | # It's assumed that the default group is set and 9 | # there is a keyboard indev 10 | 11 | list1 = lv.list(lv.scr_act()) 12 | lv.gridnav_add(list1, lv.GRIDNAV_CTRL.NONE) 13 | list1.set_size(lv.pct(45), lv.pct(80)) 14 | list1.align(lv.ALIGN.LEFT_MID, 5, 0) 15 | list1.set_style_bg_color(lv.palette_lighten(lv.PALETTE.BLUE, 5), lv.STATE.FOCUSED) 16 | lv.group_get_default().add_obj(list1) 17 | 18 | for i in range(15): 19 | item_text = "File {:d}".format(i) 20 | item = list1.add_btn(lv.SYMBOL.FILE, item_text) 21 | item.set_style_bg_opa(0, 0) 22 | lv.group_remove_obj(item) # Not needed, we use the gridnav instead 23 | 24 | list2 = lv.list(lv.scr_act()) 25 | lv.gridnav_add(list2, lv.GRIDNAV_CTRL.ROLLOVER) 26 | list2.set_size(lv.pct(45), lv.pct(80)) 27 | list2.align(lv.ALIGN.RIGHT_MID, -5, 0) 28 | list2.set_style_bg_color(lv.palette_lighten(lv.PALETTE.BLUE, 5), lv.STATE.FOCUSED) 29 | lv.group_get_default().add_obj(list2) 30 | 31 | for i in range(15): 32 | item_text = "Folder {:d}".format(i) 33 | item = list2.add_btn(lv.SYMBOL.DIRECTORY, item_text) 34 | item.set_style_bg_opa(0, 0) 35 | lv.group_remove_obj(item) 36 | 37 | -------------------------------------------------------------------------------- /others/gridnav/lv_example_gridnav_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | def cont_sub_event_cb(e): 6 | k = e.get_key() 7 | obj = e.get_current_target() 8 | if k == lv.KEY.ENTER: 9 | lv.group_focus_obj(obj) 10 | 11 | elif k == lv.KEY.ESC: 12 | obj.get_group().focus_next() 13 | 14 | # 15 | # Nested grid navigations 16 | # 17 | # It's assumed that the default group is set and 18 | # there is a keyboard indev*/ 19 | 20 | cont_main = lv.obj(lv.scr_act()) 21 | lv.gridnav_add(cont_main,lv.GRIDNAV_CTRL.ROLLOVER | lv.GRIDNAV_CTRL.SCROLL_FIRST) 22 | 23 | # Only the container needs to be in a group 24 | lv.group_get_default().add_obj(cont_main) 25 | 26 | # Use flex here, but works with grid or manually placed objects as well 27 | cont_main.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 28 | cont_main.set_style_bg_color(lv.palette_lighten(lv.PALETTE.BLUE, 5), lv.STATE.FOCUSED) 29 | cont_main.set_size(lv.pct(80), lv.SIZE_CONTENT) 30 | 31 | btn = lv.btn(cont_main) 32 | lv.group_remove_obj(btn) 33 | label = lv.label(btn) 34 | label.set_text("Button 1") 35 | 36 | btn = lv.btn(cont_main) 37 | lv.group_remove_obj(btn) 38 | label = lv.label(btn) 39 | label.set_text("Button 2"); 40 | 41 | 42 | # Create an other container with long text to show how LV_GRIDNAV_CTRL_SCROLL_FIRST works 43 | cont_sub1 = lv.obj(cont_main) 44 | cont_sub1.set_size(lv.pct(100), 100) 45 | 46 | label = lv.label(cont_sub1) 47 | cont_sub1.set_style_bg_color(lv.palette_lighten(lv.PALETTE.RED, 5), lv.STATE.FOCUSED) 48 | label.set_width(lv.pct(100)); 49 | label.set_text( 50 | """I'm a very long text which makes my container scrollable. 51 | As LV_GRIDNAV_FLAG_SCROLL_FIRST is enabled arrows will scroll me first 52 | and a new objects will be focused only when an edge is reached with the scrolling.\n 53 | This is only some placeholder text to be sure the parent will be scrollable. \n 54 | Hello world! 55 | Hello world! 56 | Hello world! 57 | Hello world! 58 | Hello world! 59 | Hello world! 60 | """) 61 | 62 | # Create a third container that can be focused with ENTER and contains an other grid nav 63 | cont_sub2 = lv.obj(cont_main) 64 | lv.gridnav_add(cont_sub2, lv.GRIDNAV_CTRL.ROLLOVER) 65 | #Only the container needs to be in a group 66 | lv.group_get_default().add_obj(cont_sub2) 67 | 68 | cont_sub2.add_event_cb(cont_sub_event_cb, lv.EVENT.KEY, None) 69 | 70 | # Use flex here, but works with grid or manually placed objects as well 71 | cont_sub2.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 72 | cont_sub2.set_style_bg_color(lv.palette_lighten(lv.PALETTE.RED, 5), lv.STATE.FOCUSED) 73 | cont_sub2.set_size(lv.pct(100), lv.SIZE_CONTENT) 74 | 75 | label = lv.label(cont_sub2) 76 | label.set_text("Use ENTER/ESC to focus/defocus this container") 77 | label.set_width(lv.pct(100)) 78 | 79 | btn = lv.btn(cont_sub2) 80 | lv.group_remove_obj(btn) 81 | label = lv.label(btn) 82 | label.set_text("Button 3") 83 | 84 | btn = lv.btn(cont_sub2) 85 | lv.group_remove_obj(btn) 86 | label = lv.label(btn) 87 | label.set_text("Button 4") 88 | 89 | -------------------------------------------------------------------------------- /others/gridnav/lv_example_gridnav_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | def event_handler(e): 6 | obj = e.get_target() 7 | list = obj.get_parent() 8 | print("Clicked: " + list.get_btn_text(obj)) 9 | 10 | 11 | # 12 | # Simple navigation on a list widget 13 | # 14 | # It's assumed that the default group is set and 15 | # there is a keyboard indev 16 | 17 | list = lv.list(lv.scr_act()) 18 | lv.gridnav_add(list, lv.GRIDNAV_CTRL.ROLLOVER) 19 | list.align(lv.ALIGN.LEFT_MID, 0, 10) 20 | lv.group_get_default().add_obj(list) 21 | 22 | for i in range(20): 23 | 24 | # Add some separators too, they are not focusable by gridnav 25 | if i % 5 == 0: 26 | txt = "Section {:d}".format(i // 5 + 1) 27 | # lv_snprintf(buf, sizeof(buf), "Section %d", i / 5 + 1); 28 | list.add_text(txt) 29 | 30 | txt = "File {:d}".format(i + 1) 31 | #lv_snprintf(buf, sizeof(buf), "File %d", i + 1); 32 | item = list.add_btn(lv.SYMBOL.FILE, txt) 33 | item.add_event_cb(event_handler, lv.EVENT.CLICKED, None) 34 | lv.group_remove_obj(item) # The default group adds it automatically 35 | 36 | btn = lv.btn(lv.scr_act()) 37 | btn.align(lv.ALIGN.RIGHT_MID, 0, -10) 38 | label = lv.label(btn) 39 | label.set_text("Button") 40 | 41 | -------------------------------------------------------------------------------- /others/ime/index.rst: -------------------------------------------------------------------------------- 1 | 2 | Pinyin IME 26 key input 3 | """"""""""""""""""""""""" 4 | 5 | .. lv_example:: others/ime/lv_example_ime_pinyin_1 6 | :language: c 7 | 8 | Pinyin IME 9 key input 9 | """"""""""""""""""""""""" 10 | 11 | .. lv_example:: others/ime/lv_example_ime_pinyin_2 12 | :language: c 13 | -------------------------------------------------------------------------------- /others/ime/lv_example_ime_pinyin.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_ime_pinyin.h 3 | * 4 | */ 5 | 6 | #ifndef LV_EX_IME_PINYIN_H 7 | #define LV_EX_IME_PINYIN_H 8 | 9 | #ifdef __cplusplus 10 | extern "C" { 11 | #endif 12 | 13 | /********************* 14 | * INCLUDES 15 | *********************/ 16 | 17 | /********************* 18 | * DEFINES 19 | *********************/ 20 | 21 | /********************** 22 | * TYPEDEFS 23 | **********************/ 24 | 25 | /********************** 26 | * GLOBAL PROTOTYPES 27 | **********************/ 28 | void lv_example_ime_pinyin_1(void); 29 | void lv_example_ime_pinyin_2(void); 30 | 31 | /********************** 32 | * MACROS 33 | **********************/ 34 | 35 | #ifdef __cplusplus 36 | } /*extern "C"*/ 37 | #endif 38 | 39 | #endif /*LV_EX_IME_PINYIN_H*/ 40 | -------------------------------------------------------------------------------- /others/ime/lv_example_ime_pinyin_1.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_LABEL && LV_USE_TEXTAREA && LV_FONT_SIMSUN_16_CJK && LV_USE_IME_PINYIN && LV_BUILD_EXAMPLES 3 | 4 | static void ta_event_cb(lv_event_t * e) 5 | { 6 | lv_event_code_t code = lv_event_get_code(e); 7 | lv_obj_t * ta = lv_event_get_target(e); 8 | lv_obj_t * kb = lv_event_get_user_data(e); 9 | 10 | if(code == LV_EVENT_FOCUSED) { 11 | if(lv_indev_get_type(lv_indev_get_act()) != LV_INDEV_TYPE_KEYPAD) { 12 | lv_keyboard_set_textarea(kb, ta); 13 | lv_obj_clear_flag(kb, LV_OBJ_FLAG_HIDDEN); 14 | } 15 | } 16 | else if(code == LV_EVENT_CANCEL) { 17 | lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN); 18 | lv_obj_clear_state(ta, LV_STATE_FOCUSED); 19 | lv_indev_reset(NULL, ta); /*To forget the last clicked object to make it focusable again*/ 20 | } 21 | } 22 | 23 | void lv_example_ime_pinyin_1(void) 24 | { 25 | lv_obj_t * pinyin_ime = lv_ime_pinyin_create(lv_scr_act()); 26 | lv_obj_set_style_text_font(pinyin_ime, &lv_font_simsun_16_cjk, 0); 27 | //lv_ime_pinyin_set_dict(pinyin_ime, your_dict); // Use a custom dictionary. If it is not set, the built-in dictionary will be used. 28 | 29 | /* ta1 */ 30 | lv_obj_t * ta1 = lv_textarea_create(lv_scr_act()); 31 | lv_textarea_set_one_line(ta1, true); 32 | lv_obj_set_style_text_font(ta1, &lv_font_simsun_16_cjk, 0); 33 | lv_obj_align(ta1, LV_ALIGN_TOP_LEFT, 0, 0); 34 | 35 | /*Create a keyboard and add it to ime_pinyin*/ 36 | lv_obj_t * kb = lv_keyboard_create(lv_scr_act()); 37 | lv_ime_pinyin_set_keyboard(pinyin_ime, kb); 38 | lv_keyboard_set_textarea(kb, ta1); 39 | 40 | lv_obj_add_event_cb(ta1, ta_event_cb, LV_EVENT_ALL, kb); 41 | 42 | /*Get the cand_panel, and adjust its size and position*/ 43 | lv_obj_t * cand_panel = lv_ime_pinyin_get_cand_panel(pinyin_ime); 44 | lv_obj_set_size(cand_panel, LV_PCT(100), LV_PCT(10)); 45 | lv_obj_align_to(cand_panel, kb, LV_ALIGN_OUT_TOP_MID, 0, 0); 46 | 47 | /*Try using ime_pinyin to output the Chinese below in the ta1 above*/ 48 | lv_obj_t * cz_label = lv_label_create(lv_scr_act()); 49 | lv_label_set_text(cz_label, 50 | "嵌入式系统（Embedded System），\n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。"); 51 | lv_obj_set_style_text_font(cz_label, &lv_font_simsun_16_cjk, 0); 52 | lv_obj_set_width(cz_label, 310); 53 | lv_obj_align_to(cz_label, ta1, LV_ALIGN_OUT_BOTTOM_LEFT, 0, 0); 54 | } 55 | 56 | #endif 57 | -------------------------------------------------------------------------------- /others/ime/lv_example_ime_pinyin_2.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_LABEL && LV_USE_TEXTAREA && LV_FONT_SIMSUN_16_CJK && LV_USE_IME_PINYIN && LV_IME_PINYIN_USE_K9_MODE && LV_BUILD_EXAMPLES 3 | 4 | static void ta_event_cb(lv_event_t * e) 5 | { 6 | lv_event_code_t code = lv_event_get_code(e); 7 | lv_obj_t * ta = lv_event_get_target(e); 8 | lv_obj_t * kb = lv_event_get_user_data(e); 9 | 10 | if(code == LV_EVENT_FOCUSED) { 11 | if(lv_indev_get_type(lv_indev_get_act()) != LV_INDEV_TYPE_KEYPAD) { 12 | lv_keyboard_set_textarea(kb, ta); 13 | lv_obj_clear_flag(kb, LV_OBJ_FLAG_HIDDEN); 14 | } 15 | } 16 | else if(code == LV_EVENT_READY) { 17 | lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN); 18 | lv_obj_clear_state(ta, LV_STATE_FOCUSED); 19 | lv_indev_reset(NULL, ta); /*To forget the last clicked object to make it focusable again*/ 20 | } 21 | } 22 | 23 | void lv_example_ime_pinyin_2(void) 24 | { 25 | lv_obj_t * pinyin_ime = lv_ime_pinyin_create(lv_scr_act()); 26 | lv_obj_set_style_text_font(pinyin_ime, &lv_font_simsun_16_cjk, 0); 27 | //lv_ime_pinyin_set_dict(pinyin_ime, your_dict); // Use a custom dictionary. If it is not set, the built-in dictionary will be used. 28 | 29 | /* ta1 */ 30 | lv_obj_t * ta1 = lv_textarea_create(lv_scr_act()); 31 | lv_textarea_set_one_line(ta1, true); 32 | lv_obj_set_style_text_font(ta1, &lv_font_simsun_16_cjk, 0); 33 | lv_obj_align(ta1, LV_ALIGN_TOP_LEFT, 0, 0); 34 | 35 | /*Create a keyboard and add it to ime_pinyin*/ 36 | lv_obj_t * kb = lv_keyboard_create(lv_scr_act()); 37 | lv_keyboard_set_textarea(kb, ta1); 38 | 39 | lv_ime_pinyin_set_keyboard(pinyin_ime, kb); 40 | lv_ime_pinyin_set_mode(pinyin_ime, 41 | LV_IME_PINYIN_MODE_K9); // Set to 9-key input mode. Default: 26-key input(k26) mode. 42 | lv_obj_add_event_cb(ta1, ta_event_cb, LV_EVENT_ALL, kb); 43 | 44 | /*Get the cand_panel, and adjust its size and position*/ 45 | lv_obj_t * cand_panel = lv_ime_pinyin_get_cand_panel(pinyin_ime); 46 | lv_obj_set_size(cand_panel, LV_PCT(100), LV_PCT(10)); 47 | lv_obj_align_to(cand_panel, kb, LV_ALIGN_OUT_TOP_MID, 0, 0); 48 | 49 | /*Try using ime_pinyin to output the Chinese below in the ta1 above*/ 50 | lv_obj_t * cz_label = lv_label_create(lv_scr_act()); 51 | lv_label_set_text(cz_label, 52 | "嵌入式系统（Embedded System），\n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。"); 53 | lv_obj_set_style_text_font(cz_label, &lv_font_simsun_16_cjk, 0); 54 | lv_obj_set_width(cz_label, 310); 55 | lv_obj_align_to(cz_label, ta1, LV_ALIGN_OUT_BOTTOM_LEFT, 0, 0); 56 | } 57 | 58 | #endif 59 | -------------------------------------------------------------------------------- /others/imgfont/index.rst: -------------------------------------------------------------------------------- 1 | Use emojis in a text. 2 | """"""""""""""""""""""""""""""""""""""""""""""" 3 | 4 | .. lv_example:: others/imgfont/lv_example_imgfont_1 5 | :language: c 6 | 7 | -------------------------------------------------------------------------------- /others/imgfont/lv_example_imgfont.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_imgfont.h 3 | * 4 | */ 5 | 6 | #ifndef LV_EXAMPLE_IMGFONT_H 7 | #define LV_EXAMPLE_IMGFONT_H 8 | 9 | #ifdef __cplusplus 10 | extern "C" { 11 | #endif 12 | 13 | /********************* 14 | * INCLUDES 15 | *********************/ 16 | 17 | /********************* 18 | * DEFINES 19 | *********************/ 20 | 21 | /********************** 22 | * TYPEDEFS 23 | **********************/ 24 | 25 | /********************** 26 | * GLOBAL PROTOTYPES 27 | **********************/ 28 | void lv_example_imgfont_1(void); 29 | 30 | /********************** 31 | * MACROS 32 | **********************/ 33 | 34 | #ifdef __cplusplus 35 | } /*extern "C"*/ 36 | #endif 37 | 38 | #endif /*LV_EXAMPLE_IMGFONT_H*/ 39 | -------------------------------------------------------------------------------- /others/imgfont/lv_example_imgfont_1.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #include 3 | 4 | #if LV_BUILD_EXAMPLES 5 | #if LV_USE_IMGFONT 6 | 7 | LV_IMG_DECLARE(emoji_F617) 8 | static bool get_imgfont_path(const lv_font_t * font, void * img_src, 9 | uint16_t len, uint32_t unicode, uint32_t unicode_next) 10 | { 11 | LV_UNUSED(font); 12 | LV_UNUSED(unicode_next); 13 | LV_ASSERT_NULL(img_src); 14 | 15 | if(unicode == 0xF617) { 16 | memcpy(img_src, &emoji_F617, sizeof(lv_img_dsc_t)); 17 | } 18 | else { 19 | char * path = (char *)img_src; 20 | snprintf(path, len, "%s/%04X.%s", "A:lvgl/examples/assets/emoji", unicode, "png"); 21 | path[len - 1] = '\0'; 22 | } 23 | 24 | return true; 25 | } 26 | 27 | /** 28 | * draw img in label or span obj 29 | */ 30 | void lv_example_imgfont_1(void) 31 | { 32 | lv_font_t * imgfont = lv_imgfont_create(80, get_imgfont_path); 33 | if(imgfont == NULL) { 34 | LV_LOG_ERROR("imgfont init error"); 35 | } 36 | 37 | imgfont->fallback = LV_FONT_DEFAULT; 38 | 39 | lv_obj_t * label1 = lv_label_create(lv_scr_act()); 40 | lv_label_set_text(label1, "12\uF600\uF617AB"); 41 | lv_obj_set_style_text_font(label1, imgfont, LV_PART_MAIN); 42 | lv_obj_center(label1); 43 | } 44 | #else 45 | 46 | void lv_example_imgfont_1(void) 47 | { 48 | lv_obj_t * label = lv_label_create(lv_scr_act()); 49 | lv_label_set_text(label, "imgfont is not installed"); 50 | lv_obj_center(label); 51 | } 52 | 53 | #endif 54 | #endif 55 | -------------------------------------------------------------------------------- /others/lv_example_others.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_others.h 3 | * 4 | */ 5 | 6 | #ifndef LV_EXAMPLE_OTHERS_H 7 | #define LV_EXAMPLE_OTHERS_H 8 | 9 | #ifdef __cplusplus 10 | extern "C" { 11 | #endif 12 | 13 | /********************* 14 | * INCLUDES 15 | *********************/ 16 | #include "snapshot/lv_example_snapshot.h" 17 | #include "monkey/lv_example_monkey.h" 18 | #include "gridnav/lv_example_gridnav.h" 19 | #include "fragment/lv_example_fragment.h" 20 | #include "imgfont/lv_example_imgfont.h" 21 | #include "msg/lv_example_msg.h" 22 | #include "ime/lv_example_ime_pinyin.h" 23 | 24 | /********************* 25 | * DEFINES 26 | *********************/ 27 | 28 | /********************** 29 | * TYPEDEFS 30 | **********************/ 31 | 32 | /********************** 33 | * GLOBAL PROTOTYPES 34 | **********************/ 35 | 36 | /********************** 37 | * MACROS 38 | **********************/ 39 | 40 | #ifdef __cplusplus 41 | } /*extern "C"*/ 42 | #endif 43 | 44 | #endif /*LV_EXAMPLE_OTHERS_H*/ 45 | -------------------------------------------------------------------------------- /others/monkey/index.rst: -------------------------------------------------------------------------------- 1 | 2 | Touchpad monkey example 3 | """"""""""""""""""" 4 | 5 | .. lv_example:: others/monkey/lv_example_monkey_1 6 | :language: c 7 | 8 | Encoder monkey example 9 | """"""""""""""""""" 10 | 11 | .. lv_example:: others/monkey/lv_example_monkey_2 12 | :language: c 13 | 14 | Button monkey example 15 | """"""""""""""""""" 16 | 17 | .. lv_example:: others/monkey/lv_example_monkey_3 18 | :language: c 19 | -------------------------------------------------------------------------------- /others/monkey/lv_example_monkey.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_monkey.h 3 | * 4 | */ 5 | 6 | #ifndef LV_EXAMPLE_MONKEY_H 7 | #define LV_EXAMPLE_MONKEY_H 8 | 9 | #ifdef __cplusplus 10 | extern "C" { 11 | #endif 12 | 13 | /********************* 14 | * INCLUDES 15 | *********************/ 16 | 17 | /********************* 18 | * DEFINES 19 | *********************/ 20 | 21 | /********************** 22 | * TYPEDEFS 23 | **********************/ 24 | 25 | /********************** 26 | * GLOBAL PROTOTYPES 27 | **********************/ 28 | void lv_example_monkey_1(void); 29 | void lv_example_monkey_2(void); 30 | void lv_example_monkey_3(void); 31 | 32 | /********************** 33 | * MACROS 34 | **********************/ 35 | 36 | #ifdef __cplusplus 37 | } /*extern "C"*/ 38 | #endif 39 | 40 | #endif /*LV_EXAMPLE_MONKEY_H*/ 41 | -------------------------------------------------------------------------------- /others/monkey/lv_example_monkey_1.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_MONKEY && LV_BUILD_EXAMPLES 3 | 4 | void lv_example_monkey_1(void) 5 | { 6 | /*Create pointer monkey test*/ 7 | lv_monkey_config_t config; 8 | lv_monkey_config_init(&config); 9 | config.type = LV_INDEV_TYPE_POINTER; 10 | config.period_range.min = 10; 11 | config.period_range.max = 100; 12 | lv_monkey_t * monkey = lv_monkey_create(&config); 13 | 14 | /*Start monkey test*/ 15 | lv_monkey_set_enable(monkey, true); 16 | } 17 | 18 | #endif 19 | -------------------------------------------------------------------------------- /others/monkey/lv_example_monkey_2.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_MONKEY && LV_BUILD_EXAMPLES 3 | 4 | void lv_example_monkey_2(void) 5 | { 6 | /*Create encoder monkey test*/ 7 | lv_monkey_config_t config; 8 | lv_monkey_config_init(&config); 9 | config.type = LV_INDEV_TYPE_ENCODER; 10 | config.period_range.min = 50; 11 | config.period_range.max = 500; 12 | config.input_range.min = -5; 13 | config.input_range.max = 5; 14 | lv_monkey_t * monkey = lv_monkey_create(&config); 15 | 16 | /*Set the default group*/ 17 | lv_group_t * group = lv_group_create(); 18 | lv_indev_set_group(lv_monkey_get_indev(monkey), group); 19 | lv_group_set_default(group); 20 | 21 | /*Start monkey test*/ 22 | lv_monkey_set_enable(monkey, true); 23 | } 24 | 25 | #endif 26 | -------------------------------------------------------------------------------- /others/monkey/lv_example_monkey_3.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_MONKEY && LV_BUILD_EXAMPLES 3 | 4 | void lv_example_monkey_3(void) 5 | { 6 | static lv_point_t btn_points[3]; 7 | lv_coord_t hor_res = LV_HOR_RES; 8 | 9 | /*Create button monkey test*/ 10 | lv_monkey_config_t config; 11 | lv_monkey_config_init(&config); 12 | config.type = LV_INDEV_TYPE_BUTTON; 13 | config.period_range.min = 50; 14 | config.period_range.max = 500; 15 | config.input_range.min = 0; 16 | config.input_range.max = sizeof(btn_points) / sizeof(lv_point_t) - 1; 17 | lv_monkey_t * monkey = lv_monkey_create(&config); 18 | 19 | /*Set the coordinates bound to the button*/ 20 | btn_points[0].x = hor_res / 4; 21 | btn_points[0].y = 10; 22 | btn_points[1].x = hor_res / 2; 23 | btn_points[1].y = 10; 24 | btn_points[2].x = hor_res * 3 / 4; 25 | btn_points[2].y = 10; 26 | 27 | lv_indev_set_button_points(lv_monkey_get_indev(monkey), btn_points); 28 | 29 | /*Start monkey test*/ 30 | lv_monkey_set_enable(monkey, true); 31 | } 32 | 33 | #endif 34 | -------------------------------------------------------------------------------- /others/msg/lv_example_msg_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # Define a message ID 6 | MSG_NEW_TEMPERATURE = const(1) 7 | 8 | # Define the object that will be sent as msg payload 9 | class Temperature: 10 | def __init__(self, value): 11 | self.value = value 12 | def __repr__(self): 13 | return f"{self.value} °C" 14 | 15 | def slider_event_cb(e): 16 | slider = e.get_target() 17 | v = slider.get_value() 18 | # Notify all subscribers (only the label now) that the slider value has been changed 19 | lv.msg_send(MSG_NEW_TEMPERATURE, Temperature(v)) 20 | 21 | def label_event_cb(e): 22 | label = e.get_target() 23 | msg = e.get_msg() 24 | # Respond only to MSG_NEW_TEMPERATURE message 25 | if msg.get_id() == MSG_NEW_TEMPERATURE: 26 | payload = msg.get_payload() 27 | temperature = payload.__cast__() 28 | label.set_text(str(temperature)) 29 | 30 | # Create a slider in the center of the display 31 | slider = lv.slider(lv.scr_act()) 32 | slider.center() 33 | slider.add_event_cb(slider_event_cb, lv.EVENT.VALUE_CHANGED, None) 34 | 35 | # Create a label below the slider 36 | label = lv.label(lv.scr_act()) 37 | label.add_event_cb(label_event_cb, lv.EVENT.MSG_RECEIVED, None) 38 | label.set_text("0°C") 39 | label.align(lv.ALIGN.CENTER, 0, 30) 40 | 41 | # Subscribe the label to a message 42 | lv.msg_subscribe_obj(MSG_NEW_TEMPERATURE, label, None) 43 | -------------------------------------------------------------------------------- /others/snapshot/index.rst: -------------------------------------------------------------------------------- 1 | 2 | Simple snapshot example 3 | """"""""""""""""""" 4 | 5 | .. lv_example:: others/snapshot/lv_example_snapshot_1 6 | :language: c 7 | 8 | 9 | -------------------------------------------------------------------------------- /others/snapshot/lv_example_snapshot.h: -------------------------------------------------------------------------------- 1 | /** 2 | * @file lv_example_snapshot.h 3 | * 4 | */ 5 | 6 | #ifndef LV_EX_SNAPSHOT_H 7 | #define LV_EX_SNAPSHOT_H 8 | 9 | #ifdef __cplusplus 10 | extern "C" { 11 | #endif 12 | 13 | /********************* 14 | * INCLUDES 15 | *********************/ 16 | 17 | /********************* 18 | * DEFINES 19 | *********************/ 20 | 21 | /********************** 22 | * TYPEDEFS 23 | **********************/ 24 | 25 | /********************** 26 | * GLOBAL PROTOTYPES 27 | **********************/ 28 | void lv_example_snapshot_1(void); 29 | 30 | /********************** 31 | * MACROS 32 | **********************/ 33 | 34 | #ifdef __cplusplus 35 | } /*extern "C"*/ 36 | #endif 37 | 38 | #endif /*LV_EX_GET_STARTED_H*/ 39 | -------------------------------------------------------------------------------- /others/snapshot/lv_example_snapshot_1.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_SNAPSHOT && LV_BUILD_EXAMPLES 3 | 4 | static void event_cb(lv_event_t * e) 5 | { 6 | lv_obj_t * snapshot_obj = lv_event_get_user_data(e); 7 | lv_obj_t * img = lv_event_get_target(e); 8 | 9 | if(snapshot_obj) { 10 | lv_img_dsc_t * snapshot = (void *)lv_img_get_src(snapshot_obj); 11 | if(snapshot) { 12 | lv_snapshot_free(snapshot); 13 | } 14 | 15 | /*Update the snapshot, we know parent of object is the container.*/ 16 | snapshot = lv_snapshot_take(img->parent, LV_IMG_CF_TRUE_COLOR_ALPHA); 17 | if(snapshot == NULL) 18 | return; 19 | lv_img_set_src(snapshot_obj, snapshot); 20 | } 21 | } 22 | 23 | void lv_example_snapshot_1(void) 24 | { 25 | LV_IMG_DECLARE(img_star); 26 | lv_obj_t * root = lv_scr_act(); 27 | lv_obj_set_style_bg_color(root, lv_palette_main(LV_PALETTE_LIGHT_BLUE), 0); 28 | 29 | /*Create an image object to show snapshot*/ 30 | lv_obj_t * snapshot_obj = lv_img_create(root); 31 | lv_obj_set_style_bg_color(snapshot_obj, lv_palette_main(LV_PALETTE_PURPLE), 0); 32 | lv_obj_set_style_bg_opa(snapshot_obj, LV_OPA_100, 0); 33 | lv_img_set_zoom(snapshot_obj, 128); 34 | lv_img_set_angle(snapshot_obj, 300); 35 | 36 | /*Create the container and its children*/ 37 | lv_obj_t * container = lv_obj_create(root); 38 | 39 | lv_obj_center(container); 40 | lv_obj_set_size(container, 180, 180); 41 | lv_obj_set_flex_flow(container, LV_FLEX_FLOW_ROW_WRAP); 42 | lv_obj_set_flex_align(container, LV_FLEX_ALIGN_SPACE_EVENLY, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER); 43 | lv_obj_set_style_radius(container, 50, 0); 44 | lv_obj_t * img; 45 | int i; 46 | for(i = 0; i < 4; i++) { 47 | img = lv_img_create(container); 48 | lv_img_set_src(img, &img_star); 49 | lv_obj_set_style_bg_color(img, lv_color_black(), 0); 50 | lv_obj_set_style_bg_opa(img, LV_OPA_COVER, 0); 51 | lv_obj_set_style_transform_zoom(img, 400, LV_STATE_PRESSED); 52 | lv_obj_add_flag(img, LV_OBJ_FLAG_CLICKABLE); 53 | lv_obj_add_event_cb(img, event_cb, LV_EVENT_PRESSED, snapshot_obj); 54 | lv_obj_add_event_cb(img, event_cb, LV_EVENT_RELEASED, snapshot_obj); 55 | } 56 | } 57 | 58 | #endif 59 | -------------------------------------------------------------------------------- /others/snapshot/lv_example_snapshot_1.py: -------------------------------------------------------------------------------- 1 | import gc 2 | import lvgl as lv 3 | from imagetools import get_png_info, open_png 4 | 5 | # Register PNG image decoder 6 | decoder = lv.img.decoder_create() 7 | decoder.info_cb = get_png_info 8 | decoder.open_cb = open_png 9 | 10 | # Measure memory usage 11 | gc.enable() 12 | gc.collect() 13 | mem_free = gc.mem_free() 14 | 15 | label = lv.label(lv.scr_act()) 16 | label.align(lv.ALIGN.BOTTOM_MID, 0, -10) 17 | label.set_text(" memory free:" + str(mem_free/1024) + " kB") 18 | 19 | # Create an image from the png file 20 | try: 21 | with open('../../assets/img_star.png','rb') as f: 22 | png_data = f.read() 23 | except: 24 | print("Could not find star.png") 25 | sys.exit() 26 | 27 | img_star = lv.img_dsc_t({ 28 | 'data_size': len(png_data), 29 | 'data': png_data 30 | }) 31 | 32 | def event_cb(e, snapshot_obj): 33 | img = e.get_target() 34 | 35 | if snapshot_obj: 36 | # no need to free the old source for snapshot_obj, gc will free it for us. 37 | 38 | # take a new snapshot, overwrite the old one 39 | dsc = lv.snapshot_take(img.get_parent(), lv.img.CF.TRUE_COLOR_ALPHA) 40 | snapshot_obj.set_src(dsc) 41 | 42 | gc.collect() 43 | mem_used = mem_free - gc.mem_free() 44 | label.set_text("memory used:" + str(mem_used/1024) + " kB") 45 | 46 | root = lv.scr_act() 47 | root.set_style_bg_color(lv.palette_main(lv.PALETTE.LIGHT_BLUE), 0) 48 | 49 | # Create an image object to show snapshot 50 | snapshot_obj = lv.img(root) 51 | snapshot_obj.set_style_bg_color(lv.palette_main(lv.PALETTE.PURPLE), 0) 52 | snapshot_obj.set_style_bg_opa(lv.OPA.COVER, 0) 53 | snapshot_obj.set_zoom(128) 54 | 55 | # Create the container and its children 56 | container = lv.obj(root) 57 | container.align(lv.ALIGN.CENTER, 0, 0) 58 | container.set_size(180, 180) 59 | container.set_flex_flow(lv.FLEX_FLOW.ROW_WRAP) 60 | container.set_flex_align(lv.FLEX_ALIGN.SPACE_EVENLY, lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER) 61 | container.set_style_radius(50, 0) 62 | 63 | for i in range(4): 64 | img = lv.img(container) 65 | img.set_src(img_star) 66 | img.set_style_bg_color(lv.palette_main(lv.PALETTE.GREY), 0) 67 | img.set_style_bg_opa(lv.OPA.COVER, 0) 68 | img.set_style_transform_zoom(400, lv.STATE.PRESSED) 69 | img.add_flag(img.FLAG.CLICKABLE) 70 | img.add_event_cb(lambda e: event_cb(e, snapshot_obj), lv.EVENT.PRESSED, None) 71 | img.add_event_cb(lambda e: event_cb(e, snapshot_obj), lv.EVENT.RELEASED, None) 72 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Demonstrate how scrolling appears automatically 8 | # 9 | # Create an object with the new style 10 | panel = lv.obj(lv.scr_act()) 11 | panel.set_size(200, 200) 12 | panel.center() 13 | 14 | child = lv.obj(panel) 15 | child.set_pos(0, 0) 16 | label = lv.label(child) 17 | label.set_text("Zero") 18 | label.center() 19 | 20 | child = lv.obj(panel) 21 | child.set_pos(-40, 100) 22 | label = lv.label(child) 23 | label.set_text("Left") 24 | label.center() 25 | 26 | child = lv.obj(panel) 27 | child.set_pos(90, -30) 28 | label = lv.label(child) 29 | label.set_text("Top") 30 | label.center() 31 | 32 | child = lv.obj(panel) 33 | child.set_pos(150, 80) 34 | label = lv.label(child) 35 | label.set_text("Right") 36 | label.center() 37 | 38 | child = lv.obj(panel) 39 | child.set_pos(60, 170) 40 | label = lv.label(child) 41 | label.set_text("Bottom") 42 | label.center() 43 | 44 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def sw_event_cb(e,panel): 7 | 8 | code = e.get_code() 9 | sw = e.get_target() 10 | 11 | if code == lv.EVENT.VALUE_CHANGED: 12 | 13 | if sw.has_state(lv.STATE.CHECKED): 14 | panel.add_flag(lv.obj.FLAG.SCROLL_ONE) 15 | else: 16 | panel.clear_flag(lv.obj.FLAG.SCROLL_ONE) 17 | 18 | 19 | # 20 | # Show an example to scroll snap 21 | # 22 | 23 | panel = lv.obj(lv.scr_act()) 24 | panel.set_size(280, 150) 25 | panel.set_scroll_snap_x(lv.SCROLL_SNAP.CENTER) 26 | panel.set_flex_flow(lv.FLEX_FLOW.ROW) 27 | panel.center() 28 | 29 | for i in range(10): 30 | btn = lv.btn(panel) 31 | btn.set_size(150, 100) 32 | 33 | label = lv.label(btn) 34 | if i == 3: 35 | label.set_text("Panel {:d}\nno snap".format(i)) 36 | btn.clear_flag(lv.obj.FLAG.SNAPABLE) 37 | else: 38 | label.set_text("Panel {:d}".format(i)) 39 | label.center() 40 | 41 | panel.update_snap(lv.ANIM.ON) 42 | 43 | 44 | # Switch between "One scroll" and "Normal scroll" mode 45 | sw = lv.switch(lv.scr_act()); 46 | sw.align(lv.ALIGN.TOP_RIGHT, -20, 10) 47 | sw.add_event_cb(lambda evt: sw_event_cb(evt,panel), lv.EVENT.ALL, None) 48 | label = lv.label(lv.scr_act()) 49 | label.set_text("One scroll") 50 | label.align_to(sw, lv.ALIGN.OUT_BOTTOM_MID, 0, 5) 51 | 52 | 53 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | class ScrollExample_3(): 7 | def __init__(self): 8 | self.btn_cnt = 1 9 | # 10 | # Create a list a with a floating button 11 | # 12 | 13 | list = lv.list(lv.scr_act()) 14 | list.set_size(280, 220) 15 | list.center() 16 | 17 | for btn_cnt in range(2): 18 | list.add_btn(lv.SYMBOL.AUDIO,"Track {:d}".format(btn_cnt)) 19 | 20 | float_btn = lv.btn(list) 21 | float_btn.set_size(50, 50) 22 | float_btn.add_flag(lv.obj.FLAG.FLOATING) 23 | float_btn.align(lv.ALIGN.BOTTOM_RIGHT, 0, -list.get_style_pad_right(lv.PART.MAIN)) 24 | float_btn.add_event_cb(lambda evt: self.float_btn_event_cb(evt,list), lv.EVENT.ALL, None) 25 | float_btn.set_style_radius(lv.RADIUS.CIRCLE, 0) 26 | float_btn.set_style_bg_img_src(lv.SYMBOL.PLUS, 0) 27 | float_btn.set_style_text_font(lv.theme_get_font_large(float_btn), 0) 28 | 29 | def float_btn_event_cb(self,e,list): 30 | code = e.get_code() 31 | float_btn = e.get_target() 32 | 33 | if code == lv.EVENT.CLICKED: 34 | list_btn = list.add_btn(lv.SYMBOL.AUDIO, "Track {:d}".format(self.btn_cnt)) 35 | self.btn_cnt += 1 36 | 37 | float_btn.move_foreground() 38 | 39 | list_btn.scroll_to_view(lv.ANIM.ON) 40 | 41 | scroll_example_3 = ScrollExample_3() 42 | 43 | 44 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_4.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Styling the scrollbars 8 | # 9 | obj = lv.obj(lv.scr_act()) 10 | obj.set_size(200, 100) 11 | obj.center() 12 | 13 | label = lv.label(obj) 14 | label.set_text( 15 | """ 16 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 17 | Etiam dictum, tortor vestibulum lacinia laoreet, mi neque consectetur neque, vel mattis odio dolor egestas ligula. 18 | Sed vestibulum sapien nulla, id convallis ex porttitor nec. 19 | Duis et massa eu libero accumsan faucibus a in arcu. 20 | Ut pulvinar odio lorem, vel tempus turpis condimentum quis. Nam consectetur condimentum sem in auctor. 21 | Sed nisl augue, venenatis in blandit et, gravida ac tortor. 22 | Etiam dapibus elementum suscipit. 23 | Proin mollis sollicitudin convallis. 24 | Integer dapibus tempus arcu nec viverra. 25 | Donec molestie nulla enim, eu interdum velit placerat quis. 26 | Donec id efficitur risus, at molestie turpis. 27 | Suspendisse vestibulum consectetur nunc ut commodo. 28 | Fusce molestie rhoncus nisi sit amet tincidunt. 29 | Suspendisse a nunc ut magna ornare volutpat. 30 | """) 31 | 32 | 33 | # Remove the style of scrollbar to have clean start 34 | obj.remove_style(None, lv.PART.SCROLLBAR | lv.STATE.ANY) 35 | 36 | # Create a transition the animate the some properties on state change 37 | props = [lv.STYLE.BG_OPA, lv.STYLE.WIDTH, 0] 38 | trans = lv.style_transition_dsc_t() 39 | trans.init(props, lv.anim_t.path_linear, 200, 0, None) 40 | 41 | # Create a style for the scrollbars 42 | style = lv.style_t() 43 | style.init() 44 | style.set_width(4) # Width of the scrollbar 45 | style.set_pad_right(5) # Space from the parallel side 46 | style.set_pad_top(5) # Space from the perpendicular side 47 | 48 | style.set_radius(2) 49 | style.set_bg_opa(lv.OPA._70) 50 | style.set_bg_color(lv.palette_main(lv.PALETTE.BLUE)) 51 | style.set_border_color(lv.palette_darken(lv.PALETTE.BLUE, 3)) 52 | style.set_border_width(2) 53 | style.set_shadow_width(8) 54 | style.set_shadow_spread(2) 55 | style.set_shadow_color(lv.palette_darken(lv.PALETTE.BLUE, 1)) 56 | 57 | style.set_transition(trans) 58 | 59 | # Make the scrollbars wider and use 100% opacity when scrolled 60 | style_scrolled = lv.style_t() 61 | style_scrolled.init() 62 | style_scrolled.set_width(8) 63 | style_scrolled.set_bg_opa(lv.OPA.COVER) 64 | 65 | obj.add_style(style, lv.PART.SCROLLBAR) 66 | obj.add_style(style_scrolled, lv.PART.SCROLLBAR | lv.STATE.SCROLLED) 67 | 68 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_5.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Scrolling with Right To Left base direction 8 | # 9 | obj = lv.obj(lv.scr_act()) 10 | obj.set_style_base_dir(lv.BASE_DIR.RTL, 0) 11 | obj.set_size(200, 100) 12 | obj.center() 13 | 14 | label = lv.label(obj) 15 | label.set_text("میکروکُنترولر (به انگلیسی: Microcontroller) گونه‌ای ریزپردازنده است که دارای حافظهٔ دسترسی تصادفی (RAM) و حافظهٔ فقط‌خواندنی (ROM)، تایمر، پورت‌های ورودی و خروجی (I/O) و درگاه ترتیبی (Serial Port پورت سریال)، درون خود تراشه است، و می‌تواند به تنهایی ابزارهای دیگر را کنترل کند. به عبارت دیگر یک میکروکنترلر، مدار مجتمع کوچکی است که از یک CPU کوچک و اجزای دیگری مانند تایمر، درگاه‌های ورودی و خروجی آنالوگ و دیجیتال و حافظه تشکیل شده‌است.") 16 | label.set_width(400) 17 | label.set_style_text_font(lv.font_dejavu_16_persian_hebrew, 0) 18 | 19 | -------------------------------------------------------------------------------- /scroll/lv_example_scroll_6.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def scroll_event_cb(e): 7 | 8 | cont = e.get_target() 9 | 10 | cont_a = lv.area_t() 11 | cont.get_coords(cont_a) 12 | cont_y_center = cont_a.y1 + cont_a.get_height() // 2 13 | 14 | r = cont.get_height() * 7 // 10 15 | 16 | child_cnt = cont.get_child_cnt() 17 | for i in range(child_cnt): 18 | child = cont.get_child(i) 19 | child_a = lv.area_t() 20 | child.get_coords(child_a) 21 | 22 | child_y_center = child_a.y1 + child_a.get_height() // 2 23 | 24 | diff_y = child_y_center - cont_y_center; 25 | diff_y = abs(diff_y) 26 | 27 | # Get the x of diff_y on a circle. 28 | 29 | # If diff_y is out of the circle use the last point of the circle (the radius) 30 | if diff_y >= r: 31 | x = r 32 | else: 33 | # Use Pythagoras theorem to get x from radius and y 34 | x_sqr = r * r - diff_y * diff_y; 35 | res = lv.sqrt_res_t() 36 | lv.sqrt(x_sqr, res, 0x8000) # Use lvgl's built in sqrt root function 37 | x = r - res.i 38 | 39 | # Translate the item by the calculated X coordinate 40 | child.set_style_translate_x(x, 0) 41 | 42 | # Use some opacity with larger translations 43 | opa = lv.map(x, 0, r, lv.OPA.TRANSP, lv.OPA.COVER) 44 | child.set_style_opa(lv.OPA.COVER - opa, 0) 45 | 46 | # 47 | # Translate the object as they scroll 48 | # 49 | 50 | cont = lv.obj(lv.scr_act()) 51 | cont.set_size(200, 200) 52 | cont.center() 53 | cont.set_flex_flow(lv.FLEX_FLOW.COLUMN) 54 | cont.add_event_cb(scroll_event_cb, lv.EVENT.SCROLL, None) 55 | cont.set_style_radius(lv.RADIUS.CIRCLE, 0) 56 | cont.set_style_clip_corner(True, 0) 57 | cont.set_scroll_dir(lv.DIR.VER) 58 | cont.set_scroll_snap_y(lv.SCROLL_SNAP.CENTER) 59 | cont.set_scrollbar_mode(lv.SCROLLBAR_MODE.OFF) 60 | 61 | for i in range(20): 62 | btn = lv.btn(cont) 63 | btn.set_width(lv.pct(100)) 64 | 65 | label = lv.label(btn) 66 | label.set_text("Button " + str(i)) 67 | 68 | # Update the buttons position manually for first* 69 | lv.event_send(cont, lv.EVENT.SCROLL, None) 70 | 71 | # Be sure the fist button is in the middle 72 | #lv.obj.scroll_to_view(cont.get_child(0), lv.ANIM.OFF) 73 | cont.get_child(0).scroll_to_view(lv.ANIM.OFF) 74 | -------------------------------------------------------------------------------- /styles/lv_example_style_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the Size, Position and Padding style properties 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | style.set_radius(5) 12 | 13 | # Make a gradient 14 | style.set_width(150) 15 | style.set_height(lv.SIZE.CONTENT) 16 | 17 | style.set_pad_ver(20) 18 | style.set_pad_left(5) 19 | 20 | style.set_x(lv.pct(50)) 21 | style.set_y(80) 22 | 23 | # Create an object with the new style 24 | obj = lv.obj(lv.scr_act()) 25 | obj.add_style(style, 0) 26 | 27 | label = lv.label(obj) 28 | label.set_text("Hello"); 29 | 30 | -------------------------------------------------------------------------------- /styles/lv_example_style_10.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Creating a transition 8 | # 9 | 10 | props = [lv.STYLE.BG_COLOR, lv.STYLE.BORDER_COLOR, lv.STYLE.BORDER_WIDTH, 0] 11 | 12 | # A default transition 13 | # Make it fast (100ms) and start with some delay (200 ms) 14 | 15 | trans_def = lv.style_transition_dsc_t() 16 | trans_def.init(props, lv.anim_t.path_linear, 100, 200, None) 17 | 18 | # A special transition when going to pressed state 19 | # Make it slow (500 ms) but start without delay 20 | 21 | trans_pr = lv.style_transition_dsc_t() 22 | trans_pr.init(props, lv.anim_t.path_linear, 500, 0, None) 23 | 24 | style_def = lv.style_t() 25 | style_def.init() 26 | style_def.set_transition(trans_def) 27 | 28 | style_pr = lv.style_t() 29 | style_pr.init() 30 | style_pr.set_bg_color(lv.palette_main(lv.PALETTE.RED)) 31 | style_pr.set_border_width(6) 32 | style_pr.set_border_color(lv.palette_darken(lv.PALETTE.RED, 3)) 33 | style_pr.set_transition(trans_pr) 34 | 35 | # Create an object with the new style_pr 36 | obj = lv.obj(lv.scr_act()) 37 | obj.add_style(style_def, 0) 38 | obj.add_style(style_pr, lv.STATE.PRESSED) 39 | 40 | obj.center() 41 | 42 | -------------------------------------------------------------------------------- /styles/lv_example_style_11.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using multiple styles 8 | # 9 | # A base style 10 | 11 | style_base = lv.style_t() 12 | style_base.init() 13 | style_base.set_bg_color(lv.palette_main(lv.PALETTE.LIGHT_BLUE)) 14 | style_base.set_border_color(lv.palette_darken(lv.PALETTE.LIGHT_BLUE, 3)) 15 | style_base.set_border_width(2) 16 | style_base.set_radius(10) 17 | style_base.set_shadow_width(10) 18 | style_base.set_shadow_ofs_y(5) 19 | style_base.set_shadow_opa(lv.OPA._50) 20 | style_base.set_text_color(lv.color_white()) 21 | style_base.set_width(100) 22 | style_base.set_height(lv.SIZE.CONTENT) 23 | 24 | # Set only the properties that should be different 25 | style_warning = lv.style_t() 26 | style_warning.init() 27 | style_warning.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW)) 28 | style_warning.set_border_color(lv.palette_darken(lv.PALETTE.YELLOW, 3)) 29 | style_warning.set_text_color(lv.palette_darken(lv.PALETTE.YELLOW, 4)) 30 | 31 | # Create an object with the base style only 32 | obj_base = lv.obj(lv.scr_act()) 33 | obj_base.add_style(style_base, 0) 34 | obj_base.align(lv.ALIGN.LEFT_MID, 20, 0) 35 | 36 | label = lv.label(obj_base) 37 | label.set_text("Base") 38 | label.center() 39 | 40 | # Create an other object with the base style and earnings style too 41 | obj_warning = lv.obj(lv.scr_act()) 42 | obj_warning.add_style(style_base, 0) 43 | obj_warning.add_style(style_warning, 0) 44 | obj_warning.align(lv.ALIGN.RIGHT_MID, -20, 0) 45 | 46 | label = lv.label(obj_warning) 47 | label.set_text("Warning") 48 | label.center() 49 | 50 | -------------------------------------------------------------------------------- /styles/lv_example_style_12.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Local styles 8 | # 9 | 10 | style = lv.style_t() 11 | style.init() 12 | style.set_bg_color(lv.palette_main(lv.PALETTE.GREEN)) 13 | style.set_border_color(lv.palette_lighten(lv.PALETTE.GREEN, 3)) 14 | style.set_border_width(3) 15 | 16 | obj = lv.obj(lv.scr_act()) 17 | obj.add_style(style, 0) 18 | 19 | # Overwrite the background color locally 20 | obj.set_style_bg_color(lv.palette_main(lv.PALETTE.ORANGE), lv.PART.MAIN) 21 | 22 | obj.center() 23 | 24 | -------------------------------------------------------------------------------- /styles/lv_example_style_13.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Add styles to parts and states 8 | # 9 | 10 | style_indic = lv.style_t() 11 | style_indic.init() 12 | style_indic.set_bg_color(lv.palette_lighten(lv.PALETTE.RED, 3)) 13 | style_indic.set_bg_grad_color(lv.palette_main(lv.PALETTE.RED)) 14 | style_indic.set_bg_grad_dir(lv.GRAD_DIR.HOR) 15 | 16 | style_indic_pr = lv.style_t() 17 | style_indic_pr.init() 18 | style_indic_pr.set_shadow_color(lv.palette_main(lv.PALETTE.RED)) 19 | style_indic_pr.set_shadow_width(10) 20 | style_indic_pr.set_shadow_spread(3) 21 | 22 | # Create an object with the new style_pr 23 | obj = lv.slider(lv.scr_act()) 24 | obj.add_style(style_indic, lv.PART.INDICATOR) 25 | obj.add_style(style_indic_pr, lv.PART.INDICATOR | lv.STATE.PRESSED) 26 | obj.set_value(70, lv.ANIM.OFF) 27 | obj.center() 28 | 29 | -------------------------------------------------------------------------------- /styles/lv_example_style_14.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # Will be called when the styles of the base theme are already added 7 | # to add new styles 8 | 9 | 10 | class NewTheme(lv.theme_t): 11 | def __init__(self): 12 | super().__init__() 13 | # Initialize the styles 14 | self.style_btn = lv.style_t() 15 | self.style_btn.init() 16 | self.style_btn.set_bg_color(lv.palette_main(lv.PALETTE.GREEN)) 17 | self.style_btn.set_border_color(lv.palette_darken(lv.PALETTE.GREEN, 3)) 18 | self.style_btn.set_border_width(3) 19 | 20 | # This theme is based on active theme 21 | th_act = lv.theme_get_from_obj(lv.scr_act()) 22 | # This theme will be applied only after base theme is applied 23 | self.set_parent(th_act) 24 | 25 | class ExampleStyle_14(): 26 | 27 | def __init__(self): 28 | # 29 | # Extending the current theme 30 | # 31 | 32 | btn = lv.btn(lv.scr_act()) 33 | btn.align(lv.ALIGN.TOP_MID, 0, 20) 34 | 35 | label = lv.label(btn) 36 | label.set_text("Original theme") 37 | 38 | self.new_theme_init_and_set() 39 | 40 | btn = lv.btn(lv.scr_act()) 41 | btn.align(lv.ALIGN.BOTTOM_MID, 0, -20) 42 | 43 | label = lv.label(btn) 44 | label.set_text("New theme") 45 | 46 | def new_theme_apply_cb(self,th, obj): 47 | print(th,obj) 48 | if obj.get_class() == lv.btn_class: 49 | obj.add_style(self.th_new.style_btn, 0) 50 | 51 | def new_theme_init_and_set(self): 52 | print("new_theme_init_and_set") 53 | # Initialize the new theme from the current theme 54 | self.th_new = NewTheme() 55 | self.th_new.set_apply_cb(self.new_theme_apply_cb) 56 | lv.disp_get_default().set_theme(self.th_new) 57 | 58 | exampleStyle_14 = ExampleStyle_14() 59 | -------------------------------------------------------------------------------- /styles/lv_example_style_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the background style properties 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | style.set_radius(5) 12 | 13 | # Make a gradient 14 | style.set_bg_opa(lv.OPA.COVER) 15 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1)) 16 | style.set_bg_grad_color(lv.palette_main(lv.PALETTE.BLUE)) 17 | style.set_bg_grad_dir(lv.GRAD_DIR.VER) 18 | 19 | # Shift the gradient to the bottom 20 | style.set_bg_main_stop(128) 21 | style.set_bg_grad_stop(192) 22 | 23 | # Create an object with the new style 24 | obj = lv.obj(lv.scr_act()) 25 | obj.add_style(style, 0) 26 | obj.center() 27 | 28 | -------------------------------------------------------------------------------- /styles/lv_example_style_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the border style properties 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | 12 | # Set a background color and a radius 13 | style.set_radius(10) 14 | style.set_bg_opa(lv.OPA.COVER) 15 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1)) 16 | 17 | # Add border to the bottom+right 18 | style.set_border_color(lv.palette_main(lv.PALETTE.BLUE)) 19 | style.set_border_width(5) 20 | style.set_border_opa(lv.OPA._50) 21 | style.set_border_side(lv.BORDER_SIDE.BOTTOM | lv.BORDER_SIDE.RIGHT) 22 | 23 | # Create an object with the new style 24 | obj = lv.obj(lv.scr_act()) 25 | obj.add_style(style, 0) 26 | obj.center() 27 | 28 | -------------------------------------------------------------------------------- /styles/lv_example_style_4.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the outline style properties 8 | # 9 | 10 | style = lv.style_t() 11 | style.init() 12 | 13 | # Set a background color and a radius 14 | style.set_radius(5) 15 | style.set_bg_opa(lv.OPA.COVER) 16 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1)) 17 | 18 | # Add outline 19 | style.set_outline_width(2) 20 | style.set_outline_color(lv.palette_main(lv.PALETTE.BLUE)) 21 | style.set_outline_pad(8) 22 | 23 | # Create an object with the new style 24 | obj = lv.obj(lv.scr_act()) 25 | obj.add_style(style, 0) 26 | obj.center() 27 | 28 | 29 | -------------------------------------------------------------------------------- /styles/lv_example_style_5.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the Shadow style properties 8 | # 9 | 10 | style = lv.style_t() 11 | style.init() 12 | 13 | # Set a background color and a radius 14 | style.set_radius(5) 15 | style.set_bg_opa(lv.OPA.COVER) 16 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1)) 17 | 18 | # Add a shadow 19 | style.set_shadow_width(8) 20 | style.set_shadow_color(lv.palette_main(lv.PALETTE.BLUE)) 21 | style.set_shadow_ofs_x(10) 22 | style.set_shadow_ofs_y(20) 23 | 24 | # Create an object with the new style 25 | obj = lv.obj(lv.scr_act()) 26 | obj.add_style(style, 0) 27 | obj.center() 28 | 29 | -------------------------------------------------------------------------------- /styles/lv_example_style_6.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | from imagetools import get_png_info, open_png 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../assets/img_cogwheel_argb.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_cogwheel_argb.png") 18 | sys.exit() 19 | 20 | img_cogwheel_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | # 26 | # Using the Image style properties 27 | # 28 | style = lv.style_t() 29 | style.init() 30 | 31 | # Set a background color and a radius 32 | style.set_radius(5) 33 | style.set_bg_opa(lv.OPA.COVER) 34 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3)) 35 | style.set_border_width(2) 36 | style.set_border_color(lv.palette_main(lv.PALETTE.BLUE)) 37 | 38 | style.set_img_recolor(lv.palette_main(lv.PALETTE.BLUE)) 39 | style.set_img_recolor_opa(lv.OPA._50) 40 | # style.set_transform_angle(300) 41 | 42 | # Create an object with the new style 43 | obj = lv.img(lv.scr_act()) 44 | obj.add_style(style, 0) 45 | 46 | obj.set_src(img_cogwheel_argb) 47 | 48 | obj.center() 49 | 50 | -------------------------------------------------------------------------------- /styles/lv_example_style_7.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the Arc style properties 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | 12 | style.set_arc_color(lv.palette_main(lv.PALETTE.RED)) 13 | style.set_arc_width(4) 14 | 15 | # Create an object with the new style 16 | obj = lv.arc(lv.scr_act()) 17 | obj.add_style(style, 0) 18 | obj.center() 19 | 20 | 21 | -------------------------------------------------------------------------------- /styles/lv_example_style_8.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the text style properties 8 | # 9 | 10 | style = lv.style_t() 11 | style.init() 12 | 13 | style.set_radius(5) 14 | style.set_bg_opa(lv.OPA.COVER) 15 | style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3)) 16 | style.set_border_width(2) 17 | style.set_border_color(lv.palette_main(lv.PALETTE.BLUE)) 18 | style.set_pad_all(10) 19 | 20 | style.set_text_color(lv.palette_main(lv.PALETTE.BLUE)) 21 | style.set_text_letter_space(5) 22 | style.set_text_line_space(20) 23 | style.set_text_decor(lv.TEXT_DECOR.UNDERLINE) 24 | 25 | # Create an object with the new style 26 | obj = lv.label(lv.scr_act()) 27 | obj.add_style(style, 0) 28 | obj.set_text("Text of\n" 29 | "a label"); 30 | 31 | obj.center() 32 | 33 | -------------------------------------------------------------------------------- /styles/lv_example_style_9.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Using the line style properties 8 | # 9 | 10 | style = lv.style_t() 11 | style.init() 12 | 13 | style.set_line_color(lv.palette_main(lv.PALETTE.GREY)) 14 | style.set_line_width(6) 15 | style.set_line_rounded(True) 16 | 17 | # Create an object with the new style 18 | obj = lv.line(lv.scr_act()) 19 | obj.add_style(style, 0) 20 | p = [ {"x":10, "y":30}, 21 | {"x":30, "y":50}, 22 | {"x":100, "y":0}] 23 | 24 | obj.set_points(p, 3) 25 | 26 | obj.center() 27 | 28 | -------------------------------------------------------------------------------- /widgets/animimg/lv_example_animimg_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | anim_imgs = [None]*3 13 | # Create an image from the png file 14 | try: 15 | with open('../../assets/animimg001.png','rb') as f: 16 | anim001_data = f.read() 17 | except: 18 | print("Could not find animimg001.png") 19 | sys.exit() 20 | 21 | anim_imgs[0] = lv.img_dsc_t({ 22 | 'data_size': len(anim001_data), 23 | 'data': anim001_data 24 | }) 25 | 26 | try: 27 | with open('../../assets/animimg002.png','rb') as f: 28 | anim002_data = f.read() 29 | except: 30 | print("Could not find animimg002.png") 31 | sys.exit() 32 | 33 | anim_imgs[1] = lv.img_dsc_t({ 34 | 'data_size': len(anim002_data), 35 | 'data': anim002_data 36 | }) 37 | 38 | try: 39 | with open('../../assets/animimg003.png','rb') as f: 40 | anim003_data = f.read() 41 | except: 42 | print("Could not find animimg003.png") 43 | sys.exit() 44 | 45 | anim_imgs[2] = lv.img_dsc_t({ 46 | 'data_size': len(anim003_data), 47 | 'data': anim003_data 48 | }) 49 | 50 | animimg0 = lv.animimg(lv.scr_act()) 51 | animimg0.center() 52 | animimg0.set_src(anim_imgs, 3) 53 | animimg0.set_duration(1000) 54 | animimg0.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 55 | animimg0.start() 56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /widgets/arc/lv_example_arc_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | import time 5 | 6 | # Create an Arc 7 | arc = lv.arc(lv.scr_act()) 8 | arc.set_end_angle(200) 9 | arc.set_size(150, 150) 10 | arc.center() 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /widgets/arc/lv_example_arc_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # An `lv_timer` to call periodically to set the angles of the arc 7 | # 8 | class ArcLoader(): 9 | def __init__(self): 10 | self.a = 270 11 | 12 | def arc_loader_cb(self,tim,arc): 13 | # print(tim,arc) 14 | self.a += 5 15 | 16 | arc.set_end_angle(self.a) 17 | 18 | if self.a >= 270 + 360: 19 | tim._del() 20 | 21 | 22 | # 23 | # Create an arc which acts as a loader. 24 | # 25 | 26 | # Create an Arc 27 | arc = lv.arc(lv.scr_act()) 28 | arc.set_bg_angles(0, 360) 29 | arc.set_angles(270, 270) 30 | arc.center() 31 | 32 | # create the loader 33 | arc_loader = ArcLoader() 34 | 35 | # Create an `lv_timer` to update the arc. 36 | 37 | timer = lv.timer_create_basic() 38 | timer.set_period(20) 39 | timer.set_cb(lambda src: arc_loader.arc_loader_cb(timer,arc)) 40 | 41 | 42 | -------------------------------------------------------------------------------- /widgets/bar/images/Makefile: -------------------------------------------------------------------------------- 1 | CC=gcc 2 | CFLAGS=-g -Wall 3 | 4 | all: img_skew_strip 5 | .PHONY: 6 | clean: 7 | $(RM) *~ img_skew_strip 8 | -------------------------------------------------------------------------------- /widgets/bar/images/img_skew_strip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/bar/images/img_skew_strip -------------------------------------------------------------------------------- /widgets/bar/images/img_skew_strip_80x20_argb8888.bin: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/bar/images/img_skew_strip_80x20_argb8888.bin -------------------------------------------------------------------------------- /widgets/bar/images/skew_strip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/bar/images/skew_strip.png -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | bar1 = lv.bar(lv.scr_act()) 7 | bar1.set_size(200, 20) 8 | bar1.center() 9 | bar1.set_value(70, lv.ANIM.OFF) 10 | 11 | -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Example of styling the bar 7 | # 8 | style_bg = lv.style_t() 9 | style_indic = lv.style_t() 10 | 11 | style_bg.init() 12 | style_bg.set_border_color(lv.palette_main(lv.PALETTE.BLUE)) 13 | style_bg.set_border_width(2) 14 | style_bg.set_pad_all(6) # To make the indicator smaller 15 | style_bg.set_radius(6) 16 | style_bg.set_anim_time(1000) 17 | 18 | style_indic.init() 19 | style_indic.set_bg_opa(lv.OPA.COVER) 20 | style_indic.set_bg_color(lv.palette_main(lv.PALETTE.BLUE)) 21 | style_indic.set_radius(3) 22 | 23 | bar = lv.bar(lv.scr_act()) 24 | bar.remove_style_all() # To have a clean start 25 | bar.add_style(style_bg, 0) 26 | bar.add_style(style_indic, lv.PART.INDICATOR) 27 | 28 | bar.set_size(200, 20) 29 | bar.center() 30 | bar.set_value(100, lv.ANIM.ON) 31 | 32 | -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def set_temp(bar, temp): 7 | bar.set_value(temp, lv.ANIM.ON) 8 | 9 | # 10 | # A temperature meter example 11 | # 12 | 13 | 14 | style_indic = lv.style_t() 15 | 16 | style_indic.init() 17 | style_indic.set_bg_opa(lv.OPA.COVER) 18 | style_indic.set_bg_color(lv.palette_main(lv.PALETTE.RED)) 19 | style_indic.set_bg_grad_color(lv.palette_main(lv.PALETTE.BLUE)) 20 | style_indic.set_bg_grad_dir(lv.GRAD_DIR.VER) 21 | 22 | bar = lv.bar(lv.scr_act()) 23 | bar.add_style(style_indic, lv.PART.INDICATOR) 24 | bar.set_size(20, 200) 25 | bar.center() 26 | bar.set_range(-20, 40) 27 | 28 | a = lv.anim_t() 29 | a.init() 30 | a.set_time(3000) 31 | a.set_playback_time(3000) 32 | a.set_var(bar) 33 | a.set_values(-20, 40) 34 | a.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 35 | a.set_custom_exec_cb(lambda a, val: set_temp(bar,val)) 36 | lv.anim_t.start(a) 37 | 38 | -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | # 6 | # get an icon 7 | # 8 | def get_icon(filename,xres,yres): 9 | try: 10 | sdl_filename = "../../assets/" + filename + "_" + str(xres) + "x" + str(yres) + "_argb8888.bin" 11 | print("file name: ", sdl_filename) 12 | with open(sdl_filename,'rb') as f: 13 | icon_data = f.read() 14 | except: 15 | print("Could not find image file: " + filename) 16 | return None 17 | 18 | icon_dsc = lv.img_dsc_t( 19 | { 20 | "header": {"always_zero": 0, "w": xres, "h": yres, "cf": lv.img.CF.TRUE_COLOR_ALPHA}, 21 | "data": icon_data, 22 | "data_size": len(icon_data), 23 | } 24 | ) 25 | return icon_dsc 26 | 27 | # 28 | # Bar with stripe pattern and ranged value 29 | # 30 | 31 | img_skew_strip_dsc = get_icon("img_skew_strip",80,20) 32 | style_indic = lv.style_t() 33 | 34 | style_indic.init() 35 | style_indic.set_bg_img_src(img_skew_strip_dsc) 36 | style_indic.set_bg_img_tiled(True); 37 | style_indic.set_bg_img_opa(lv.OPA._30) 38 | 39 | bar = lv.bar(lv.scr_act()) 40 | bar.add_style(style_indic, lv.PART.INDICATOR) 41 | 42 | bar.set_size(260, 20) 43 | bar.center() 44 | bar.set_mode(lv.bar.MODE.RANGE) 45 | bar.set_value(90, lv.ANIM.OFF) 46 | bar.set_start_value(20, lv.ANIM.OFF) 47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_5.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | # 5 | # Bar with LTR and RTL base direction 6 | # 7 | 8 | bar_ltr = lv.bar(lv.scr_act()) 9 | bar_ltr.set_size(200, 20) 10 | bar_ltr.set_value(70, lv.ANIM.OFF) 11 | bar_ltr.align(lv.ALIGN.CENTER, 0, -30) 12 | 13 | label = lv.label(lv.scr_act()) 14 | label.set_text("Left to Right base direction") 15 | label.align_to(bar_ltr, lv.ALIGN.OUT_TOP_MID, 0, -5) 16 | 17 | bar_rtl = lv.bar(lv.scr_act()) 18 | bar_rtl.set_style_base_dir(lv.BASE_DIR.RTL,0) 19 | bar_rtl.set_size(200, 20) 20 | bar_rtl.set_value(70, lv.ANIM.OFF) 21 | bar_rtl.align(lv.ALIGN.CENTER, 0, 30) 22 | 23 | label = lv.label(lv.scr_act()) 24 | label.set_text("Right to Left base direction") 25 | label.align_to(bar_rtl, lv.ALIGN.OUT_TOP_MID, 0, -5) 26 | -------------------------------------------------------------------------------- /widgets/bar/lv_example_bar_6.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | def set_value(bar, v): 6 | bar.set_value(v, lv.ANIM.OFF) 7 | 8 | def event_cb(e): 9 | dsc = lv.obj_draw_part_dsc_t.__cast__(e.get_param()) 10 | if dsc.part != lv.PART.INDICATOR: 11 | return 12 | 13 | obj= lv.bar.__cast__(e.get_target()) 14 | 15 | label_dsc = lv.draw_label_dsc_t() 16 | label_dsc.init() 17 | # label_dsc.font = LV_FONT_DEFAULT; 18 | 19 | value_txt = str(obj.get_value()) 20 | txt_size = lv.point_t() 21 | lv.txt_get_size(txt_size, value_txt, label_dsc.font, label_dsc.letter_space, label_dsc.line_space, lv.COORD.MAX, label_dsc.flag) 22 | 23 | txt_area = lv.area_t() 24 | # If the indicator is long enough put the text inside on the right 25 | if dsc.draw_area.get_width() > txt_size.x + 20: 26 | txt_area.x2 = dsc.draw_area.x2 - 5 27 | txt_area.x1 = txt_area.x2 - txt_size.x + 1 28 | label_dsc.color = lv.color_white() 29 | # If the indicator is still short put the text out of it on the right*/ 30 | else: 31 | txt_area.x1 = dsc.draw_area.x2 + 5 32 | txt_area.x2 = txt_area.x1 + txt_size.x - 1 33 | label_dsc.color = lv.color_black() 34 | 35 | txt_area.y1 = dsc.draw_area.y1 + (dsc.draw_area.get_height() - txt_size.y) // 2 36 | txt_area.y2 = txt_area.y1 + txt_size.y - 1 37 | 38 | lv.draw_label(txt_area, dsc.clip_area, label_dsc, value_txt, None) 39 | 40 | # 41 | # Custom drawer on the bar to display the current value 42 | # 43 | 44 | bar = lv.bar(lv.scr_act()) 45 | bar.add_event_cb(event_cb, lv.EVENT.DRAW_PART_END, None) 46 | bar.set_size(200, 20) 47 | bar.center() 48 | 49 | a = lv.anim_t() 50 | a.init() 51 | a.set_var(bar) 52 | a.set_values(0, 100) 53 | a.set_custom_exec_cb(lambda a,val: set_value(bar,val)) 54 | a.set_time(2000) 55 | a.set_playback_time(2000) 56 | a.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 57 | lv.anim_t.start(a) 58 | 59 | -------------------------------------------------------------------------------- /widgets/btn/lv_example_btn_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(evt): 7 | code = evt.get_code() 8 | 9 | if code == lv.EVENT.CLICKED: 10 | print("Clicked event seen") 11 | elif code == lv.EVENT.VALUE_CHANGED: 12 | print("Value changed seen") 13 | 14 | # create a simple button 15 | btn1 = lv.btn(lv.scr_act()) 16 | 17 | # attach the callback 18 | btn1.add_event_cb(event_handler,lv.EVENT.ALL, None) 19 | 20 | btn1.align(lv.ALIGN.CENTER,0,-40) 21 | label=lv.label(btn1) 22 | label.set_text("Button") 23 | 24 | # create a toggle button 25 | btn2 = lv.btn(lv.scr_act()) 26 | 27 | # attach the callback 28 | #btn2.add_event_cb(event_handler,lv.EVENT.VALUE_CHANGED,None) 29 | btn2.add_event_cb(event_handler,lv.EVENT.ALL, None) 30 | 31 | btn2.align(lv.ALIGN.CENTER,0,40) 32 | btn2.add_flag(lv.obj.FLAG.CHECKABLE) 33 | btn2.set_height(lv.SIZE.CONTENT) 34 | 35 | label=lv.label(btn2) 36 | label.set_text("Toggle") 37 | label.center() 38 | -------------------------------------------------------------------------------- /widgets/btn/lv_example_btn_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Style a button from scratch 7 | # 8 | 9 | # Init the style for the default state 10 | style = lv.style_t() 11 | style.init() 12 | 13 | style.set_radius(3) 14 | 15 | style.set_bg_opa(lv.OPA.COVER) 16 | style.set_bg_color(lv.palette_main(lv.PALETTE.BLUE)) 17 | style.set_bg_grad_color(lv.palette_darken(lv.PALETTE.BLUE, 2)) 18 | style.set_bg_grad_dir(lv.GRAD_DIR.VER) 19 | 20 | style.set_border_opa(lv.OPA._40) 21 | style.set_border_width(2) 22 | style.set_border_color(lv.palette_main(lv.PALETTE.GREY)) 23 | 24 | style.set_shadow_width(8) 25 | style.set_shadow_color(lv.palette_main(lv.PALETTE.GREY)) 26 | style.set_shadow_ofs_y(8) 27 | 28 | style.set_outline_opa(lv.OPA.COVER) 29 | style.set_outline_color(lv.palette_main(lv.PALETTE.BLUE)) 30 | 31 | style.set_text_color(lv.color_white()) 32 | style.set_pad_all(10) 33 | 34 | # Init the pressed style 35 | style_pr = lv.style_t() 36 | style_pr.init() 37 | 38 | # Add a large outline when pressed 39 | style_pr.set_outline_width(30) 40 | style_pr.set_outline_opa(lv.OPA.TRANSP) 41 | 42 | style_pr.set_translate_y(5) 43 | style_pr.set_shadow_ofs_y(3) 44 | style_pr.set_bg_color(lv.palette_darken(lv.PALETTE.BLUE, 2)) 45 | style_pr.set_bg_grad_color(lv.palette_darken(lv.PALETTE.BLUE, 4)) 46 | 47 | # Add a transition to the the outline 48 | trans = lv.style_transition_dsc_t() 49 | props = [lv.STYLE.OUTLINE_WIDTH, lv.STYLE.OUTLINE_OPA, 0] 50 | trans.init(props, lv.anim_t.path_linear, 300, 0, None) 51 | 52 | style_pr.set_transition(trans) 53 | 54 | btn1 = lv.btn(lv.scr_act()) 55 | btn1.remove_style_all() # Remove the style coming from the theme 56 | btn1.add_style(style, 0) 57 | btn1.add_style(style_pr, lv.STATE.PRESSED) 58 | btn1.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 59 | btn1.center() 60 | 61 | label = lv.label(btn1) 62 | label.set_text("Button") 63 | label.center() 64 | 65 | -------------------------------------------------------------------------------- /widgets/btn/lv_example_btn_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Create a style transition on a button to act like a gum when clicked 8 | # 9 | 10 | # Properties to transition 11 | props = [lv.STYLE.TRANSFORM_WIDTH, lv.STYLE.TRANSFORM_HEIGHT, lv.STYLE.TEXT_LETTER_SPACE, 0] 12 | 13 | # Transition descriptor when going back to the default state. 14 | # Add some delay to be sure the press transition is visible even if the press was very short*/ 15 | transition_dsc_def = lv.style_transition_dsc_t() 16 | transition_dsc_def.init(props, lv.anim_t.path_overshoot, 250, 100, None) 17 | 18 | # Transition descriptor when going to pressed state. 19 | # No delay, go to presses state immediately 20 | transition_dsc_pr = lv.style_transition_dsc_t() 21 | transition_dsc_pr.init(props, lv.anim_t.path_ease_in_out, 250, 0, None) 22 | 23 | # Add only the new transition to he default state 24 | style_def = lv.style_t() 25 | style_def.init() 26 | style_def.set_transition(transition_dsc_def) 27 | 28 | # Add the transition and some transformation to the presses state. 29 | style_pr = lv.style_t() 30 | style_pr.init() 31 | style_pr.set_transform_width(10) 32 | style_pr.set_transform_height(-10) 33 | style_pr.set_text_letter_space(10) 34 | style_pr.set_transition(transition_dsc_pr) 35 | 36 | btn1 = lv.btn(lv.scr_act()) 37 | btn1.align(lv.ALIGN.CENTER, 0, -80) 38 | btn1.add_style(style_pr, lv.STATE.PRESSED) 39 | btn1.add_style(style_def, 0) 40 | 41 | label = lv.label(btn1) 42 | label.set_text("Gum"); 43 | 44 | -------------------------------------------------------------------------------- /widgets/btnmatrix/lv_example_btnmatrix_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(evt): 7 | code = evt.get_code() 8 | obj = evt.get_target() 9 | 10 | if code == lv.EVENT.VALUE_CHANGED : 11 | id = obj.get_selected_btn() 12 | txt = obj.get_btn_text(id) 13 | 14 | print("%s was pressed"%txt) 15 | 16 | btnm_map = ["1", "2", "3", "4", "5", "\n", 17 | "6", "7", "8", "9", "0", "\n", 18 | "Action1", "Action2", ""] 19 | 20 | btnm1 = lv.btnmatrix(lv.scr_act()) 21 | btnm1.set_map(btnm_map) 22 | btnm1.set_btn_width(10, 2) # Make "Action1" twice as wide as "Action2" 23 | btnm1.set_btn_ctrl(10, lv.btnmatrix.CTRL.CHECKABLE) 24 | btnm1.set_btn_ctrl(11, lv.btnmatrix.CTRL.CHECKED) 25 | btnm1.align(lv.ALIGN.CENTER, 0, 0) 26 | btnm1.add_event_cb(event_handler, lv.EVENT.ALL, None) 27 | 28 | 29 | #endif 30 | -------------------------------------------------------------------------------- /widgets/btnmatrix/lv_example_btnmatrix_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_star.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_star.png") 18 | sys.exit() 19 | 20 | img_star_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | def event_cb(e): 26 | code = e.get_code() 27 | obj = e.get_target() 28 | if code == lv.EVENT.DRAW_PART_BEGIN: 29 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 30 | # Change the draw descriptor the 2nd button 31 | if dsc.id == 1: 32 | dsc.rect_dsc.radius = 0; 33 | if obj.get_selected_btn() == dsc.id: 34 | dsc.rect_dsc.bg_color = lv.palette_darken(lv.PALETTE.GREY, 3) 35 | else: 36 | dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.BLUE) 37 | 38 | dsc.rect_dsc.shadow_width = 6 39 | dsc.rect_dsc.shadow_ofs_x = 3 40 | dsc.rect_dsc.shadow_ofs_y = 3 41 | dsc.label_dsc.color = lv.color_white() 42 | 43 | # Change the draw descriptor the 3rd button 44 | 45 | elif dsc.id == 2: 46 | dsc.rect_dsc.radius = lv.RADIUS.CIRCLE 47 | if obj.get_selected_btn() == dsc.id: 48 | dsc.rect_dsc.bg_color = lv.palette_darken(lv.PALETTE.RED, 3) 49 | else: 50 | dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.RED) 51 | 52 | dsc.label_dsc.color = lv.color_white() 53 | elif dsc.id == 3: 54 | dsc.label_dsc.opa = lv.OPA.TRANSP # Hide the text if any 55 | 56 | if code == lv.EVENT.DRAW_PART_END: 57 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 58 | 59 | # Add custom content to the 4th button when the button itself was drawn 60 | if dsc.id == 3: 61 | # LV_IMG_DECLARE(img_star); 62 | header = lv.img_header_t() 63 | res = lv.img.decoder_get_info(img_star_argb, header) 64 | if res != lv.RES.OK: 65 | print("error when getting image header") 66 | return 67 | else: 68 | a = lv.area_t() 69 | a.x1 = dsc.draw_area.x1 + (dsc.draw_area.get_width() - header.w) // 2 70 | a.x2 = a.x1 + header.w - 1; 71 | a.y1 = dsc.draw_area.y1 + (dsc.draw_area.get_height() - header.h) // 2 72 | a.y2 = a.y1 + header.h - 1; 73 | img_draw_dsc = lv.draw_img_dsc_t() 74 | img_draw_dsc.init() 75 | img_draw_dsc.recolor = lv.color_black() 76 | if obj.get_selected_btn() == dsc.id: 77 | img_draw_dsc.recolor_opa = lv.OPA._30 78 | 79 | lv.draw_img(a, dsc.clip_area, img_star_argb, img_draw_dsc) 80 | 81 | # 82 | # Add custom drawer to the button matrix to c 83 | # 84 | btnm = lv.btnmatrix(lv.scr_act()) 85 | btnm.add_event_cb(event_cb, lv.EVENT.ALL, None) 86 | btnm.center() 87 | 88 | -------------------------------------------------------------------------------- /widgets/btnmatrix/lv_example_btnmatrix_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_cb(e): 7 | obj = lv.btnmatrix.__cast__(e.get_target()) 8 | id = obj.get_selected_btn() 9 | if id == 0: 10 | prev = True 11 | else: 12 | prev = False 13 | if id == 6: 14 | next = True 15 | else: 16 | next = False 17 | if prev or next: 18 | # Find the checked butto 19 | for i in range(7): 20 | if obj.has_btn_ctrl(i, lv.btnmatrix.CTRL.CHECKED): 21 | break 22 | if prev and i > 1: 23 | i-=1 24 | elif next and i < 5: 25 | i+=1 26 | 27 | obj.set_btn_ctrl(i, lv.btnmatrix.CTRL.CHECKED) 28 | 29 | # 30 | # Make a button group 31 | # 32 | 33 | style_bg = lv.style_t() 34 | style_bg.init() 35 | style_bg.set_pad_all(0) 36 | style_bg.set_pad_gap(0) 37 | style_bg.set_clip_corner(True) 38 | style_bg.set_radius(lv.RADIUS.CIRCLE) 39 | style_bg.set_border_width(0) 40 | 41 | 42 | style_btn = lv.style_t() 43 | style_btn.init() 44 | style_btn.set_radius(0) 45 | style_btn.set_border_width(1) 46 | style_btn.set_border_opa(lv.OPA._50) 47 | style_btn.set_border_color(lv.palette_main(lv.PALETTE.GREY)) 48 | style_btn.set_border_side(lv.BORDER_SIDE.INTERNAL) 49 | style_btn.set_radius(0) 50 | 51 | map = [lv.SYMBOL.LEFT,"1","2", "3", "4", "5",lv.SYMBOL.RIGHT, ""] 52 | 53 | btnm = lv.btnmatrix(lv.scr_act()) 54 | btnm.set_map(map) 55 | btnm.add_style(style_bg, 0); 56 | btnm.add_style(style_btn, lv.PART.ITEMS) 57 | btnm.add_event_cb(event_cb, lv.EVENT.VALUE_CHANGED, None) 58 | btnm.set_size(225, 35) 59 | 60 | # Allow selecting on one number at time 61 | btnm.set_btn_ctrl_all(lv.btnmatrix.CTRL.CHECKABLE) 62 | btnm.clear_btn_ctrl(0, lv.btnmatrix.CTRL.CHECKABLE) 63 | btnm.clear_btn_ctrl(6, lv.btnmatrix.CTRL.CHECKABLE) 64 | 65 | btnm.set_one_checked(True); 66 | btnm.set_btn_ctrl(1, lv.btnmatrix.CTRL.CHECKED) 67 | 68 | btnm.center() 69 | 70 | -------------------------------------------------------------------------------- /widgets/calendar/lv_example_calendar_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(evt): 7 | code = evt.get_code() 8 | 9 | if code == lv.EVENT.VALUE_CHANGED: 10 | source = lv.calendar.__cast__(evt.get_target()) 11 | date = lv.calendar_date_t() 12 | lv.calendar.get_pressed_date(source,date) 13 | if date: 14 | print("Clicked date: %02d.%02d.%02d"%(date.day, date.month, date.year)) 15 | 16 | 17 | calendar = lv.calendar(lv.scr_act()) 18 | calendar.set_size(200, 200) 19 | calendar.align(lv.ALIGN.CENTER, 0, 20) 20 | calendar.add_event_cb(event_handler, lv.EVENT.ALL, None) 21 | 22 | calendar.set_today_date(2021, 02, 23) 23 | calendar.set_showed_date(2021, 02) 24 | 25 | # Highlight a few days 26 | highlighted_days=[] 27 | for i in range(3): 28 | highlighted_days.append(lv.calendar_date_t()) 29 | 30 | highlighted_days[0].year=2021 31 | highlighted_days[0].month=02 32 | highlighted_days[0].day=6 33 | 34 | highlighted_days[1].year=2021 35 | highlighted_days[1].month=02 36 | highlighted_days[1].day=11 37 | 38 | highlighted_days[2].year=2022 39 | highlighted_days[2].month=02 40 | highlighted_days[2].day=22 41 | 42 | calendar.set_highlighted_dates(highlighted_days, 3) 43 | 44 | header = lv.calendar_header_dropdown(calendar) 45 | # header = lv.calendar_header_arrow(lv.scr_act(),calendar,25) 46 | 47 | 48 | -------------------------------------------------------------------------------- /widgets/canvas/lv_example_canvas_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | _CANVAS_WIDTH = 200 7 | _CANVAS_HEIGHT = 150 8 | LV_IMG_ZOOM_NONE = 256 9 | 10 | rect_dsc = lv.draw_rect_dsc_t() 11 | rect_dsc.init() 12 | rect_dsc.radius = 10 13 | rect_dsc.bg_opa = lv.OPA.COVER 14 | rect_dsc.bg_grad_dir = lv.GRAD_DIR.HOR 15 | rect_dsc.bg_color = lv.palette_main(lv.PALETTE.RED) 16 | rect_dsc.bg_grad_color = lv.palette_main(lv.PALETTE.BLUE) 17 | rect_dsc.border_width = 2 18 | rect_dsc.border_opa = lv.OPA._90 19 | rect_dsc.border_color = lv.color_white() 20 | rect_dsc.shadow_width = 5 21 | rect_dsc.shadow_ofs_x = 5 22 | rect_dsc.shadow_ofs_y = 5 23 | 24 | label_dsc = lv.draw_label_dsc_t() 25 | label_dsc.init() 26 | label_dsc.color = lv.palette_main(lv.PALETTE.YELLOW) 27 | 28 | cbuf = bytearray(_CANVAS_WIDTH * _CANVAS_HEIGHT * 4) 29 | 30 | canvas = lv.canvas(lv.scr_act()) 31 | canvas.set_buffer(cbuf, _CANVAS_WIDTH, _CANVAS_HEIGHT, lv.img.CF.TRUE_COLOR) 32 | canvas.center() 33 | canvas.fill_bg(lv.palette_lighten(lv.PALETTE.GREY, 3), lv.OPA.COVER) 34 | 35 | canvas.draw_rect(70, 60, 100, 70, rect_dsc) 36 | canvas.draw_text(40, 20, 100, label_dsc, "Some text on text canvas") 37 | 38 | # Test the rotation. It requires an other buffer where the orignal image is stored. 39 | # So copy the current image to buffer and rotate it to the canvas 40 | 41 | img = lv.img_dsc_t() 42 | img.data = cbuf[:] 43 | img.header.cf = lv.img.CF.TRUE_COLOR 44 | img.header.w = _CANVAS_WIDTH 45 | img.header.h = _CANVAS_HEIGHT 46 | 47 | canvas.fill_bg(lv_palette_lighten(LV_PALETTE_GREY, 3), LV_OPA_COVER) 48 | canvas.transform(img, 30, LV_IMG_ZOOM_NONE, 0, 0, _CANVAS_WIDTH // 2, _CANVAS_HEIGHT // 2, True); 49 | -------------------------------------------------------------------------------- /widgets/canvas/lv_example_canvas_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | CANVAS_WIDTH = 50 7 | CANVAS_HEIGHT = 50 8 | LV_COLOR_CHROMA_KEY = lv.color_hex(0x00ff00) 9 | 10 | def LV_IMG_BUF_SIZE_ALPHA_1BIT(w, h): 11 | return int(((w / 8) + 1) * h) 12 | 13 | def LV_IMG_BUF_SIZE_INDEXED_1BIT(w, h): 14 | return LV_IMG_BUF_SIZE_ALPHA_1BIT(w, h) + 4 * 2 15 | 16 | def LV_CANVAS_BUF_SIZE_INDEXED_1BIT(w, h): 17 | return LV_IMG_BUF_SIZE_INDEXED_1BIT(w, h) 18 | 19 | # 20 | # Create a transparent canvas with Chroma keying and indexed color format (palette). 21 | # 22 | 23 | # Create a button to better see the transparency 24 | btn=lv.btn(lv.scr_act()) 25 | 26 | # Create a buffer for the canvas 27 | cbuf= bytearray(LV_CANVAS_BUF_SIZE_INDEXED_1BIT(CANVAS_WIDTH, CANVAS_HEIGHT)) 28 | 29 | # Create a canvas and initialize its the palette 30 | canvas = lv.canvas(lv.scr_act()) 31 | canvas.set_buffer(cbuf, CANVAS_WIDTH, CANVAS_HEIGHT, lv.img.CF.INDEXED_1BIT) 32 | canvas.set_palette(0, LV_COLOR_CHROMA_KEY) 33 | canvas.set_palette(1, lv.palette_main(lv.PALETTE.RED)) 34 | 35 | # Create colors with the indices of the palette 36 | c0 = lv.color_t() 37 | c1 = lv.color_t() 38 | 39 | c0.full = 0 40 | c1.full = 1 41 | 42 | # Red background (There is no dedicated alpha channel in indexed images so LV_OPA_COVER is ignored) 43 | canvas.fill_bg(c1, lv.OPA.COVER) 44 | 45 | # Create hole on the canvas 46 | for y in range(10,30): 47 | for x in range(5,20): 48 | canvas.set_px(x, y, c0) 49 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # Create a chart 7 | chart = lv.chart(lv.scr_act()) 8 | chart.set_size(200, 150) 9 | chart.center() 10 | chart.set_type(lv.chart.TYPE.LINE) # Show lines and points too 11 | 12 | # Add two data series 13 | ser1 = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y); 14 | ser2 = chart.add_series(lv.palette_main(lv.PALETTE.GREEN), lv.chart.AXIS.SECONDARY_Y) 15 | print(ser2) 16 | # Set next points on ser1 17 | chart.set_next_value(ser1,10) 18 | chart.set_next_value(ser1,10) 19 | chart.set_next_value(ser1,10) 20 | chart.set_next_value(ser1,10) 21 | chart.set_next_value(ser1,10) 22 | chart.set_next_value(ser1,10) 23 | chart.set_next_value(ser1,10) 24 | chart.set_next_value(ser1,30) 25 | chart.set_next_value(ser1,70) 26 | chart.set_next_value(ser1,90) 27 | 28 | # Directly set points on 'ser2' 29 | ser2.y_points = [90, 70, 65, 65, 65, 65, 65, 65, 65, 65] 30 | chart.refresh() # Required after direct set 31 | 32 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def draw_event_cb(e): 7 | 8 | obj = lv.obj.__cast__(e.get_target()) 9 | 10 | # Add the faded area before the lines are drawn 11 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 12 | if dsc.part != lv.PART.ITEMS: 13 | return 14 | if not dsc.p1 or not dsc.p2: 15 | return 16 | 17 | # Add a line mask that keeps the area below the line 18 | line_mask_param = lv.draw_mask_line_param_t() 19 | line_mask_param.points_init(dsc.p1.x, dsc.p1.y, dsc.p2.x, dsc.p2.y, lv.DRAW_MASK_LINE_SIDE.BOTTOM) 20 | # line_mask_id = line_mask_param.draw_mask_add(None) 21 | line_mask_id = lv.draw_mask_add(line_mask_param, None) 22 | # Add a fade effect: transparent bottom covering top 23 | h = obj.get_height() 24 | fade_mask_param = lv.draw_mask_fade_param_t() 25 | coords = lv.area_t() 26 | obj.get_coords(coords) 27 | fade_mask_param.init(coords, lv.OPA.COVER, coords.y1 + h // 8, lv.OPA.TRANSP,coords.y2) 28 | fade_mask_id = lv.draw_mask_add(fade_mask_param,None) 29 | 30 | # Draw a rectangle that will be affected by the mask 31 | draw_rect_dsc = lv.draw_rect_dsc_t() 32 | draw_rect_dsc.init() 33 | draw_rect_dsc.bg_opa = lv.OPA._20 34 | draw_rect_dsc.bg_color = dsc.line_dsc.color 35 | 36 | a = lv.area_t() 37 | a.x1 = dsc.p1.x 38 | a.x2 = dsc.p2.x - 1 39 | a.y1 = min(dsc.p1.y, dsc.p2.y) 40 | coords = lv.area_t() 41 | obj.get_coords(coords) 42 | a.y2 = coords.y2 43 | lv.draw_rect(a, dsc.clip_area, draw_rect_dsc) 44 | 45 | # Remove the masks 46 | lv.draw_mask_remove_id(line_mask_id) 47 | lv.draw_mask_remove_id(fade_mask_id) 48 | 49 | 50 | def add_data(timer): 51 | # LV_UNUSED(timer); 52 | cnt = 0; 53 | char1.set_next_value(ser1, lv.rand(20, 90)) 54 | 55 | if cnt % 4 == 0: 56 | chart1.set_next_value(ser2, lv_rand(40, 60)) 57 | 58 | cnt +=1 59 | 60 | # 61 | # Add a faded area effect to the line chart 62 | # 63 | 64 | # Create a chart1 65 | chart1 = lv.chart(lv.scr_act()) 66 | chart1.set_size(200, 150) 67 | chart1.center() 68 | chart1.set_type(lv.chart.TYPE.LINE) # Show lines and points too 69 | 70 | chart1.add_event_cb(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None) 71 | chart1.set_update_mode(lv.chart.UPDATE_MODE.CIRCULAR) 72 | 73 | # Add two data series 74 | ser1 = chart1.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y) 75 | ser2 = chart1.add_series(lv.palette_main(lv.PALETTE.BLUE), lv.chart.AXIS.SECONDARY_Y) 76 | 77 | for i in range(10): 78 | chart1.set_next_value(ser1, lv.rand(20, 90)) 79 | chart1.set_next_value(ser2, lv.rand(30, 70)) 80 | 81 | # timer = lv.timer_t(add_data, 200, None) 82 | 83 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def draw_event_cb(e): 7 | 8 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 9 | if dsc.part == lv.PART.TICKS and dsc.id == lv.chart.AXIS.PRIMARY_X: 10 | month = ["Jan", "Febr", "March", "Apr", "May", "Jun", "July", "Aug", "Sept", "Oct", "Nov", "Dec"] 11 | # dsc.text is defined char text[16], I must therefore convert the Python string to a byte_array 12 | dsc.text = bytes(month[dsc.value],"ascii") 13 | # 14 | # Add ticks and labels to the axis and demonstrate scrolling 15 | # 16 | 17 | # Create a chart 18 | chart = lv.chart(lv.scr_act()) 19 | chart.set_size(200, 150) 20 | chart.center() 21 | chart.set_type(lv.chart.TYPE.BAR) 22 | chart.set_range(lv.chart.AXIS.PRIMARY_Y, 0, 100) 23 | chart.set_range(lv.chart.AXIS.SECONDARY_Y, 0, 400) 24 | chart.set_point_count(12) 25 | chart.add_event_cb(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None) 26 | 27 | # Add ticks and label to every axis 28 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 10, 5, 12, 3, True, 40) 29 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 2, True, 50) 30 | chart.set_axis_tick(lv.chart.AXIS.SECONDARY_Y, 10, 5, 3, 4,True, 50) 31 | 32 | # Zoom in a little in X 33 | chart.set_zoom_x(800) 34 | 35 | # Add two data series 36 | ser1 = lv.chart.add_series(chart, lv.palette_lighten(lv.PALETTE.GREEN, 2), lv.chart.AXIS.PRIMARY_Y); 37 | ser2 = lv.chart.add_series(chart, lv.palette_darken(lv.PALETTE.GREEN, 2), lv.chart.AXIS.SECONDARY_Y); 38 | 39 | # Set the next points on 'ser1' 40 | chart.set_next_value(ser1, 31) 41 | chart.set_next_value(ser1, 66) 42 | chart.set_next_value(ser1, 10) 43 | chart.set_next_value(ser1, 89) 44 | chart.set_next_value(ser1, 63) 45 | chart.set_next_value(ser1, 56) 46 | chart.set_next_value(ser1, 32) 47 | chart.set_next_value(ser1, 35) 48 | chart.set_next_value(ser1, 57) 49 | chart.set_next_value(ser1, 85) 50 | chart.set_next_value(ser1, 22) 51 | chart.set_next_value(ser1, 58) 52 | 53 | # Directly set points on 'ser2' 54 | ser2.y_points = [92,71,61,15,21,35,35,58,31,53,33,73] 55 | 56 | chart.refresh() #Required after direct set 57 | 58 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_cb(e): 7 | code = e.get_code() 8 | chart = e.get_target() 9 | 10 | if code == lv.EVENT.VALUE_CHANGED: 11 | chart.invalidate() 12 | 13 | if code == lv.EVENT.REFR_EXT_DRAW_SIZE: 14 | e.set_ext_draw_size(20) 15 | 16 | elif code == lv.EVENT.DRAW_POST_END: 17 | id = lv.chart.get_pressed_point(chart) 18 | if id == lv.CHART_POINT.NONE: 19 | return 20 | # print("Selected point ", id) 21 | for i in range(len(series)): 22 | p = lv.point_t() 23 | chart.get_point_pos_by_id(series[i], id, p) 24 | value = series_points[i][id] 25 | buf = lv.SYMBOL.DUMMY + "$" + str(value) 26 | 27 | draw_rect_dsc = lv.draw_rect_dsc_t() 28 | draw_rect_dsc.init() 29 | draw_rect_dsc.bg_color = lv.color_black() 30 | draw_rect_dsc.bg_opa = lv.OPA._50 31 | draw_rect_dsc.radius = 3 32 | draw_rect_dsc.bg_img_src = buf; 33 | draw_rect_dsc.bg_img_recolor = lv.color_white() 34 | 35 | a = lv.area_t() 36 | coords = lv.area_t() 37 | chart.get_coords(coords) 38 | a.x1 = coords.x1 + p.x - 20 39 | a.x2 = coords.x1 + p.x + 20 40 | a.y1 = coords.y1 + p.y - 30 41 | a.y2 = coords.y1 + p.y - 10 42 | 43 | clip_area = lv.area_t.cast(e.get_param()) 44 | lv.draw_rect(a, clip_area, draw_rect_dsc) 45 | 46 | elif code == lv.EVENT.RELEASED: 47 | chart.invalidate() 48 | 49 | # 50 | # Add ticks and labels to the axis and demonstrate scrolling 51 | # 52 | 53 | # Create a chart 54 | chart = lv.chart(lv.scr_act()) 55 | chart.set_size(200, 150) 56 | chart.center() 57 | 58 | chart.add_event_cb(event_cb, lv.EVENT.ALL, None) 59 | chart.refresh_ext_draw_size() 60 | 61 | # Zoom in a little in X 62 | chart.set_zoom_x(800) 63 | 64 | # Add two data series 65 | ser1 = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y) 66 | ser2 = chart.add_series(lv.palette_main(lv.PALETTE.GREEN), lv.chart.AXIS.PRIMARY_Y) 67 | 68 | ser1_p = [] 69 | ser2_p = [] 70 | for i in range(10): 71 | ser1_p.append(lv.rand(60,90)) 72 | ser2_p.append(lv.rand(10,40)) 73 | ser1.y_points = ser1_p 74 | ser2.y_points = ser2_p 75 | 76 | series = [ser1,ser2] 77 | series_points=[ser1_p,ser2_p] 78 | 79 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_6.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | class ExampleChart_6(): 7 | 8 | def __init__(self): 9 | self.last_id = -1 10 | # 11 | # Show cursor on the clicked point 12 | # 13 | 14 | chart = lv.chart(lv.scr_act()) 15 | chart.set_size(200, 150) 16 | chart.align(lv.ALIGN.CENTER, 0, -10) 17 | 18 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 5, True, 40) 19 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 10, 5, 10, 1, True, 30) 20 | 21 | chart.add_event_cb(self.event_cb, lv.EVENT.ALL, None) 22 | chart.refresh_ext_draw_size() 23 | 24 | self.cursor = chart.add_cursor(lv.palette_main(lv.PALETTE.BLUE), lv.DIR.LEFT | lv.DIR.BOTTOM) 25 | 26 | self.ser = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y) 27 | 28 | self.ser_p = [] 29 | for i in range(10): 30 | self.ser_p.append(lv.rand(10,90)) 31 | self.ser.y_points = self.ser_p 32 | 33 | newser = chart.get_series_next(None) 34 | # print("length of data points: ",len(newser.points)) 35 | chart.set_zoom_x(500) 36 | 37 | label = lv.label(lv.scr_act()) 38 | label.set_text("Click on a point") 39 | label.align_to(chart, lv.ALIGN.OUT_TOP_MID, 0, -5) 40 | 41 | 42 | def event_cb(self,e): 43 | 44 | code = e.get_code() 45 | chart = lv.chart.__cast__(e.get_target()) 46 | 47 | if code == lv.EVENT.VALUE_CHANGED: 48 | # print("last_id: ",self.last_id) 49 | self.last_id = chart.get_pressed_point() 50 | if self.last_id != lv.CHART_POINT.NONE: 51 | p = lv.point_t() 52 | chart.get_point_pos_by_id(self.ser, self.last_id, p) 53 | chart.set_cursor_point(self.cursor, None, self.last_id) 54 | 55 | elif code == lv.EVENT.DRAW_PART_END: 56 | # print("EVENT.DRAW_PART_END") 57 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 58 | # if dsc.p1 and dsc.p2: 59 | # print("p1, p2", dsc.p1,dsc.p2) 60 | # print("p1.y, p2.y", dsc.p1.y, dsc.p2.y) 61 | # print("last_id: ",self.last_id) 62 | if dsc.part == lv.PART.CURSOR and dsc.p1 and dsc.p2 and dsc.p1.y == dsc.p2.y and self.last_id >= 0: 63 | 64 | v = self.ser_p[self.last_id]; 65 | 66 | # print("value: ",v) 67 | value_txt = str(v) 68 | size = lv.point_t() 69 | lv.txt_get_size(size, value_txt, lv.font_default(), 0, 0, lv.COORD.MAX, lv.TEXT_FLAG.NONE) 70 | 71 | a = lv.area_t() 72 | a.y2 = dsc.p1.y - 5 73 | a.y1 = a.y2 - size.y - 10 74 | a.x1 = dsc.p1.x + 10; 75 | a.x2 = a.x1 + size.x + 10; 76 | 77 | draw_rect_dsc = lv.draw_rect_dsc_t() 78 | draw_rect_dsc.init() 79 | draw_rect_dsc.bg_color = lv.palette_main(lv.PALETTE.BLUE) 80 | draw_rect_dsc.radius = 3; 81 | 82 | lv.draw_rect(a, dsc.clip_area, draw_rect_dsc) 83 | 84 | draw_label_dsc = lv.draw_label_dsc_t() 85 | draw_label_dsc.init() 86 | draw_label_dsc.color = lv.color_white() 87 | a.x1 += 5 88 | a.x2 -= 5 89 | a.y1 += 5 90 | a.y2 -= 5 91 | lv.draw_label(a, dsc.clip_area, draw_label_dsc, value_txt, None) 92 | 93 | example_chart_6 = ExampleChart_6() 94 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_7.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def draw_event_cb(e): 7 | dsc = e.get_draw_part_dsc() 8 | if dsc.part == lv.PART.ITEMS: 9 | obj = e.get_target() 10 | ser = obj.get_series_next(None) 11 | cnt = obj.get_point_count() 12 | # print("cnt: ",cnt) 13 | # Make older value more transparent 14 | dsc.rect_dsc.bg_opa = (lv.OPA.COVER * dsc.id) // (cnt - 1) 15 | 16 | # Make smaller values blue, higher values red 17 | # x_array = chart.get_x_array(ser) 18 | # y_array = chart.get_y_array(ser) 19 | # dsc->id is the tells drawing order, but we need the ID of the point being drawn. 20 | start_point = chart.get_x_start_point(ser) 21 | # print("start point: ",start_point) 22 | p_act = (start_point + dsc.id) % cnt # Consider start point to get the index of the array 23 | # print("p_act", p_act) 24 | x_opa = (x_array[p_act] * lv.OPA._50) // 200 25 | y_opa = (y_array[p_act] * lv.OPA._50) // 1000 26 | 27 | dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.RED).color_mix( 28 | lv.palette_main(lv.PALETTE.BLUE), 29 | x_opa + y_opa) 30 | 31 | def add_data(timer,chart): 32 | # print("add_data") 33 | x = lv.rand(0,200) 34 | y = lv.rand(0,1000) 35 | chart.set_next_value2(ser, x, y) 36 | # chart.set_next_value2(chart.gx, y) 37 | x_array.pop(0) 38 | x_array.append(x) 39 | y_array.pop(0) 40 | y_array.append(y) 41 | 42 | # 43 | # A scatter chart 44 | # 45 | 46 | chart = lv.chart(lv.scr_act()) 47 | chart.set_size(200, 150) 48 | chart.align(lv.ALIGN.CENTER, 0, 0) 49 | chart.add_event_cb(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None) 50 | chart.set_style_line_width(0, lv.PART.ITEMS) # Remove the lines 51 | 52 | chart.set_type(lv.chart.TYPE.SCATTER) 53 | 54 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 5, 5, 5, 1, True, 30) 55 | chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 5, True, 50) 56 | 57 | chart.set_range(lv.chart.AXIS.PRIMARY_X, 0, 200) 58 | chart.set_range(lv.chart.AXIS.PRIMARY_Y, 0, 1000) 59 | 60 | chart.set_point_count(50) 61 | 62 | ser = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y) 63 | 64 | x_array = [] 65 | y_array = [] 66 | for i in range(50): 67 | x_array.append(lv.rand(0, 200)) 68 | y_array.append(lv.rand(0, 1000)) 69 | 70 | ser.x_points = x_array 71 | ser.y_points = y_array 72 | 73 | # Create an `lv_timer` to update the chart. 74 | 75 | timer = lv.timer_create_basic() 76 | timer.set_period(100) 77 | timer.set_cb(lambda src: add_data(timer,chart)) 78 | -------------------------------------------------------------------------------- /widgets/chart/lv_example_chart_9.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import display_driver 3 | import lvgl as lv 4 | 5 | def add_data(t): 6 | chart.set_next_value(ser, lv.rand(10, 90)) 7 | 8 | p = chart.get_point_count() 9 | s = chart.get_x_start_point(ser) 10 | a = chart.get_y_array(ser) 11 | 12 | a[(s + 1) % p] = lv.CHART_POINT.NONE 13 | a[(s + 2) % p] = lv.CHART_POINT.NONE 14 | a[(s + 2) % p] = lv.CHART_POINT.NONE 15 | 16 | chart.refresh() 17 | 18 | # 19 | # Circular line chart with gap 20 | # 21 | chart = lv.chart(lv.scr_act()) 22 | 23 | chart.set_update_mode(lv.chart.UPDATE_MODE.CIRCULAR) 24 | chart.set_size(200, 150) 25 | chart.center() 26 | 27 | chart.set_point_count(30) 28 | ser = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y) 29 | #Prefill with data 30 | for i in range(0, 30): 31 | chart.set_next_value(ser, lv.rand(10, 90)) 32 | 33 | lv.timer_create(add_data, 200, None) 34 | -------------------------------------------------------------------------------- /widgets/checkbox/lv_example_checkbox_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.checkbox.__cast__(e.get_target()) 9 | if code == lv.EVENT.VALUE_CHANGED: 10 | txt = obj.get_text() 11 | if obj.get_state() & lv.STATE.CHECKED: 12 | state = "Checked" 13 | else: 14 | state = "Unchecked"; 15 | print(txt + ":" + state) 16 | 17 | 18 | lv.scr_act().set_flex_flow(lv.FLEX_FLOW.COLUMN) 19 | lv.scr_act().set_flex_align(lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.START, lv.FLEX_ALIGN.CENTER) 20 | 21 | cb = lv.checkbox(lv.scr_act()) 22 | cb.set_text("Apple") 23 | cb.add_event_cb(event_handler, lv.EVENT.ALL, None) 24 | 25 | cb = lv.checkbox(lv.scr_act()) 26 | cb.set_text("Banana") 27 | cb.add_state(lv.STATE.CHECKED) 28 | cb.add_event_cb(event_handler, lv.EVENT.ALL, None) 29 | 30 | cb = lv.checkbox(lv.scr_act()) 31 | cb.set_text("Lemon") 32 | cb.add_state(lv.STATE.DISABLED) 33 | cb.add_event_cb(event_handler, lv.EVENT.ALL, None) 34 | 35 | cb = lv.checkbox(lv.scr_act()) 36 | cb.add_state(lv.STATE.CHECKED | lv.STATE.DISABLED) 37 | cb.set_text("Melon") 38 | cb.add_event_cb(event_handler, lv.EVENT.ALL, None) 39 | 40 | cb.update_layout() 41 | 42 | -------------------------------------------------------------------------------- /widgets/colorwheel/lv_example_colorwheel_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | cw = lv.colorwheel(lv.scr_act(), True) 7 | cw.set_size(200, 200) 8 | cw.center() 9 | 10 | -------------------------------------------------------------------------------- /widgets/dropdown/images/Makefile: -------------------------------------------------------------------------------- 1 | CC=gcc 2 | CFLAGS=-g -Wall 3 | 4 | all: img_caret_down 5 | .PHONY: 6 | clean: 7 | $(RM) *~ img_carer_down 8 | -------------------------------------------------------------------------------- /widgets/dropdown/images/img_caret_down: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/dropdown/images/img_caret_down -------------------------------------------------------------------------------- /widgets/dropdown/images/img_caret_down_13x8_argb8888.bin: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/dropdown/images/img_caret_down_13x8_argb8888.bin -------------------------------------------------------------------------------- /widgets/dropdown/images/img_caret_down_13x8_argb8888.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/uraich/lv_mpy_examples_v8/8126308d0473088d918a2c5560393272c6dfba1a/widgets/dropdown/images/img_caret_down_13x8_argb8888.png -------------------------------------------------------------------------------- /widgets/dropdown/lv_example_dropdown_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.dropdown.__cast__(e.get_target()) 9 | if code == lv.EVENT.VALUE_CHANGED: 10 | option = " "*10 # should be large enough to store the option 11 | obj.get_selected_str(option, len(option)) 12 | # .strip() removes trailing spaces 13 | print("Option: \"%s\"" % option.strip()) 14 | 15 | # Create a normal drop down list 16 | dd = lv.dropdown(lv.scr_act()) 17 | dd.set_options("\n".join([ 18 | "Apple\n" 19 | "Banana\n" 20 | "Orange\n" 21 | "Cherry\n" 22 | "Grape\n" 23 | "Raspberry\n" 24 | "Melon\n" 25 | "Orange\n" 26 | "Lemon\n" 27 | "Nuts\n"])) 28 | 29 | dd.align(lv.ALIGN.TOP_MID, 0, 20) 30 | dd.add_event_cb(event_handler, lv.EVENT.ALL, None) 31 | 32 | -------------------------------------------------------------------------------- /widgets/dropdown/lv_example_dropdown_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Create a drop down, up, left and right menus 7 | # 8 | 9 | opts = "\n".join([ 10 | "Apple\n" 11 | "Banana\n" 12 | "Orange\n" 13 | "Melon\n" 14 | "Grape\n" 15 | "Raspberry"]) 16 | 17 | dd = lv.dropdown(lv.scr_act()) 18 | dd.set_options_static(opts) 19 | dd.align(lv.ALIGN.TOP_MID, 0, 10) 20 | dd = lv.dropdown(lv.scr_act()) 21 | dd.set_options_static(opts) 22 | dd.set_dir(lv.DIR.BOTTOM) 23 | dd.set_symbol(lv.SYMBOL.UP) 24 | dd.align(lv.ALIGN.BOTTOM_MID, 0, -10) 25 | 26 | dd = lv.dropdown(lv.scr_act()) 27 | dd.set_options_static(opts) 28 | dd.set_dir(lv.DIR.RIGHT) 29 | dd.set_symbol(lv.SYMBOL.RIGHT) 30 | dd.align(lv.ALIGN.LEFT_MID, 10, 0) 31 | 32 | dd = lv.dropdown(lv.scr_act()) 33 | dd.set_options_static(opts) 34 | dd.set_dir(lv.DIR.LEFT) 35 | dd.set_symbol(lv.SYMBOL.LEFT) 36 | dd.align(lv.ALIGN.RIGHT_MID, -10, 0) 37 | 38 | 39 | -------------------------------------------------------------------------------- /widgets/dropdown/lv_example_dropdown_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_caret_down.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_caret_down.png") 18 | sys.exit() 19 | 20 | img_caret_down_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | def event_cb(e): 26 | dropdown = lv.dropdown.__cast__(e.get_target()) 27 | option = " "*64 # should be large enough to store the option 28 | dropdown.get_selected_str(option, len(option)) 29 | print(option.strip() +" is selected") 30 | # 31 | # Create a menu from a drop-down list and show some drop-down list features and styling 32 | # 33 | 34 | # Create a drop down list 35 | dropdown = lv.dropdown(lv.scr_act()) 36 | dropdown.align(lv.ALIGN.TOP_LEFT, 10, 10) 37 | dropdown.set_options("".join([ 38 | "New project\n", 39 | "New file\n", 40 | "Open project\n", 41 | "Recent projects\n", 42 | "Preferences\n", 43 | "Exit"])) 44 | 45 | # Set a fixed text to display on the button of the drop-down list 46 | dropdown.set_text("Menu") 47 | 48 | # Use a custom image as down icon and flip it when the list is opened 49 | # LV_IMG_DECLARE(img_caret_down) 50 | dropdown.set_symbol(img_caret_down_argb) 51 | dropdown.set_style_transform_angle(1800, lv.STATE.CHECKED) 52 | 53 | # In a menu we don't need to show the last clicked item 54 | dropdown.set_selected_highlight(False) 55 | 56 | dropdown.add_event_cb(event_cb, lv.EVENT.VALUE_CHANGED, None) 57 | 58 | -------------------------------------------------------------------------------- /widgets/img/lv_example_img_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_cogwheel_argb.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_cogwheel_argb.png") 18 | sys.exit() 19 | 20 | img_cogwheel_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | img1 = lv.img(lv.scr_act()) 26 | img1.set_src(img_cogwheel_argb) 27 | img1.align(lv.ALIGN.CENTER, 0, -20) 28 | img1.set_size(200, 200) 29 | 30 | img2 = lv.img(lv.scr_act()) 31 | img2.set_src(lv.SYMBOL.OK + "Accept") 32 | img2.align_to(img1, lv.ALIGN.OUT_BOTTOM_MID, 0, 20) 33 | -------------------------------------------------------------------------------- /widgets/img/lv_example_img_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_cogwheel_argb.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_cogwheel_argb.png") 18 | sys.exit() 19 | 20 | img_cogwheel_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | def create_slider(color): 26 | slider = lv.slider(lv.scr_act()) 27 | slider.set_range(0, 255) 28 | slider.set_size(10, 200); 29 | slider.set_style_bg_color(color, lv.PART.KNOB); 30 | slider.set_style_bg_color(color.color_darken(lv.OPA._40), lv.PART.INDICATOR) 31 | slider.add_event_cb(slider_event_cb, lv.EVENT.VALUE_CHANGED, None) 32 | return slider 33 | 34 | def slider_event_cb(e): 35 | # Recolor the image based on the sliders' values 36 | color = lv.color_make(red_slider.get_value(), green_slider.get_value(), blue_slider.get_value()) 37 | intense = intense_slider.get_value() 38 | img1.set_style_img_recolor_opa(intense, 0) 39 | img1.set_style_img_recolor(color, 0) 40 | 41 | # 42 | # Demonstrate runtime image re-coloring 43 | # 44 | # Create 4 sliders to adjust RGB color and re-color intensity 45 | red_slider = create_slider(lv.palette_main(lv.PALETTE.RED)) 46 | green_slider = create_slider(lv.palette_main(lv.PALETTE.GREEN)) 47 | blue_slider = create_slider(lv.palette_main(lv.PALETTE.BLUE)) 48 | intense_slider = create_slider(lv.palette_main(lv.PALETTE.GREY)) 49 | 50 | red_slider.set_value(lv.OPA._20, lv.ANIM.OFF) 51 | green_slider.set_value(lv.OPA._90, lv.ANIM.OFF) 52 | blue_slider.set_value(lv.OPA._60, lv.ANIM.OFF) 53 | intense_slider.set_value(lv.OPA._50, lv.ANIM.OFF) 54 | 55 | red_slider.align(lv.ALIGN.LEFT_MID, 25, 0) 56 | green_slider.align_to(red_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0) 57 | blue_slider.align_to(green_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0) 58 | intense_slider.align_to(blue_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0) 59 | 60 | # Now create the actual image 61 | img1 = lv.img(lv.scr_act()) 62 | img1.set_src(img_cogwheel_argb) 63 | img1.align(lv.ALIGN.RIGHT_MID, -20, 0) 64 | 65 | lv.event_send(intense_slider, lv.EVENT.VALUE_CHANGED, None) 66 | 67 | 68 | 69 | 70 | 71 | -------------------------------------------------------------------------------- /widgets/img/lv_example_img_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_cogwheel_argb.png','rb') as f: 15 | png_data = f.read() 16 | except: 17 | print("Could not find img_cogwheel_argb.png") 18 | sys.exit() 19 | 20 | img_cogwheel_argb = lv.img_dsc_t({ 21 | 'data_size': len(png_data), 22 | 'data': png_data 23 | }) 24 | 25 | def set_angle(img, v): 26 | img.set_angle(v) 27 | 28 | def set_zoom(img, v): 29 | img.set_zoom(v) 30 | 31 | 32 | # 33 | # Show transformations (zoom and rotation) using a pivot point. 34 | # 35 | 36 | # Now create the actual image 37 | img = lv.img(lv.scr_act()) 38 | img.set_src(img_cogwheel_argb) 39 | img.align(lv.ALIGN.CENTER, 50, 50) 40 | img.set_pivot(0, 0) # Rotate around the top left corner 41 | 42 | a1 = lv.anim_t() 43 | a1.init() 44 | a1.set_var(img) 45 | a1.set_custom_exec_cb(lambda a,val: set_angle(img,val)) 46 | a1.set_values(0, 3600) 47 | a1.set_time(5000) 48 | a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 49 | lv.anim_t.start(a1) 50 | 51 | a2 = lv.anim_t() 52 | a2.init() 53 | a2.set_var(img) 54 | a2.set_custom_exec_cb(lambda a,val: set_zoom(img,val)) 55 | a2.set_values(128, 256) 56 | a2.set_time(5000) 57 | a2.set_playback_time(3000) 58 | a2.set_repeat_count(LV_ANIM_REPEAT_INFINITE) 59 | lv.anim_t.start(a2) 60 | 61 | 62 | -------------------------------------------------------------------------------- /widgets/img/lv_example_img_4.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | def ofs_y_anim(img, v): 8 | img.set_offset_y(v) 9 | # print(img,v) 10 | 11 | # Register PNG image decoder 12 | decoder = lv.img.decoder_create() 13 | decoder.info_cb = get_png_info 14 | decoder.open_cb = open_png 15 | 16 | # Create an image from the png file 17 | try: 18 | with open('../../assets/img_skew_strip.png','rb') as f: 19 | png_data = f.read() 20 | except: 21 | print("Could not find img_skew_strip.png") 22 | sys.exit() 23 | 24 | img_skew_strip = lv.img_dsc_t({ 25 | 'data_size': len(png_data), 26 | 'data': png_data 27 | }) 28 | 29 | # 30 | # Image styling and offset 31 | # 32 | 33 | style = lv.style_t() 34 | style.init() 35 | style.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW)) 36 | style.set_bg_opa(lv.OPA.COVER) 37 | style.set_img_recolor_opa(lv.OPA.COVER) 38 | style.set_img_recolor(lv.color_black()) 39 | 40 | img = lv.img(lv.scr_act()) 41 | img.add_style(style, 0) 42 | img.set_src(img_skew_strip) 43 | img.set_size(150, 100) 44 | img.center() 45 | 46 | a = lv.anim_t() 47 | a.init() 48 | a.set_var(img) 49 | a.set_values(0, 100) 50 | a.set_time(3000) 51 | a.set_playback_time(500) 52 | a.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 53 | a.set_custom_exec_cb(lambda a,val: ofs_y_anim(img,val)) 54 | lv.anim_t.start(a) 55 | 56 | -------------------------------------------------------------------------------- /widgets/imgbtn/lv_example_imgbtn_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import sys 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/imgbtn_left.png','rb') as f: 15 | imgbtn_left_data = f.read() 16 | except: 17 | print("Could not find imgbtn_left.png") 18 | sys.exit() 19 | 20 | imgbtn_left_dsc = lv.img_dsc_t({ 21 | 'data_size': len(imgbtn_left_data), 22 | 'data': imgbtn_left_data 23 | }) 24 | 25 | try: 26 | with open('../../assets/imgbtn_mid.png','rb') as f: 27 | imgbtn_mid_data = f.read() 28 | except: 29 | print("Could not find imgbtn_mid.png") 30 | sys.exit() 31 | 32 | imgbtn_mid_dsc = lv.img_dsc_t({ 33 | 'data_size': len(imgbtn_mid_data), 34 | 'data': imgbtn_mid_data 35 | }) 36 | 37 | try: 38 | with open('../../assets/imgbtn_right.png','rb') as f: 39 | imgbtn_right_data = f.read() 40 | except: 41 | print("Could not find imgbtn_right.png") 42 | sys.exit() 43 | 44 | imgbtn_right_dsc = lv.img_dsc_t({ 45 | 'data_size': len(imgbtn_right_data), 46 | 'data': imgbtn_right_data 47 | }) 48 | 49 | # Create a transition animation on width transformation and recolor. 50 | tr_prop = [lv.STYLE.TRANSFORM_WIDTH, lv.STYLE.IMG_RECOLOR_OPA, 0] 51 | tr = lv.style_transition_dsc_t() 52 | tr.init(tr_prop, lv.anim_t.path_linear, 200, 0, None) 53 | 54 | style_def = lv.style_t() 55 | style_def.init() 56 | style_def.set_text_color(lv.color_white()) 57 | style_def.set_transition(tr) 58 | 59 | # Darken the button when pressed and make it wider 60 | style_pr = lv.style_t() 61 | style_pr.init() 62 | style_pr.set_img_recolor_opa(lv.OPA._30) 63 | style_pr.set_img_recolor(lv.color_black()) 64 | style_pr.set_transform_width(20) 65 | 66 | # Create an image button 67 | imgbtn1 = lv.imgbtn(lv.scr_act()) 68 | imgbtn1.set_src(lv.imgbtn.STATE.RELEASED, imgbtn_left_dsc, imgbtn_mid_dsc, imgbtn_right_dsc) 69 | imgbtn1.add_style(style_def, 0) 70 | imgbtn1.add_style(style_pr, lv.STATE.PRESSED) 71 | 72 | imgbtn1.align(lv.ALIGN.CENTER, 0, 0) 73 | 74 | # Create a label on the image button 75 | label = lv.label(imgbtn1) 76 | label.set_text("Button"); 77 | label.align(lv.ALIGN.CENTER, 0, -4) 78 | 79 | -------------------------------------------------------------------------------- /widgets/keyboard/lv_example_keyboard_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def ta_event_cb(e,kb): 7 | code = e.get_code() 8 | ta = e.get_target() 9 | if code == lv.EVENT.FOCUSED: 10 | kb.set_textarea(ta) 11 | kb.clear_flag(lv.obj.FLAG.HIDDEN) 12 | 13 | if code == lv.EVENT.DEFOCUSED: 14 | kb.set_textarea(None) 15 | kb.add_flag(lv.obj.FLAG.HIDDEN) 16 | 17 | # Create a keyboard to use it with an of the text areas 18 | kb = lv.keyboard(lv.scr_act()) 19 | 20 | # Create a text area. The keyboard will write here 21 | ta = lv.textarea(lv.scr_act()) 22 | ta.set_width(200) 23 | ta.align(lv.ALIGN.TOP_LEFT, 10, 10) 24 | ta.add_event_cb(lambda e: ta_event_cb(e,kb), lv.EVENT.ALL, None) 25 | ta.set_placeholder_text("Hello") 26 | 27 | ta = lv.textarea(lv.scr_act()) 28 | ta.set_width(200) 29 | ta.align(lv.ALIGN.TOP_RIGHT, -10, 10) 30 | ta.add_event_cb(lambda e: ta_event_cb(e,kb), lv.EVENT.ALL, None) 31 | 32 | kb.set_textarea(ta) 33 | 34 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Show line wrap, re-color, line align and text scrolling. 8 | # 9 | label1 = lv.label(lv.scr_act()) 10 | label1.set_long_mode(lv.label.LONG.WRAP); # Break the long lines*/ 11 | label1.set_recolor(True) # Enable re-coloring by commands in the text 12 | label1.set_text("#0000ff Re-color# #ff00ff words# #ff0000 of a# label, align the lines to the center" 13 | "and wrap long text automatically.") 14 | label1.set_width(150) # Set smaller width to make the lines wrap 15 | label1.set_style_text_align(lv.ALIGN.CENTER, 0) 16 | label1.align(lv.ALIGN.CENTER, 0, -40) 17 | 18 | 19 | label2 = lv.label(lv.scr_act()) 20 | label2.set_long_mode(lv.label.LONG.SCROLL_CIRCULAR) # Circular scroll 21 | label2.set_width(150) 22 | label2.set_text("It is a circularly scrolling text. ") 23 | label2.align(lv.ALIGN.CENTER, 0, 40) 24 | 25 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | # 6 | # Create a fake text shadow 7 | # 8 | 9 | # Create a style for the shadow 10 | style_shadow = lv.style_t() 11 | style_shadow.init() 12 | style_shadow.set_text_opa(lv.OPA._30) 13 | style_shadow.set_text_color(lv.color_black()) 14 | 15 | # Create a label for the shadow first (it's in the background) 16 | shadow_label = lv.label(lv.scr_act()) 17 | shadow_label.add_style(style_shadow, 0) 18 | 19 | # Create the main label 20 | main_label = lv.label(lv.scr_act()) 21 | main_label.set_text("A simple method to create\n" 22 | "shadows on a text.\n" 23 | "It even works with\n\n" 24 | "newlines and spaces.") 25 | 26 | # Set the same text for the shadow label 27 | shadow_label.set_text(lv.label.get_text(main_label)) 28 | 29 | # Position the main label 30 | main_label.align(lv.ALIGN.CENTER, 0, 0) 31 | 32 | # Shift the second label down and to the right by 2 pixel 33 | shadow_label.align_to(main_label, lv.ALIGN.TOP_LEFT, 2, 2) 34 | 35 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | # 7 | # Show mixed LTR, RTL and Chinese label 8 | # 9 | 10 | ltr_label = lv.label(lv.scr_act()) 11 | ltr_label.set_text("In modern terminology, a microcontroller is similar to a system on a chip (SoC)."); 12 | # ltr_label.set_style_text_font(ltr_label, &lv_font_montserrat_16, 0); 13 | 14 | fs_drv = lv.fs_drv_t() 15 | fs_driver.fs_register(fs_drv, 'S') 16 | 17 | try: 18 | ltr_label.set_style_text_font(ltr_label, lv.font_montserrat_16, 0) 19 | except: 20 | font_montserrat_16 = lv.font_load("S:../../assets/font/montserrat-16.fnt") 21 | ltr_label.set_style_text_font(font_montserrat_16, 0) 22 | 23 | ltr_label.set_width(310) 24 | ltr_label.align(lv.ALIGN.TOP_LEFT, 5, 5) 25 | 26 | rtl_label = lv.label(lv.scr_act()) 27 | rtl_label.set_text("מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit).") 28 | rtl_label.set_style_base_dir(lv.BASE_DIR.RTL, 0) 29 | rtl_label.set_style_text_font(lv.font_dejavu_16_persian_hebrew, 0) 30 | rtl_label.set_width(310) 31 | rtl_label.align(lv.ALIGN.LEFT_MID, 5, 0) 32 | 33 | font_simsun_16_cjk = lv.font_load("S:../../assets/font/lv_font_simsun_16_cjk.fnt") 34 | 35 | cz_label = lv.label(lv.scr_act()) 36 | cz_label.set_style_text_font(font_simsun_16_cjk, 0) 37 | cz_label.set_text("嵌入式系统（Embedded System），\n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。") 38 | cz_label.set_width(310) 39 | cz_label.align(lv.ALIGN.BOTTOM_LEFT, 5, -5) 40 | 41 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_4.c: -------------------------------------------------------------------------------- 1 | #include "../../lv_examples.h" 2 | #if LV_USE_LABEL && LV_USE_CANVAS && LV_BUILD_EXAMPLES && LV_DRAW_COMPLEX 3 | 4 | #define MASK_WIDTH 100 5 | #define MASK_HEIGHT 45 6 | 7 | static void add_mask_event_cb(lv_event_t * e) 8 | { 9 | static lv_draw_mask_map_param_t m; 10 | static int16_t mask_id; 11 | 12 | lv_event_code_t code = lv_event_get_code(e); 13 | lv_obj_t * obj = lv_event_get_target(e); 14 | lv_opa_t * mask_map = lv_event_get_user_data(e); 15 | if(code == LV_EVENT_COVER_CHECK) { 16 | lv_event_set_cover_res(e, LV_COVER_RES_MASKED); 17 | } 18 | else if(code == LV_EVENT_DRAW_MAIN_BEGIN) { 19 | lv_draw_mask_map_init(&m, &obj->coords, mask_map); 20 | mask_id = lv_draw_mask_add(&m, NULL); 21 | 22 | } 23 | else if(code == LV_EVENT_DRAW_MAIN_END) { 24 | lv_draw_mask_free_param(&m); 25 | lv_draw_mask_remove_id(mask_id); 26 | } 27 | } 28 | 29 | /** 30 | * Draw label with gradient color 31 | */ 32 | void lv_example_label_4(void) 33 | { 34 | /* Create the mask of a text by drawing it to a canvas*/ 35 | static lv_opa_t mask_map[MASK_WIDTH * MASK_HEIGHT]; 36 | 37 | /*Create a "8 bit alpha" canvas and clear it*/ 38 | lv_obj_t * canvas = lv_canvas_create(lv_scr_act()); 39 | lv_canvas_set_buffer(canvas, mask_map, MASK_WIDTH, MASK_HEIGHT, LV_IMG_CF_ALPHA_8BIT); 40 | lv_canvas_fill_bg(canvas, lv_color_black(), LV_OPA_TRANSP); 41 | 42 | /*Draw a label to the canvas. The result "image" will be used as mask*/ 43 | lv_draw_label_dsc_t label_dsc; 44 | lv_draw_label_dsc_init(&label_dsc); 45 | label_dsc.color = lv_color_white(); 46 | label_dsc.align = LV_TEXT_ALIGN_CENTER; 47 | lv_canvas_draw_text(canvas, 5, 5, MASK_WIDTH, &label_dsc, "Text with gradient"); 48 | 49 | /*The mask is reads the canvas is not required anymore*/ 50 | lv_obj_del(canvas); 51 | 52 | /* Create an object from where the text will be masked out. 53 | * Now it's a rectangle with a gradient but it could be an image too*/ 54 | lv_obj_t * grad = lv_obj_create(lv_scr_act()); 55 | lv_obj_set_size(grad, MASK_WIDTH, MASK_HEIGHT); 56 | lv_obj_center(grad); 57 | lv_obj_set_style_bg_color(grad, lv_color_hex(0xff0000), 0); 58 | lv_obj_set_style_bg_grad_color(grad, lv_color_hex(0x0000ff), 0); 59 | lv_obj_set_style_bg_grad_dir(grad, LV_GRAD_DIR_HOR, 0); 60 | lv_obj_add_event_cb(grad, add_mask_event_cb, LV_EVENT_ALL, mask_map); 61 | } 62 | 63 | #endif 64 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_4.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def add_mask_event_cb(e) : 7 | 8 | code = e.get_code() 9 | obj = e.get_target() 10 | mask_map = e.get_user_data() 11 | if code == LV_EVENT_COVER_CHECK : 12 | lv_event_set_cover_res(e, LV_COVER_RES_MASKED) 13 | elsif code == LV_EVENT_DRAW_MAIN_BEGIN) 14 | lv_draw_mask_map_init(&m, &obj->coords, mask_map) 15 | mask_id = lv_draw_mask_add(&m, NULL) 16 | elsif code == LV_EVENT_DRAW_MAIN_END 17 | lv_draw_mask_free_param(&m) 18 | lv_draw_mask_remove_id(mask_id) 19 | 20 | # 21 | # Draw label with gradient color 22 | # 23 | 24 | # Create the mask of a text by drawing it to a canvas 25 | mask_map = [MASK_WIDTH * MASK_HEIGHT]; 26 | 27 | # Create a "8 bit alpha" canvas and clear it 28 | canvas = lv.canvas(lv.scr_act()) 29 | canvas.set_buffer(mask_map, MASK_WIDTH, MASK_HEIGHT, lv.IMG_CF_ALPHA_8BIT) 30 | canvas_fill_bg(lv.color_black(), LV_OPA_TRANSP) 31 | 32 | # Draw a label to the canvas. The result "image" will be used as mask 33 | lv_draw_label_dsc_t label_dsc; 34 | lv_draw_label_dsc_init(&label_dsc); 35 | label_dsc.color = lv_color_white(); 36 | label_dsc.align = LV_TEXT_ALIGN_CENTER; 37 | lv_canvas_draw_text(canvas, 5, 5, MASK_WIDTH, &label_dsc, "Text with gradient"); 38 | 39 | # The mask is reads the canvas is not required anymore 40 | lv_obj_del(canvas); 41 | 42 | # Create an object from where the text will be masked ou. 43 | # Now it's a rectangle with a gradient but it could be an image too 44 | lv_obj_t * grad = lv_obj_create(lv_scr_act()); 45 | lv_obj_set_size(grad, MASK_WIDTH, MASK_HEIGHT); 46 | lv_obj_center(grad); 47 | lv_obj_set_style_bg_color(grad, lv_color_hex(0xff0000), 0); 48 | lv_obj_set_style_bg_grad_color(grad, lv_color_hex(0x0000ff), 0); 49 | lv_obj_set_style_bg_grad_dir(grad, LV_GRAD_DIR_HOR, 0); 50 | lv_obj_add_event_cb(grad, add_mask_event_cb, LV_EVENT_ALL, mask_map); 51 | 52 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_5.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Show customizing the circular scrolling animation of a label with `LV_LABEL_LONG_SCROLL_CIRCULAR` 8 | # long mode. 9 | # 10 | 11 | animation_template = lv.anim_t() 12 | label_style = lv.style_t() 13 | 14 | animation_template.init() 15 | animation_template.set_delay(1000) # Wait 1 second to start the first scroll 16 | animation_template.set_repeat_delay(3000) # Repeat the scroll 3 seconds after the label scrolls back to the initial position 17 | 18 | # initialize the label style with the animation template 19 | 20 | label_style.init() 21 | label_style.set_anim(animation_template) 22 | 23 | label1 = lv.label(lv.scr_act()) 24 | label1.set_long_mode(lv.label.LONG.SCROLL_CIRCULAR) # Circular scroll 25 | label1.set_width(150) 26 | label1.set_text("It is a circularly scrolling text. ") 27 | label1.align(lv.ALIGN.CENTER, 0, 40) 28 | label1.add_style(label_style, lv.STATE.DEFAULT) # Add the style to the label 29 | 30 | -------------------------------------------------------------------------------- /widgets/label/lv_example_label_6.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # show symbol 7 | 8 | panel = lv.obj(lv.scr_act()) 9 | label = lv.label(panel) 10 | label.set_text(lv.SYMBOL.ENVELOPE) 11 | 12 | label.align(lv.ALIGN.CENTER,0,0) 13 | -------------------------------------------------------------------------------- /widgets/led/lv_example_led_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Create LED's with different brightness and color 8 | # 9 | 10 | # Create a LED and switch it OFF 11 | led1 = lv.led(lv.scr_act()) 12 | led1.align(lv.ALIGN.CENTER, -80, 0) 13 | led1.off() 14 | 15 | # Copy the previous LED and set a brightness 16 | led2 = lv.led(lv.scr_act()) 17 | led2.align(lv.ALIGN.CENTER, 0, 0) 18 | led2.set_brightness(150) 19 | led2.set_color(lv.palette_main(lv.PALETTE.RED)) 20 | 21 | # Copy the previous LED and switch it ON 22 | led3 = lv.led(lv.scr_act()) 23 | led3.align(lv.ALIGN.CENTER, 80, 0) 24 | led3.on() 25 | 26 | -------------------------------------------------------------------------------- /widgets/line/lv_example_line_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # Create an array for the points of the line 7 | line_points = [ {"x":5, "y":5}, 8 | {"x":70, "y":70}, 9 | {"x":120, "y":10}, 10 | {"x":180, "y":60}, 11 | {"x":240, "y":10}] 12 | 13 | # Create style 14 | style_line = lv.style_t() 15 | style_line.init() 16 | style_line.set_line_width(8) 17 | style_line.set_line_color(lv.palette_main(lv.PALETTE.BLUE)) 18 | style_line.set_line_rounded(True) 19 | 20 | # Create a line and apply the new style 21 | line1 = lv.line(lv.scr_act()) 22 | line1.set_points(line_points, 5) # Set the points 23 | line1.add_style(style_line, 0) 24 | line1.center() 25 | 26 | -------------------------------------------------------------------------------- /widgets/list/lv_example_list_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.btn.__cast__(e.get_target()) 9 | if code == lv.EVENT.CLICKED: 10 | print("Clicked: list1." + list1.get_btn_text(obj)) 11 | 12 | # Create a list 13 | list1 = lv.list(lv.scr_act()) 14 | list1.set_size(180, 220) 15 | list1.center() 16 | 17 | # Add buttons to the list 18 | list1.add_text("File") 19 | btn_new = list1.add_btn(lv.SYMBOL.FILE, "New") 20 | btn_new.add_event_cb(event_handler,lv.EVENT.ALL, None) 21 | btn_open = list1.add_btn(lv.SYMBOL.DIRECTORY, "Open") 22 | btn_open.add_event_cb(event_handler,lv.EVENT.ALL, None) 23 | btn_save = list1.add_btn(lv.SYMBOL.SAVE, "Save") 24 | btn_save.add_event_cb(event_handler,lv.EVENT.ALL, None) 25 | btn_delete = list1.add_btn(lv.SYMBOL.CLOSE, "Delete") 26 | btn_delete.add_event_cb(event_handler,lv.EVENT.ALL, None) 27 | btn_edit = list1.add_btn(lv.SYMBOL.EDIT, "Edit") 28 | btn_edit.add_event_cb(event_handler,lv.EVENT.ALL, None) 29 | 30 | list1.add_text("Connectivity") 31 | btn_bluetooth = list1.add_btn(lv.SYMBOL.BLUETOOTH, "Bluetooth") 32 | btn_bluetooth.add_event_cb(event_handler,lv.EVENT.ALL, None) 33 | btn_navig = list1.add_btn(lv.SYMBOL.GPS, "Navigation") 34 | btn_navig.add_event_cb(event_handler,lv.EVENT.ALL, None) 35 | btn_USB = list1.add_btn(lv.SYMBOL.USB, "USB") 36 | btn_USB.add_event_cb(event_handler,lv.EVENT.ALL, None) 37 | btn_battery = list1.add_btn(lv.SYMBOL.BATTERY_FULL, "Battery") 38 | btn_battery.add_event_cb(event_handler,lv.EVENT.ALL, None) 39 | 40 | list1.add_text("Exit") 41 | btn_apply = list1.add_btn(lv.SYMBOL.OK, "Apply") 42 | btn_apply.add_event_cb(event_handler,lv.EVENT.ALL, None) 43 | btn_close = list1.add_btn(LV_SYMBOL.CLOSE, "Close") 44 | btn_close.add_event_cb(event_handler,lv.EVENT.ALL, None) 45 | 46 | -------------------------------------------------------------------------------- /widgets/meter/lv_example_meter_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def set_value(indic, v): 7 | meter.set_indicator_value(indic, v) 8 | 9 | # 10 | # A simple meter 11 | # 12 | meter = lv.meter(lv.scr_act()) 13 | meter.center() 14 | meter.set_size(200, 200) 15 | 16 | # Add a scale first 17 | scale = meter.add_scale() 18 | meter.set_scale_ticks(scale, 51, 2, 10, lv.palette_main(lv.PALETTE.GREY)) 19 | meter.set_scale_major_ticks(scale, 10, 4, 15, lv.color_black(), 10) 20 | 21 | indic = lv.meter_indicator_t() 22 | 23 | # Add a blue arc to the start 24 | indic = meter.add_arc(scale, 3, lv.palette_main(lv.PALETTE.BLUE), 0) 25 | meter.set_indicator_start_value(indic, 0) 26 | meter.set_indicator_end_value(indic, 20) 27 | 28 | # Make the tick lines blue at the start of the scale 29 | indic = meter.add_scale_lines(scale, lv.palette_main(lv.PALETTE.BLUE), lv.palette_main(lv.PALETTE.BLUE), False, 0) 30 | meter.set_indicator_start_value(indic, 0) 31 | meter.set_indicator_end_value(indic, 20) 32 | 33 | # Add a red arc to the end 34 | indic = meter.add_arc(scale, 3, lv.palette_main(lv.PALETTE.RED), 0) 35 | meter.set_indicator_start_value(indic, 80) 36 | meter.set_indicator_end_value(indic, 100) 37 | 38 | # Make the tick lines red at the end of the scale 39 | indic = meter.add_scale_lines(scale, lv.palette_main(lv.PALETTE.RED), lv.palette_main(lv.PALETTE.RED), False, 0) 40 | meter.set_indicator_start_value(indic, 80) 41 | meter.set_indicator_end_value(indic, 100) 42 | 43 | # Add a needle line indicator 44 | indic = meter.add_needle_line(scale, 4, lv.palette_main(lv.PALETTE.GREY), -10) 45 | 46 | # Create an animation to set the value 47 | a = lv.anim_t() 48 | a.init() 49 | a.set_var(indic) 50 | a.set_values(0, 100) 51 | a.set_time(2000) 52 | a.set_repeat_delay(100) 53 | a.set_playback_time(500) 54 | a.set_playback_delay(100) 55 | a.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 56 | a.set_custom_exec_cb(lambda a,val: set_value(indic,val)) 57 | lv.anim_t.start(a) 58 | 59 | -------------------------------------------------------------------------------- /widgets/meter/lv_example_meter_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def set_value(indic,v): 7 | meter.set_indicator_end_value(indic, v) 8 | 9 | # 10 | # A meter with multiple arcs 11 | # 12 | 13 | meter = lv.meter(lv.scr_act()) 14 | meter.center() 15 | meter.set_size(200, 200) 16 | 17 | # Remove the circle from the middle 18 | meter.remove_style(None, lv.PART.INDICATOR) 19 | 20 | # Add a scale first 21 | scale = meter.add_scale() 22 | meter.set_scale_ticks(scale, 11, 2, 10, lv.palette_main(lv.PALETTE.GREY)) 23 | meter.set_scale_major_ticks(scale, 1, 2, 30, lv.color_hex3(0xeee), 10) 24 | meter.set_scale_range(scale, 0, 100, 270, 90) 25 | 26 | # Add a three arc indicator 27 | indic1 = meter.add_arc(scale, 10, lv.palette_main(lv.PALETTE.RED), 0) 28 | indic2 = meter.add_arc(scale, 10, lv.palette_main(lv.PALETTE.GREEN), -10) 29 | indic3 = meter.add_arc(scale, 10, lv.palette_main(lv.PALETTE.BLUE), -20) 30 | 31 | # Create an animation to set the value 32 | a1 = lv.anim_t() 33 | a1.init() 34 | a1.set_values(0, 100) 35 | a1.set_time(2000) 36 | a1.set_repeat_delay(100) 37 | a1.set_playback_delay(100) 38 | a1.set_playback_time(500) 39 | a1.set_var(indic1) 40 | a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 41 | a1.set_custom_exec_cb(lambda a,val: set_value(indic1,val)) 42 | lv.anim_t.start(a1) 43 | 44 | a2 = lv.anim_t() 45 | a2.init() 46 | a2.set_values(0, 100) 47 | a2.set_time(1000) 48 | a2.set_repeat_delay(100) 49 | a2.set_playback_delay(100) 50 | a2.set_playback_time(1000) 51 | a2.set_var(indic2) 52 | a2.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 53 | a2.set_custom_exec_cb(lambda a,val: set_value(indic2,val)) 54 | lv.anim_t.start(a2) 55 | 56 | a3 = lv.anim_t() 57 | a3.init() 58 | a3.set_values(0, 100) 59 | a3.set_time(1000) 60 | a3.set_repeat_delay(100) 61 | a3.set_playback_delay(100) 62 | a3.set_playback_time(2000) 63 | a3.set_var(indic3) 64 | a3.set_repeat_count(LV_ANIM_REPEAT_INFINITE) 65 | a3.set_custom_exec_cb(lambda a,val: set_value(indic3,val)) 66 | lv.anim_t.start(a3) 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /widgets/meter/lv_example_meter_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | from imagetools import get_png_info, open_png 6 | 7 | # Register PNG image decoder 8 | decoder = lv.img.decoder_create() 9 | decoder.info_cb = get_png_info 10 | decoder.open_cb = open_png 11 | 12 | # Create an image from the png file 13 | try: 14 | with open('../../assets/img_hand_min.png','rb') as f: 15 | img_hand_min_data = f.read() 16 | except: 17 | print("Could not find img_hand_min.png") 18 | sys.exit() 19 | 20 | img_hand_min_dsc = lv.img_dsc_t({ 21 | 'data_size': len(img_hand_min_data), 22 | 'data': img_hand_min_data 23 | }) 24 | 25 | # Create an image from the png file 26 | try: 27 | with open('../../assets/img_hand_hour.png','rb') as f: 28 | img_hand_hour_data = f.read() 29 | except: 30 | print("Could not find img_hand_hour.png") 31 | sys.exit() 32 | 33 | img_hand_hour_dsc = lv.img_dsc_t({ 34 | 'data_size': len(img_hand_hour_data), 35 | 'data': img_hand_hour_data 36 | }) 37 | 38 | def set_value(indic, v): 39 | meter.set_indicator_value(indic, v) 40 | # 41 | # A clock from a meter 42 | # 43 | 44 | meter = lv.meter(lv.scr_act()) 45 | meter.set_size(220, 220) 46 | meter.center() 47 | 48 | # Create a scale for the minutes 49 | # 61 ticks in a 360 degrees range (the last and the first line overlaps) 50 | scale_min = meter.add_scale() 51 | meter.set_scale_ticks(scale_min, 61, 1, 10, lv.palette_main(lv.PALETTE.GREY)) 52 | meter.set_scale_range(scale_min, 0, 60, 360, 270) 53 | 54 | # Create an other scale for the hours. It's only visual and contains only major ticks 55 | scale_hour = meter.add_scale() 56 | meter.set_scale_ticks(scale_hour, 12, 0, 0, lv.palette_main(lv.PALETTE.GREY)) # 12 ticks 57 | meter.set_scale_major_ticks(scale_hour, 1, 2, 20, lv.color_black(), 10) # Every tick is major 58 | meter.set_scale_range(scale_hour, 1, 12, 330, 300) # [1..12] values in an almost full circle 59 | 60 | # LV_IMG_DECLARE(img_hand) 61 | 62 | # Add a the hands from images 63 | indic_min = meter.add_needle_img(scale_min, img_hand_min_dsc, 5, 5) 64 | indic_hour = meter.add_needle_img(scale_min, img_hand_hour_dsc, 5, 5) 65 | 66 | # Create an animation to set the value 67 | a1 = lv.anim_t() 68 | a1.init() 69 | a1.set_values(0, 60) 70 | a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE) 71 | a1.set_time(2000) # 2 sec for 1 turn of the minute hand (1 hour) 72 | a1.set_var(indic_min) 73 | a1.set_custom_exec_cb(lambda a1,val: set_value(indic_min,val)) 74 | lv.anim_t.start(a1) 75 | 76 | a2 = lv.anim_t() 77 | a2.init() 78 | a2.set_var(indic_hour) 79 | a2.set_time(24000) # 24 sec for 1 turn of the hour hand 80 | a2.set_values(0, 60) 81 | a2.set_custom_exec_cb(lambda a2,val: set_value(indic_hour,val)) 82 | lv.anim_t.start(a2) 83 | 84 | -------------------------------------------------------------------------------- /widgets/meter/lv_example_meter_4.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import lvgl as lv 3 | import display_driver 4 | 5 | # 6 | # Create a pie chart 7 | # 8 | 9 | meter = lv.meter(lv.scr_act()) 10 | 11 | # Remove the background and the circle from the middle 12 | meter.remove_style(None, lv.PART.MAIN) 13 | meter.remove_style(None, lv.PART.INDICATOR) 14 | 15 | meter.set_size(200, 200) 16 | meter.center() 17 | 18 | # Add a scale first with no ticks. 19 | scale = meter.add_scale() 20 | meter.set_scale_ticks(scale, 0, 0, 0, lv.color_black()) 21 | meter.set_scale_range(scale, 0, 100, 360, 0) 22 | 23 | # Add a three arc indicator* 24 | indic_w = 100 25 | indic1 = meter.add_arc(scale, indic_w,lv.palette_main(lv.PALETTE.ORANGE), 0) 26 | meter.set_indicator_start_value(indic1, 0) 27 | meter.set_indicator_end_value(indic1, 40) 28 | 29 | indic2 = meter.add_arc(scale, indic_w, lv.palette_main(lv.PALETTE.YELLOW), 0) 30 | meter.set_indicator_start_value(indic2, 40) # Start from the previous 31 | meter.set_indicator_end_value(indic2, 80) 32 | 33 | indic3 = meter.add_arc(scale, indic_w, lv.palette_main(lv.PALETTE.DEEP_ORANGE), 0) 34 | meter_set_indicator_start_value(indic3, 80) # Start from the previous 35 | meter_set_indicator_end_value(indic3, 100) 36 | 37 | -------------------------------------------------------------------------------- /widgets/msgbox/lv_example_msgbox_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_cb(e): 7 | mbox = lv.msgbox.__cast__(e.get_current_target()) 8 | print("Button " + mbox.get_active_btn_text() + " clicked") 9 | 10 | btns = ["Apply", "Close", ""] 11 | 12 | mbox1 = lv.msgbox(lv.scr_act(), "Hello", "This is a message box with two buttons.", btns, True) 13 | mbox1.add_event_cb(event_cb, lv.EVENT.VALUE_CHANGED, None) 14 | mbox1.center() 15 | 16 | -------------------------------------------------------------------------------- /widgets/obj/lv_example_obj_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | obj1 = lv.obj(lv.scr_act()) 7 | obj1.set_size(100, 50) 8 | obj1.align(lv.ALIGN.CENTER, -60, -30) 9 | 10 | style_shadow = lv.style_t() 11 | style_shadow.init() 12 | style_shadow.set_shadow_width(10) 13 | style_shadow.set_shadow_spread(5) 14 | style_shadow.set_shadow_color(lv.palette_main(lv.PALETTE.BLUE)) 15 | 16 | obj2 = lv.obj(lv.scr_act()) 17 | obj2.add_style(style_shadow, 0) 18 | obj2.align(lv.ALIGN.CENTER, 60, 30) 19 | 20 | -------------------------------------------------------------------------------- /widgets/obj/lv_example_obj_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def drag_event_handler(e): 7 | 8 | obj = e.get_target() 9 | 10 | indev = lv.indev_get_act() 11 | 12 | vect = lv.point_t() 13 | indev.get_vect(vect) 14 | x = obj.get_x() + vect.x 15 | y = obj.get_y() + vect.y 16 | obj.set_pos(x, y) 17 | 18 | 19 | # 20 | # Make an object dragable. 21 | # 22 | 23 | obj = lv.obj(lv.scr_act()) 24 | obj.set_size(150, 100) 25 | obj.add_event_cb(drag_event_handler, lv.EVENT.PRESSING, None) 26 | 27 | label = lv.label(obj) 28 | label.set_text("Drag me") 29 | label.center() 30 | 31 | -------------------------------------------------------------------------------- /widgets/roller/lv_example_roller_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.roller.__cast__(e.get_target()) 9 | if code == lv.EVENT.VALUE_CHANGED: 10 | option = " "*10 11 | obj.get_selected_str(option, len(option)) 12 | print("Selected month: " + option.strip()) 13 | 14 | # 15 | # An infinite roller with the name of the months 16 | # 17 | 18 | roller1 = lv.roller(lv.scr_act()) 19 | roller1.set_options("\n".join([ 20 | "January", 21 | "February", 22 | "March", 23 | "April", 24 | "May", 25 | "June", 26 | "July", 27 | "August", 28 | "September", 29 | "October", 30 | "November", 31 | "December"]),lv.roller.MODE.INFINITE) 32 | 33 | roller1.set_visible_row_count(4) 34 | roller1.center() 35 | roller1.add_event_cb(event_handler, lv.EVENT.ALL, None) 36 | 37 | -------------------------------------------------------------------------------- /widgets/roller/lv_example_roller_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | 7 | def event_handler(e): 8 | code = e.get_code() 9 | obj = lv.roller.__cast__(e.get_target()) 10 | if code == lv.EVENT.VALUE_CHANGED: 11 | option = " "*10 12 | obj.get_selected_str(option, len(option)) 13 | print("Selected value: %s\n" + option.strip()) 14 | 15 | # 16 | # Roller with various alignments and larger text in the selected area 17 | # 18 | 19 | # A style to make the selected option larger 20 | style_sel = lv.style_t() 21 | style_sel.init() 22 | 23 | try: 24 | style_sel.set_text_font(lv.font_montserrat_22) 25 | except: 26 | fs_drv = lv.fs_drv_t() 27 | fs_driver.fs_register(fs_drv, 'S') 28 | print("montserrat-22 not enabled in lv_conf.h, dynamically loading the font") 29 | font_montserrat_22 = lv.font_load("S:../../assets/font/montserrat-22.fnt") 30 | style_sel.set_text_font(font_montserrat_22) 31 | 32 | opts = "\n".join(["1","2","3","4","5","6","7","8","9","10"]) 33 | 34 | # A roller on the left with left aligned text, and custom width 35 | roller = lv.roller(lv.scr_act()) 36 | roller.set_options(opts, lv.roller.MODE.NORMAL) 37 | roller.set_visible_row_count(2) 38 | roller.set_width(100) 39 | roller.add_style(style_sel, lv.PART.SELECTED) 40 | roller.set_style_text_align(lv.TEXT_ALIGN.LEFT, 0) 41 | roller.align(lv.ALIGN.LEFT_MID, 10, 0) 42 | roller.add_event_cb(event_handler, lv.EVENT.ALL, None) 43 | roller.set_selected(2, lv.ANIM.OFF) 44 | 45 | # A roller on the middle with center aligned text, and auto (default) width 46 | roller = lv.roller(lv.scr_act()); 47 | roller.set_options(opts, lv.roller.MODE.NORMAL) 48 | roller.set_visible_row_count(3) 49 | roller.add_style(style_sel, lv.PART.SELECTED) 50 | roller.align(lv.ALIGN.CENTER, 0, 0) 51 | roller.add_event_cb(event_handler, lv.EVENT.ALL, None) 52 | roller.set_selected(5, lv.ANIM.OFF) 53 | 54 | # A roller on the right with right aligned text, and custom width 55 | roller = lv.roller(lv.scr_act()); 56 | roller.set_options(opts, lv.roller.MODE.NORMAL) 57 | roller.set_visible_row_count(4) 58 | roller.set_width(80) 59 | roller.add_style(style_sel, lv.PART.SELECTED) 60 | roller.set_style_text_align(lv.TEXT_ALIGN.RIGHT, 0) 61 | roller.align(lv.ALIGN.RIGHT_MID, -10, 0) 62 | roller.add_event_cb(event_handler, lv.EVENT.ALL, None) 63 | roller.set_selected(8, lv.ANIM.OFF) 64 | 65 | -------------------------------------------------------------------------------- /widgets/roller/lv_example_roller_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | import fs_driver 6 | import sys 7 | 8 | class Lv_Roller_3(): 9 | 10 | def __init__(self): 11 | self.mask_top_id = -1 12 | self.mask_bottom_id = -1 13 | 14 | # 15 | # Add an fade mask to roller. 16 | # 17 | style = lv.style_t() 18 | style.init() 19 | style.set_bg_color(lv.color_black()) 20 | style.set_text_color(lv.color_white()) 21 | 22 | lv.scr_act().add_style(style, 0) 23 | 24 | roller1 = lv.roller(lv.scr_act()) 25 | roller1.add_style(style, 0) 26 | roller1.set_style_border_width(0, 0) 27 | roller1.set_style_pad_all(0, 0) 28 | roller1.set_style_bg_opa(lv.OPA.TRANSP, lv.PART.SELECTED) 29 | 30 | #if LV_FONT_MONTSERRAT_22 31 | # lv_obj_set_style_text_font(roller1, &lv_font_montserrat_22, LV_PART_SELECTED); 32 | #endif 33 | try: 34 | roller1.set_style_text_font(lv.font_montserrat_22) 35 | except: 36 | fs_drv = lv.fs_drv_t() 37 | fs_driver.fs_register(fs_drv, 'S') 38 | print("montserrat-22 not enabled in lv_conf.h, dynamically loading the font") 39 | font_montserrat_22 = lv.font_load("S:" + "../../assets/font/montserrat-22.fnt") 40 | roller1.set_style_text_font(font_montserrat_22,lv.PART.SELECTED) 41 | 42 | roller1.set_options("\n".join([ 43 | "January", 44 | "February", 45 | "March", 46 | "April", 47 | "May", 48 | "June", 49 | "July", 50 | "August", 51 | "September", 52 | "October", 53 | "November", 54 | "December"]),lv.roller.MODE.NORMAL) 55 | 56 | roller1.center() 57 | roller1.set_visible_row_count(3) 58 | roller1.add_event_cb(self.mask_event_cb, lv.EVENT.ALL, None) 59 | 60 | def mask_event_cb(self,e): 61 | 62 | code = e.get_code() 63 | obj = e.get_target() 64 | 65 | if code == lv.EVENT.COVER_CHECK: 66 | e.set_cover_res(lv.COVER_RES.MASKED) 67 | 68 | elif code == lv.EVENT.DRAW_MAIN_BEGIN: 69 | # add mask 70 | font = obj.get_style_text_font(lv.PART.MAIN) 71 | line_space = obj.get_style_text_line_space(lv.PART.MAIN) 72 | font_h = font.get_line_height() 73 | 74 | roller_coords = lv.area_t() 75 | obj.get_coords(roller_coords) 76 | 77 | rect_area = lv.area_t() 78 | rect_area.x1 = roller_coords.x1 79 | rect_area.x2 = roller_coords.x2 80 | rect_area.y1 = roller_coords.y1 81 | rect_area.y2 = roller_coords.y1 + (obj.get_height() - font_h - line_space) // 2 82 | 83 | fade_mask_top = lv.draw_mask_fade_param_t() 84 | fade_mask_top.init(rect_area, lv.OPA.TRANSP, rect_area.y1, lv.OPA.COVER, rect_area.y2) 85 | self.mask_top_id = lv.draw_mask_add(fade_mask_top,None) 86 | 87 | rect_area.y1 = rect_area.y2 + font_h + line_space - 1 88 | rect_area.y2 = roller_coords.y2 89 | 90 | fade_mask_bottom = lv.draw_mask_fade_param_t() 91 | fade_mask_bottom.init(rect_area, lv.OPA.COVER, rect_area.y1, lv.OPA.TRANSP, rect_area.y2) 92 | self.mask_bottom_id = lv.draw_mask_add(fade_mask_bottom, None) 93 | 94 | elif code == lv.EVENT.DRAW_POST_END: 95 | fade_mask_top = lv.draw_mask_remove_id(self.mask_top_id) 96 | fade_mask_bottom = lv.draw_mask_remove_id(self.mask_bottom_id) 97 | # Remove the masks 98 | lv.draw_mask_remove_id(self.mask_top_id) 99 | lv.draw_mask_remove_id(self.mask_bottom_id) 100 | self.mask_top_id = -1; 101 | self.mask_bottom_id = -1; 102 | 103 | roller3 = Lv_Roller_3() 104 | -------------------------------------------------------------------------------- /widgets/slider/lv_example_slider_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # A default slider with a label displaying the current value 8 | # 9 | def slider_event_cb(e): 10 | 11 | slider = lv.slider.__cast__(e.get_target()) 12 | slider_label.set_text("{:d}%".format(slider.get_value())) 13 | slider_label.align_to(slider, lv.ALIGN.OUT_BOTTOM_MID, 0, 10) 14 | 15 | # Create a slider in the center of the display 16 | slider = lv.slider(lv.scr_act()) 17 | slider.center() 18 | slider.add_event_cb(slider_event_cb, lv.EVENT.VALUE_CHANGED, None) 19 | 20 | # Create a label below the slider 21 | slider_label = lv.label(lv.scr_act()) 22 | slider_label.set_text("0%") 23 | 24 | slider_label.align_to(slider, lv.ALIGN.OUT_BOTTOM_MID, 0, 10) 25 | 26 | -------------------------------------------------------------------------------- /widgets/slider/lv_example_slider_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Show how to style a slider. 8 | # 9 | # Create a transition 10 | props = [lv.STYLE.BG_COLOR, 0] 11 | transition_dsc = lv.style_transition_dsc_t() 12 | transition_dsc.init(props, lv.anim_t.path_linear, 300, 0, None) 13 | 14 | style_main = lv.style_t() 15 | style_indicator = lv.style_t() 16 | style_knob = lv.style_t() 17 | style_pressed_color = lv.style_t() 18 | style_main.init() 19 | style_main.set_bg_opa(lv.OPA.COVER) 20 | style_main.set_bg_color(lv.color_hex3(0xbbb)) 21 | style_main.set_radius(lv.RADIUS.CIRCLE) 22 | style_main.set_pad_ver(-2) # Makes the indicator larger 23 | 24 | style_indicator.init() 25 | style_indicator.set_bg_opa(lv.OPA.COVER) 26 | style_indicator.set_bg_color(lv.palette_main(lv.PALETTE.CYAN)) 27 | style_indicator.set_radius(lv.RADIUS.CIRCLE) 28 | style_indicator.set_transition(transition_dsc) 29 | 30 | style_knob.init() 31 | style_knob.set_bg_opa(lv.OPA.COVER) 32 | style_knob.set_bg_color(lv.palette_main(lv.PALETTE.CYAN)) 33 | style_knob.set_border_color(lv.palette_darken(lv.PALETTE.CYAN, 3)) 34 | style_knob.set_border_width(2) 35 | style_knob.set_radius(lv.RADIUS.CIRCLE) 36 | style_knob.set_pad_all(6) # Makes the knob larger 37 | style_knob.set_transition(transition_dsc) 38 | 39 | style_pressed_color.init() 40 | style_pressed_color.set_bg_color(lv.palette_darken(lv.PALETTE.CYAN, 2)) 41 | 42 | # Create a slider and add the style 43 | slider = lv.slider(lv.scr_act()) 44 | slider.remove_style_all() # Remove the styles coming from the theme 45 | 46 | slider.add_style(style_main, lv.PART.MAIN) 47 | slider.add_style(style_indicator, lv.PART.INDICATOR) 48 | slider.add_style(style_pressed_color, lv.PART.INDICATOR | lv.STATE.PRESSED) 49 | slider.add_style(style_knob, lv.PART.KNOB) 50 | slider.add_style(style_pressed_color, lv.PART.KNOB | lv.STATE.PRESSED) 51 | 52 | slider.center() 53 | 54 | -------------------------------------------------------------------------------- /widgets/slider/lv_example_slider_3.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def slider_event_cb(e): 7 | code = e.get_code() 8 | obj = lv.slider.__cast__(e.get_target()) 9 | 10 | # Provide some extra space for the value 11 | if code == lv.EVENT.REFR_EXT_DRAW_SIZE: 12 | e.set_ext_draw_size(50) 13 | 14 | elif code == lv.EVENT.DRAW_PART_END: 15 | # print("DRAW_PART_END") 16 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 17 | # print(dsc) 18 | if dsc.part == lv.PART.INDICATOR: 19 | label_text = "{:d} - {:d}".format(obj.get_left_value(),slider.get_value()) 20 | label_size = lv.point_t() 21 | lv.txt_get_size(label_size, label_text, lv.font_default(), 0, 0, lv.COORD.MAX, 0) 22 | # print(label_size.x,label_size.y) 23 | label_area = lv.area_t() 24 | label_area.x1 = dsc.draw_area.x1 + dsc.draw_area.get_width() // 2 - label_size.x // 2 25 | label_area.x2 = label_area.x1 + label_size.x 26 | label_area.y2 = dsc.draw_area.y1 - 10 27 | label_area.y1 = label_area.y2 - label_size.y 28 | 29 | label_draw_dsc = lv.draw_label_dsc_t() 30 | label_draw_dsc.init() 31 | 32 | lv.draw_label(label_area, dsc.clip_area, label_draw_dsc, label_text, None) 33 | # 34 | # Show the current value when the slider if pressed by extending the drawer 35 | # 36 | # 37 | #Create a slider in the center of the display 38 | 39 | slider = lv.slider(lv.scr_act()) 40 | slider.center() 41 | 42 | slider.set_mode(lv.slider.MODE.RANGE) 43 | slider.set_value(70, lv.ANIM.OFF) 44 | slider.set_left_value(20, lv.ANIM.OFF) 45 | 46 | slider.add_event_cb(slider_event_cb, lv.EVENT.ALL, None) 47 | slider.refresh_ext_draw_size() 48 | 49 | -------------------------------------------------------------------------------- /widgets/span/lv_example_span_1.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Create span. 8 | # 9 | style = lv.style_t() 10 | style.init() 11 | style.set_border_width(1) 12 | style.set_border_color(lv.palette_main(lv.PALETTE.ORANGE)) 13 | style.set_pad_all(2) 14 | 15 | spans = lv.spangroup(lv.scr_act()) 16 | spans.set_width(300) 17 | spans.set_height(300) 18 | spans.center() 19 | spans.add_style(style, 0) 20 | 21 | spans.set_align(lv.TEXT_ALIGN.LEFT) 22 | spans.set_overflow(lv.SPAN_OVERFLOW.CLIP) 23 | spans.set_indent(20) 24 | spans.set_mode(lv.SPAN_MODE.BREAK) 25 | 26 | span = spans.new_span() 27 | span.set_text("china is a beautiful country.") 28 | span.style.set_text_color(lv.palette_main(lv.PALETTE.RED)) 29 | span.style.set_text_decor(lv.TEXT_DECOR.STRIKETHROUGH | lv.TEXT_DECOR.UNDERLINE) 30 | span.style.set_text_opa(lv.OPA._30) 31 | 32 | span = spans.new_span() 33 | span.set_text_static("good good study, day day up."); 34 | #if LV_FONT_MONTSERRAT_24 35 | # lv_style_set_text_font(&span->style, &lv_font_montserrat_24); 36 | #endif 37 | span.style.set_text_color(lv.palette_main(lv.PALETTE.GREEN)) 38 | 39 | span = spans.new_span() 40 | span.set_text_static("LVGL is an open-source graphics library.") 41 | span.style.set_text_color(lv.palette_main(lv.PALETTE.BLUE)) 42 | 43 | span = spans.new_span() 44 | span.set_text_static("the boy no name.") 45 | span.style.set_text_color(lv.palette_main(lv.PALETTE.GREEN)) 46 | #if LV_FONT_MONTSERRAT_20 47 | # lv_style_set_text_font(&span->style, &lv_font_montserrat_20); 48 | #endif 49 | span.style.set_text_decor(lv.TEXT_DECOR.UNDERLINE) 50 | 51 | span = spans.new_span() 52 | span.set_text("I have a dream that hope to come true.") 53 | 54 | spans.refr_mode() 55 | 56 | # lv_span_del(spans, span); 57 | # lv_obj_del(spans); 58 | 59 | -------------------------------------------------------------------------------- /widgets/spinbox/lv_example_spinbox_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def increment_event_cb(e): 7 | code = e.get_code() 8 | if code == lv.EVENT.SHORT_CLICKED or code == lv.EVENT.LONG_PRESSED_REPEAT: 9 | spinbox.increment() 10 | 11 | def decrement_event_cb(e): 12 | code = e.get_code() 13 | if code == lv.EVENT.SHORT_CLICKED or code == lv.EVENT.LONG_PRESSED_REPEAT: 14 | spinbox.decrement() 15 | 16 | spinbox = lv.spinbox(lv.scr_act()) 17 | spinbox.set_range(-1000, 25000) 18 | spinbox.set_digit_format(5, 2) 19 | spinbox.step_prev() 20 | spinbox.set_width(100) 21 | spinbox.center() 22 | 23 | h = spinbox.get_height() 24 | 25 | btn = lv.btn(lv.scr_act()) 26 | btn.set_size(h, h) 27 | btn.align_to(spinbox, lv.ALIGN.OUT_RIGHT_MID, 5, 0) 28 | btn.set_style_bg_img_src(lv.SYMBOL.PLUS, 0) 29 | btn.add_event_cb(increment_event_cb, lv.EVENT.ALL, None) 30 | 31 | btn = lv.btn(lv.scr_act()) 32 | btn.set_size(h, h) 33 | btn.align_to(spinbox, lv.ALIGN.OUT_LEFT_MID, -5, 0) 34 | btn.set_style_bg_img_src(lv.SYMBOL.MINUS, 0) 35 | btn.add_event_cb(decrement_event_cb, lv.EVENT.ALL, None) 36 | -------------------------------------------------------------------------------- /widgets/spinner/lv_example_spinner_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # Create a spinner 7 | spinner = lv.spinner(lv.scr_act(), 1000, 60) 8 | spinner.set_size(100, 100) 9 | spinner.center() 10 | 11 | 12 | -------------------------------------------------------------------------------- /widgets/switch/lv_example_switch_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.switch.__cast__(e.get_target()) 9 | if code == lv.EVENT.VALUE_CHANGED: 10 | if obj.has_state(lv.STATE.CHECKED): 11 | print("State: on") 12 | else: 13 | print("State: off") 14 | 15 | 16 | lv.scr_act().set_flex_flow(lv.FLEX_FLOW.COLUMN) 17 | lv.scr_act().set_flex_align(lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER) 18 | 19 | sw = lv.switch(lv.scr_act()) 20 | sw.add_event_cb(event_handler,lv.EVENT.ALL, None) 21 | 22 | sw = lv.switch(lv.scr_act()) 23 | sw.add_state(lv.STATE.CHECKED) 24 | sw.add_event_cb(event_handler, lv.EVENT.ALL, None) 25 | 26 | sw = lv.switch(lv.scr_act()) 27 | sw.add_state(lv.STATE.DISABLED) 28 | sw.add_event_cb(event_handler, lv.EVENT.ALL, None) 29 | 30 | sw = lv.switch(lv.scr_act()) 31 | sw.add_state(STATE.CHECKED | lv.STATE.DISABLED) 32 | sw.add_event_cb(event_handler, lv.EVENT.ALL, None) 33 | 34 | -------------------------------------------------------------------------------- /widgets/table/lv_example_table_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def draw_part_event_cb(e): 7 | obj = lv.table.__cast__(e.get_target()) 8 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 9 | # If the cells are drawn../ 10 | if dsc.part == lv.PART.ITEMS: 11 | row = dsc.id // obj.get_col_cnt() 12 | col = dsc.id - row * obj.get_col_cnt() 13 | 14 | # Make the texts in the first cell center aligned 15 | if row == 0: 16 | dsc.label_dsc.align = lv.TEXT_ALIGN.CENTER 17 | dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.BLUE).color_mix(dsc.rect_dsc.bg_color, lv.OPA._20) 18 | dsc.rect_dsc.bg_opa = lv.OPA.COVER 19 | 20 | # In the first column align the texts to the right 21 | elif col == 0: 22 | dsc.label_dsc.flag = lv.TEXT_ALIGN.RIGHT 23 | 24 | # Make every 2nd row grayish 25 | if row != 0 and (row % 2) == 0: 26 | dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.GREY).color_mix(dsc.rect_dsc.bg_color, lv.OPA._10) 27 | dsc.rect_dsc.bg_opa = lv.OPA.COVER 28 | 29 | 30 | table = lv.table(lv.scr_act()) 31 | 32 | # Fill the first column 33 | table.set_cell_value(0, 0, "Name"); 34 | table.set_cell_value(1, 0, "Apple"); 35 | table.set_cell_value(2, 0, "Banana"); 36 | table.set_cell_value(3, 0, "Lemon"); 37 | table.set_cell_value(4, 0, "Grape"); 38 | table.set_cell_value(5, 0, "Melon"); 39 | table.set_cell_value(6, 0, "Peach"); 40 | table.set_cell_value(7, 0, "Nuts"); 41 | 42 | # Fill the second column 43 | table.set_cell_value(0, 1, "Price"); 44 | table.set_cell_value(1, 1, "$7"); 45 | table.set_cell_value(2, 1, "$4"); 46 | table.set_cell_value(3, 1, "$6"); 47 | table.set_cell_value(4, 1, "$2"); 48 | table.set_cell_value(5, 1, "$5"); 49 | table.set_cell_value(6, 1, "$1"); 50 | table.set_cell_value(7, 1, "$9"); 51 | 52 | # Set a smaller height to the table. It'll make it scrollable 53 | table.set_height(200) 54 | table.center() 55 | 56 | # Add an event callback to to apply some custom drawing 57 | table.add_event_cb(draw_part_event_cb, lv.EVENT.DRAW_PART_BEGIN, None) 58 | 59 | -------------------------------------------------------------------------------- /widgets/table/lv_example_table_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | from utime import ticks_ms 6 | import gc 7 | 8 | ITEM_CNT = 200 9 | 10 | def draw_event_cb(e): 11 | obj = lv.table.__cast__(e.get_target()) 12 | dsc = lv.obj_draw_part_dsc_t.cast(e.get_param()) 13 | # If the cells are drawn... 14 | if dsc.part == lv.PART.ITEMS: 15 | chk = obj.has_cell_ctrl(dsc.id, 0, lv.table.CELL_CTRL.CUSTOM_1) 16 | 17 | rect_dsc = lv.draw_rect_dsc_t() 18 | rect_dsc.init() 19 | 20 | if chk: 21 | rect_dsc.bg_color = lv.theme_get_color_primary(obj) 22 | else: 23 | rect_dsc.bg_color = lv.palette_lighten(lv.PALETTE.GREY,2) 24 | 25 | rect_dsc.radius = lv.RADIUS.CIRCLE 26 | 27 | sw_area = lv.area_t() 28 | sw_area.x1 = dsc.draw_area.x2 - 50; 29 | sw_area.x2 = sw_area.x1 + 40; 30 | sw_area.y1 = dsc.draw_area.y1 + dsc.draw_area.get_height() // 2 - 10 31 | sw_area.y2 = sw_area.y1 + 20; 32 | lv.draw_rect(sw_area, dsc.clip_area, rect_dsc) 33 | 34 | rect_dsc.bg_color = lv.color_white() 35 | 36 | if chk: 37 | sw_area.x2 -= 2 38 | sw_area.x1 = sw_area.x2 - 16 39 | else: 40 | sw_area.x1 += 2 41 | sw_area.x2 = sw_area.x1 + 16 42 | sw_area.y1 += 2; 43 | sw_area.y2 -= 2; 44 | lv.draw_rect(sw_area, dsc.clip_area, rect_dsc) 45 | 46 | def change_event_cb(e): 47 | obj = lv.table.__cast__(e.get_target()) 48 | row = lv.C_Pointer() 49 | col = lv.C_Pointer() 50 | table.get_selected_cell(row, col) 51 | # print("row: ",row.uint_val) 52 | 53 | chk = table.has_cell_ctrl(row.uint_val, 0, lv.table.CELL_CTRL.CUSTOM_1) 54 | if chk: 55 | table.clear_cell_ctrl(row.uint_val, 0, lv.table.CELL_CTRL.CUSTOM_1) 56 | else: 57 | table.add_cell_ctrl(row.uint_val, 0, lv.table.CELL_CTRL.CUSTOM_1) 58 | 59 | # 60 | # A very light-weighted list created from table 61 | # 62 | 63 | # Measure memory usage 64 | gc.enable() 65 | gc.collect() 66 | mem_free = gc.mem_free() 67 | print("mem_free: ",mem_free) 68 | t = ticks_ms() 69 | print("ticks: ", t) 70 | table = lv.table(lv.scr_act()) 71 | 72 | # Set a smaller height to the table. It'll make it scrollable 73 | table.set_size(150, 200) 74 | 75 | table.set_col_width(0, 150) 76 | table.set_row_cnt(ITEM_CNT) # Not required but avoids a lot of memory reallocation lv_table_set_set_value 77 | table.set_col_cnt(1) 78 | 79 | # Don't make the cell pressed, we will draw something different in the event 80 | table.remove_style(None, lv.PART.ITEMS | lv.STATE.PRESSED) 81 | 82 | for i in range(ITEM_CNT): 83 | table.set_cell_value(i, 0, "Item " + str(i+1)) 84 | 85 | table.align(lv.ALIGN.CENTER, 0, -20); 86 | 87 | # Add an event callback to to apply some custom drawing 88 | table.add_event_cb(draw_event_cb, lv.EVENT.DRAW_PART_END, None) 89 | table.add_event_cb(change_event_cb, lv.EVENT.VALUE_CHANGED, None) 90 | 91 | gc.collect() 92 | mem_used = mem_free - gc.mem_free() 93 | elaps = ticks_ms()-t 94 | 95 | label = lv.label(lv.scr_act()) 96 | label.set_text(str(ITEM_CNT) + " items were created in " + str(elaps) + " ms\n using " + str(mem_used) + " bytes of memory") 97 | #label.set_text(str(ITEM_CNT) + " items were created in " + str(elaps) + " ms") 98 | 99 | label.align(lv.ALIGN.BOTTOM_MID, 0, -10) 100 | 101 | -------------------------------------------------------------------------------- /widgets/tabview/lv_example_tabview_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # Create a Tab view object 7 | tabview = lv.tabview(lv.scr_act(), lv.DIR.TOP, 50) 8 | 9 | # Add 3 tabs (the tabs are page (lv_page) and can be scrolled 10 | tab1 = tabview.add_tab("Tab 1") 11 | tab2 = tabview.add_tab("Tab 2") 12 | tab3 = tabview.add_tab("Tab 3") 13 | 14 | # Add content to the tabs 15 | label = lv.label(tab1) 16 | label.set_text("""This the first tab 17 | 18 | If the content 19 | of a tab 20 | becomes too 21 | longer 22 | than the 23 | container 24 | then it 25 | automatically 26 | becomes 27 | scrollable. 28 | 29 | 30 | 31 | Can you see it?""") 32 | 33 | label = lv.label(tab2) 34 | label.set_text("Second tab") 35 | 36 | label = lv.label(tab3) 37 | label.set_text("Third tab"); 38 | 39 | label.scroll_to_view_recursive(lv.ANIM.ON) 40 | 41 | -------------------------------------------------------------------------------- /widgets/tabview/lv_example_tabview_2.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def scroll_begin_event(e): 7 | 8 | #Disable the scroll animations. Triggered when a tab button is clicked */ 9 | if e.get_code() == lv.EVENT.SCROLL_BEGIN: 10 | a = lv.anim_t.__cast__(e.get_param()) 11 | if a: 12 | a.time = 0 13 | 14 | # Create a Tab view object 15 | tabview = lv.tabview(lv.scr_act(), lv.DIR.LEFT, 80) 16 | tabview.get_content().add_event_cb(scroll_begin_event, lv.EVENT.SCROLL_BEGIN, None) 17 | 18 | tabview.set_style_bg_color(lv.palette_lighten(lv.PALETTE.RED, 2), 0) 19 | 20 | tab_btns = tabview.get_tab_btns() 21 | tab_btns.set_style_bg_color(lv.palette_darken(lv.PALETTE.GREY, 3), 0) 22 | tab_btns.set_style_text_color(lv.palette_lighten(lv.PALETTE.GREY, 5), 0) 23 | tab_btns.set_style_border_side(lv.BORDER_SIDE.RIGHT, lv.PART.ITEMS | lv.STATE.CHECKED) 24 | 25 | 26 | # Add 3 tabs (the tabs are page (lv_page) and can be scrolled 27 | tab1 = tabview.add_tab("Tab 1") 28 | tab2 = tabview.add_tab("Tab 2") 29 | tab3 = tabview.add_tab("Tab 3") 30 | tab4 = tabview.add_tab("Tab 4") 31 | tab5 = tabview.add_tab("Tab 5") 32 | 33 | tab2.set_style_bg_color(lv.palette_lighten(lv.PALETTE.AMBER, 3), 0) 34 | tab2.set_style_bg_opa(lv.OPA.COVER, 0) 35 | 36 | # Add content to the tabs 37 | label = lv.label(tab1) 38 | label.set_text("First tab") 39 | 40 | label = lv.label(tab2) 41 | label.set_text("Second tab") 42 | 43 | label = lv.label(tab3) 44 | label.set_text("Third tab") 45 | 46 | label = lv.label(tab4) 47 | label.set_text("Forth tab") 48 | 49 | label = lv.label(tab5) 50 | label.set_text("Fifth tab") 51 | 52 | tabview.get_content().clear_flag(lv.obj.FLAG.SCROLLABLE) 53 | 54 | -------------------------------------------------------------------------------- /widgets/textarea/lv_example_textarea_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def textarea_event_handler(e,ta): 7 | print("Enter was pressed. The current text is: " + ta.get_text()) 8 | 9 | def btnm_event_handler(e,ta): 10 | 11 | obj = lv.btnmatrix.__cast__(e.get_target()) 12 | txt = obj.get_btn_text(obj.get_selected_btn()) 13 | if txt == lv.SYMBOL.BACKSPACE: 14 | ta.del_char() 15 | elif txt == lv.SYMBOL.NEW_LINE: 16 | lv.event_send(ta,lv.EVENT.READY,None) 17 | else: 18 | ta.add_text(txt) 19 | 20 | ta = lv.textarea(lv.scr_act()) 21 | ta.set_one_line(True) 22 | ta.align(lv.ALIGN.TOP_MID, 0, 10) 23 | ta.add_event_cb(lambda e: textarea_event_handler(e,ta), lv.EVENT.READY, None) 24 | ta.add_state(lv.STATE.FOCUSED) # To be sure the cursor is visible 25 | 26 | btnm_map = ["1", "2", "3", "\n", 27 | "4", "5", "6", "\n", 28 | "7", "8", "9", "\n", 29 | lv.SYMBOL.BACKSPACE, "0", lv.SYMBOL.NEW_LINE, ""] 30 | 31 | btnm = lv.btnmatrix(lv.scr_act()) 32 | btnm.set_size(200, 150) 33 | btnm.align(lv.ALIGN.BOTTOM_MID, 0, -10) 34 | btnm.add_event_cb(lambda e: btnm_event_handler(e,ta), lv.EVENT.VALUE_CHANGED, None) 35 | btnm.clear_flag(lv.obj.FLAG.CLICK_FOCUSABLE) # To keep the text area focused on button clicks 36 | btnm.set_map(btnm_map) 37 | 38 | -------------------------------------------------------------------------------- /widgets/textarea/lv_example_textarea_2.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def ta_event_cb(e): 7 | code = e.get_code() 8 | ta = lv.textarea.__cast__(e.get_target()) 9 | if code == lv.EVENT.CLICKED or code == lv.EVENT.FOCUSED: 10 | # Focus on the clicked text area 11 | if kb != None: 12 | kb.set_textarea(ta) 13 | 14 | elif code == lv.EVENT.READY: 15 | print("Ready, current text: " + ta.get_text()) 16 | 17 | 18 | # Create the password box 19 | LV_HOR_RES = lv.scr_act().get_disp().driver.hor_res 20 | LV_VER_RES = lv.scr_act().get_disp().driver.ver_res 21 | 22 | pwd_ta = lv.textarea(lv.scr_act()) 23 | pwd_ta.set_text("") 24 | pwd_ta.set_password_mode(True) 25 | pwd_ta.set_one_line(True) 26 | pwd_ta.set_width(LV_HOR_RES // 2 - 20) 27 | pwd_ta.set_pos(5, 20) 28 | pwd_ta.add_event_cb(ta_event_cb, lv.EVENT.ALL, None) 29 | 30 | # Create a label and position it above the text box 31 | pwd_label = lv.label(lv.scr_act()) 32 | pwd_label.set_text("Password:") 33 | pwd_label.align_to(pwd_ta, lv.ALIGN.OUT_TOP_LEFT, 0, 0) 34 | 35 | # Create the one-line mode text area 36 | text_ta = lv.textarea(lv.scr_act()) 37 | text_ta.set_width(LV_HOR_RES // 2 - 20) 38 | text_ta.set_one_line(True) 39 | text_ta.add_event_cb(ta_event_cb, lv.EVENT.ALL, None) 40 | text_ta.set_password_mode(False) 41 | 42 | text_ta.align(lv.ALIGN.TOP_RIGHT, -5, 20) 43 | 44 | # Create a label and position it above the text box 45 | oneline_label = lv.label(lv.scr_act()) 46 | oneline_label.set_text("Text:") 47 | oneline_label.align_to(text_ta, lv.ALIGN.OUT_TOP_LEFT, 0, 0) 48 | 49 | # Create a keyboard 50 | kb = lv.keyboard(lv.scr_act()) 51 | kb.set_size(LV_HOR_RES, LV_VER_RES // 2) 52 | 53 | kb.set_textarea(pwd_ta) # Focus it on one of the text areas to start 54 | 55 | -------------------------------------------------------------------------------- /widgets/textarea/lv_example_textarea_3.py: -------------------------------------------------------------------------------- 1 | #!//opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def ta_event_cb(e): 7 | ta = lv.textarea.__cast__(e.get_target()) 8 | txt = ta.get_text() 9 | print(txt) 10 | pos = ta.get_cursor_pos() 11 | print("cursor pos: ",pos) 12 | # find position of ":" in text 13 | colon_pos= txt.find(":") 14 | # if there are more than 2 digits before the colon, remove the last one entered 15 | if colon_pos == 3: 16 | ta.del_char() 17 | if colon_pos != -1: 18 | # if there are more than 3 digits after the ":" remove the last one entered 19 | rest = txt[colon_pos:] 20 | if len(rest) > 3: 21 | ta.del_char() 22 | 23 | if len(txt) < 2: 24 | return 25 | if ":" in txt: 26 | return 27 | if txt[0] >= '0' and txt[0] <= '9' and \ 28 | txt[1] >= '0' and txt[1] <= '9': 29 | if len(txt) == 2 or txt[2] != ':' : 30 | ta.set_cursor_pos(2) 31 | ta.add_char(ord(':')) 32 | # 33 | # Automatically format text like a clock. E.g. "12:34" 34 | # Add the ':' automatically 35 | # 36 | # Create the text area 37 | 38 | LV_HOR_RES = lv.scr_act().get_disp().driver.hor_res 39 | LV_VER_RES = lv.scr_act().get_disp().driver.ver_res 40 | 41 | ta = lv.textarea(lv.scr_act()) 42 | ta.add_event_cb(ta_event_cb, lv.EVENT.VALUE_CHANGED, None) 43 | ta.set_accepted_chars("0123456789:") 44 | ta.set_max_length(5) 45 | ta.set_one_line(True) 46 | ta.set_text("") 47 | ta.add_state(lv.STATE.FOCUSED) 48 | 49 | # Create a keyboard 50 | kb = lv.keyboard(lv.scr_act()) 51 | kb.set_size(LV_HOR_RES, LV_VER_RES // 2) 52 | kb.set_mode(lv.keyboard.MODE.NUMBER) 53 | kb.set_textarea(ta) 54 | 55 | 56 | -------------------------------------------------------------------------------- /widgets/tileview/lv_example_tileview_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | # 7 | # Create a 2x2 tile view and allow scrolling only in an "L" shape. 8 | # Demonstrate scroll chaining with a long list that 9 | # scrolls the tile view when it cant't be scrolled further. 10 | # 11 | tv = lv.tileview(lv.scr_act()) 12 | 13 | # Tile1: just a label 14 | tile1 = tv.add_tile(0, 0, lv.DIR.BOTTOM) 15 | label = lv.label(tile1) 16 | label.set_text("Scroll down") 17 | label.center() 18 | 19 | # Tile2: a button 20 | tile2 = tv.add_tile(0, 1, lv.DIR.TOP | lv.DIR.RIGHT) 21 | 22 | btn = lv.btn(tile2) 23 | 24 | label = lv.label(btn) 25 | label.set_text("Scroll up or right") 26 | 27 | btn.set_size(lv.SIZE.CONTENT, lv.SIZE.CONTENT) 28 | btn.center() 29 | 30 | # Tile3: a list 31 | tile3 = tv.add_tile(1, 1, lv.DIR.LEFT) 32 | list = lv.list(tile3) 33 | list.set_size(lv.pct(100), lv.pct(100)) 34 | 35 | list.add_btn(None, "One") 36 | list.add_btn(None, "Two") 37 | list.add_btn(None, "Three") 38 | list.add_btn(None, "Four") 39 | list.add_btn(None, "Five") 40 | list.add_btn(None, "Six") 41 | list.add_btn(None, "Seven") 42 | list.add_btn(None, "Eight") 43 | list.add_btn(None, "Nine") 44 | list.add_btn(None, "Ten") 45 | 46 | -------------------------------------------------------------------------------- /widgets/win/lv_example_win_1.py: -------------------------------------------------------------------------------- 1 | #!/opt/bin/lv_micropython -i 2 | import time 3 | import lvgl as lv 4 | import display_driver 5 | 6 | def event_handler(e): 7 | code = e.get_code() 8 | obj = lv.obj.__cast__(e.get_target()) 9 | if code == lv.EVENT.CLICKED: 10 | print("Button {:d} clicked".format(obj.get_child_id())) 11 | 12 | win = lv.win(lv.scr_act(), 60) 13 | btn1 = win.add_btn(lv.SYMBOL.LEFT, 40) 14 | btn1.add_event_cb(event_handler,lv.EVENT.ALL, None) 15 | win.add_title("A title") 16 | btn2=win.add_btn(lv.SYMBOL.RIGHT, 40) 17 | btn2.add_event_cb(event_handler,lv.EVENT.ALL, None) 18 | btn3 = win.add_btn(lv.SYMBOL.CLOSE, 60) 19 | btn3.add_event_cb(event_handler,lv.EVENT.ALL, None) 20 | 21 | cont = win.get_content() #Content can be aded here 22 | label = lv.label(cont) 23 | label.set_text("""This is 24 | a pretty 25 | long text 26 | to see how 27 | the window 28 | becomes 29 | scrollable. 30 | 31 | 32 | We need 33 | quite some text 34 | and we will 35 | even put 36 | some more 37 | text to be 38 | sure it 39 | overflows. 40 | """) 41 | 42 | --------------------------------------------------------------------------------