summaryrefslogtreecommitdiff
path: root/lib/lvgl/examples/anim
diff options
context:
space:
mode:
authorjacqueline <me@jacqueline.id.au>2023-06-01 15:41:47 +1000
committerjacqueline <me@jacqueline.id.au>2023-06-01 15:41:47 +1000
commitdd27c3530432ea0b09f01e604bf577f31d8ef841 (patch)
treebbf86cf81a78f0ff0b07f31f1c390db473f26fd3 /lib/lvgl/examples/anim
parent6fd588e970470b15936187980829916d0dbe77bb (diff)
downloadtangara-fw-dd27c3530432ea0b09f01e604bf577f31d8ef841.tar.gz
convert lvgl from submodule to a plain old directory
Diffstat (limited to 'lib/lvgl/examples/anim')
m---------lib/lvgl0
-rw-r--r--lib/lvgl/examples/anim/index.rst17
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim.h41
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_1.c53
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_1.py41
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_2.c45
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_2.py41
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_3.c165
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_3.py123
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_timeline_1.c192
-rw-r--r--lib/lvgl/examples/anim/lv_example_anim_timeline_1.py143
11 files changed, 861 insertions, 0 deletions
diff --git a/lib/lvgl b/lib/lvgl
deleted file mode 160000
-Subproject 0732400e7b564dd0e7dc4a924619d8e19c5b23a
diff --git a/lib/lvgl/examples/anim/index.rst b/lib/lvgl/examples/anim/index.rst
new file mode 100644
index 00000000..3eda5551
--- /dev/null
+++ b/lib/lvgl/examples/anim/index.rst
@@ -0,0 +1,17 @@
+
+Start animation on an event
+""""""""""""""""""""""""""""
+
+.. lv_example:: anim/lv_example_anim_1
+ :language: c
+
+Playback animation
+"""""""""""""""""""
+.. lv_example:: anim/lv_example_anim_2
+ :language: c
+
+Animation timeline
+"""""""""""""""""""
+.. lv_example:: anim/lv_example_anim_timeline_1
+ :language: c
+
diff --git a/lib/lvgl/examples/anim/lv_example_anim.h b/lib/lvgl/examples/anim/lv_example_anim.h
new file mode 100644
index 00000000..48b61b02
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim.h
@@ -0,0 +1,41 @@
+/**
+ * @file lv_example_anim.h
+ *
+ */
+
+#ifndef LV_EXAMPLE_ANIM_H
+#define LV_EXAMPLE_ANIM_H
+
+#ifdef __cplusplus
+extern "C" {
+#endif
+
+/*********************
+ * INCLUDES
+ *********************/
+
+/*********************
+ * DEFINES
+ *********************/
+
+/**********************
+ * TYPEDEFS
+ **********************/
+
+/**********************
+ * GLOBAL PROTOTYPES
+ **********************/
+void lv_example_anim_1(void);
+void lv_example_anim_2(void);
+void lv_example_anim_3(void);
+void lv_example_anim_timeline_1(void);
+
+/**********************
+ * MACROS
+ **********************/
+
+#ifdef __cplusplus
+} /*extern "C"*/
+#endif
+
+#endif /*LV_EXAMPLE_ANIM_H*/
diff --git a/lib/lvgl/examples/anim/lv_example_anim_1.c b/lib/lvgl/examples/anim/lv_example_anim_1.c
new file mode 100644
index 00000000..6c16a918
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_1.c
@@ -0,0 +1,53 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_SWITCH
+
+static void anim_x_cb(void * var, int32_t v)
+{
+ lv_obj_set_x(var, v);
+}
+
+static void sw_event_cb(lv_event_t * e)
+{
+ lv_obj_t * sw = lv_event_get_target(e);
+ lv_obj_t * label = lv_event_get_user_data(e);
+
+ if(lv_obj_has_state(sw, LV_STATE_CHECKED)) {
+ lv_anim_t a;
+ lv_anim_init(&a);
+ lv_anim_set_var(&a, label);
+ lv_anim_set_values(&a, lv_obj_get_x(label), 100);
+ lv_anim_set_time(&a, 500);
+ lv_anim_set_exec_cb(&a, anim_x_cb);
+ lv_anim_set_path_cb(&a, lv_anim_path_overshoot);
+ lv_anim_start(&a);
+ }
+ else {
+ lv_anim_t a;
+ lv_anim_init(&a);
+ lv_anim_set_var(&a, label);
+ lv_anim_set_values(&a, lv_obj_get_x(label), -lv_obj_get_width(label));
+ lv_anim_set_time(&a, 500);
+ lv_anim_set_exec_cb(&a, anim_x_cb);
+ lv_anim_set_path_cb(&a, lv_anim_path_ease_in);
+ lv_anim_start(&a);
+ }
+
+}
+
+/**
+ * Start animation on an event
+ */
+void lv_example_anim_1(void)
+{
+ lv_obj_t * label = lv_label_create(lv_scr_act());
+ lv_label_set_text(label, "Hello animations!");
+ lv_obj_set_pos(label, 100, 10);
+
+
+ lv_obj_t * sw = lv_switch_create(lv_scr_act());
+ lv_obj_center(sw);
+ lv_obj_add_state(sw, LV_STATE_CHECKED);
+ lv_obj_add_event_cb(sw, sw_event_cb, LV_EVENT_VALUE_CHANGED, label);
+}
+
+#endif
diff --git a/lib/lvgl/examples/anim/lv_example_anim_1.py b/lib/lvgl/examples/anim/lv_example_anim_1.py
new file mode 100644
index 00000000..64ee1ce6
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_1.py
@@ -0,0 +1,41 @@
+def anim_x_cb(label, v):
+ label.set_x(v)
+
+def sw_event_cb(e,label):
+ sw = e.get_target()
+
+ if sw.has_state(lv.STATE.CHECKED):
+ a = lv.anim_t()
+ a.init()
+ a.set_var(label)
+ a.set_values(label.get_x(), 100)
+ a.set_time(500)
+ a.set_path_cb(lv.anim_t.path_overshoot)
+ a.set_custom_exec_cb(lambda a,val: anim_x_cb(label,val))
+ lv.anim_t.start(a)
+ else:
+ a = lv.anim_t()
+ a.init()
+ a.set_var(label)
+ a.set_values(label.get_x(), -label.get_width())
+ a.set_time(500)
+ a.set_path_cb(lv.anim_t.path_ease_in)
+ a.set_custom_exec_cb(lambda a,val: anim_x_cb(label,val))
+ lv.anim_t.start(a)
+
+#
+# Start animation on an event
+#
+
+label = lv.label(lv.scr_act())
+label.set_text("Hello animations!")
+label.set_pos(100, 10)
+
+
+sw = lv.switch(lv.scr_act())
+sw.center()
+sw.add_state(lv.STATE.CHECKED)
+sw.add_event_cb(lambda e: sw_event_cb(e,label), lv.EVENT.VALUE_CHANGED, None)
+
+
+
diff --git a/lib/lvgl/examples/anim/lv_example_anim_2.c b/lib/lvgl/examples/anim/lv_example_anim_2.c
new file mode 100644
index 00000000..d030ed60
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_2.c
@@ -0,0 +1,45 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_SWITCH
+
+
+static void anim_x_cb(void * var, int32_t v)
+{
+ lv_obj_set_x(var, v);
+}
+
+static void anim_size_cb(void * var, int32_t v)
+{
+ lv_obj_set_size(var, v, v);
+}
+
+/**
+ * Create a playback animation
+ */
+void lv_example_anim_2(void)
+{
+
+ lv_obj_t * obj = lv_obj_create(lv_scr_act());
+ lv_obj_set_style_bg_color(obj, lv_palette_main(LV_PALETTE_RED), 0);
+ lv_obj_set_style_radius(obj, LV_RADIUS_CIRCLE, 0);
+
+ lv_obj_align(obj, LV_ALIGN_LEFT_MID, 10, 0);
+
+ lv_anim_t a;
+ lv_anim_init(&a);
+ lv_anim_set_var(&a, obj);
+ lv_anim_set_values(&a, 10, 50);
+ lv_anim_set_time(&a, 1000);
+ lv_anim_set_playback_delay(&a, 100);
+ lv_anim_set_playback_time(&a, 300);
+ lv_anim_set_repeat_delay(&a, 500);
+ lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
+ lv_anim_set_path_cb(&a, lv_anim_path_ease_in_out);
+
+ lv_anim_set_exec_cb(&a, anim_size_cb);
+ lv_anim_start(&a);
+ lv_anim_set_exec_cb(&a, anim_x_cb);
+ lv_anim_set_values(&a, 10, 240);
+ lv_anim_start(&a);
+}
+
+#endif
diff --git a/lib/lvgl/examples/anim/lv_example_anim_2.py b/lib/lvgl/examples/anim/lv_example_anim_2.py
new file mode 100644
index 00000000..1b0356a5
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_2.py
@@ -0,0 +1,41 @@
+def anim_x_cb(obj, v):
+ obj.set_x(v)
+
+def anim_size_cb(obj, v):
+ obj.set_size(v, v)
+
+
+#
+# Create a playback animation
+#
+obj = lv.obj(lv.scr_act())
+obj.set_style_bg_color(lv.palette_main(lv.PALETTE.RED), 0)
+obj.set_style_radius(lv.RADIUS.CIRCLE, 0)
+
+obj.align(lv.ALIGN.LEFT_MID, 10, 0)
+
+a1 = lv.anim_t()
+a1.init()
+a1.set_var(obj)
+a1.set_values(10, 50)
+a1.set_time(1000)
+a1.set_playback_delay(100)
+a1.set_playback_time(300)
+a1.set_repeat_delay(500)
+a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE)
+a1.set_path_cb(lv.anim_t.path_ease_in_out)
+a1.set_custom_exec_cb(lambda a1,val: anim_size_cb(obj,val))
+lv.anim_t.start(a1)
+
+a2 = lv.anim_t()
+a2.init()
+a2.set_var(obj)
+a2.set_values(10, 240)
+a2.set_time(1000)
+a2.set_playback_delay(100)
+a2.set_playback_time(300)
+a2.set_repeat_delay(500)
+a2.set_repeat_count(lv.ANIM_REPEAT.INFINITE)
+a2.set_path_cb(lv.anim_t.path_ease_in_out)
+a2.set_custom_exec_cb(lambda a1,val: anim_x_cb(obj,val))
+lv.anim_t.start(a2)
diff --git a/lib/lvgl/examples/anim/lv_example_anim_3.c b/lib/lvgl/examples/anim/lv_example_anim_3.c
new file mode 100644
index 00000000..dedcad99
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_3.c
@@ -0,0 +1,165 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_SLIDER && LV_USE_CHART && LV_USE_BTN && LV_USE_GRID
+
+/**
+ * the example show the use of cubic-bezier3 in animation.
+ * the control point P1,P2 of cubic-bezier3 can be adjusted by slider.
+ * and the chart shows the cubic-bezier3 in real time. you can click
+ * run button see animation in current point of cubic-bezier3.
+ */
+
+#define CHART_POINTS_NUM 256
+
+struct {
+ lv_obj_t * anim_obj;
+ lv_obj_t * chart;
+ lv_chart_series_t * ser1;
+ lv_obj_t * p1_slider;
+ lv_obj_t * p1_label;
+ lv_obj_t * p2_slider;
+ lv_obj_t * p2_label;
+ lv_obj_t * run_btn;
+ uint16_t p1;
+ uint16_t p2;
+ lv_anim_t a;
+} ginfo;
+
+static int32_t anim_path_bezier3_cb(const lv_anim_t * a);
+static void refer_chart_cubic_bezier(void);
+static void run_btn_event_handler(lv_event_t * e);
+static void slider_event_cb(lv_event_t * e);
+static void page_obj_init(lv_obj_t * par);
+static void anim_x_cb(void * var, int32_t v);
+
+/**
+ * create an animation
+ */
+void lv_example_anim_3(void)
+{
+ static lv_coord_t col_dsc[] = {LV_GRID_FR(1), 200, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
+ static lv_coord_t row_dsc[] = {30, 10, 10, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
+
+ /*Create a container with grid*/
+ lv_obj_t * cont = lv_obj_create(lv_scr_act());
+ lv_obj_set_style_pad_all(cont, 2, LV_PART_MAIN);
+ lv_obj_set_style_pad_column(cont, 10, LV_PART_MAIN);
+ lv_obj_set_style_pad_row(cont, 10, LV_PART_MAIN);
+ lv_obj_set_grid_dsc_array(cont, col_dsc, row_dsc);
+ lv_obj_set_size(cont, 320, 240);
+ lv_obj_center(cont);
+
+ page_obj_init(cont);
+
+ lv_anim_init(&ginfo.a);
+ lv_anim_set_var(&ginfo.a, ginfo.anim_obj);
+ int32_t end = lv_obj_get_style_width(cont, LV_PART_MAIN) -
+ lv_obj_get_style_width(ginfo.anim_obj, LV_PART_MAIN) - 10;
+ lv_anim_set_values(&ginfo.a, 5, end);
+ lv_anim_set_time(&ginfo.a, 2000);
+ lv_anim_set_exec_cb(&ginfo.a, anim_x_cb);
+ lv_anim_set_path_cb(&ginfo.a, anim_path_bezier3_cb);
+
+ refer_chart_cubic_bezier();
+}
+
+static int32_t anim_path_bezier3_cb(const lv_anim_t * a)
+{
+ uint32_t t = lv_map(a->act_time, 0, a->time, 0, 1024);
+ int32_t step = lv_bezier3(t, 0, ginfo.p1, ginfo.p2, 1024);
+ int32_t new_value;
+ new_value = step * (a->end_value - a->start_value);
+ new_value = new_value >> 10;
+ new_value += a->start_value;
+ return new_value;
+}
+
+static void refer_chart_cubic_bezier(void)
+{
+ for(uint16_t i = 0; i <= CHART_POINTS_NUM; i ++) {
+ uint32_t t = i * (1024 / CHART_POINTS_NUM);
+ int32_t step = lv_bezier3(t, 0, ginfo.p1, ginfo.p2, 1024);
+ lv_chart_set_value_by_id2(ginfo.chart, ginfo.ser1, i, t, step);
+ }
+ lv_chart_refresh(ginfo.chart);
+}
+
+static void anim_x_cb(void * var, int32_t v)
+{
+ lv_obj_set_style_translate_x(var, v, LV_PART_MAIN);
+}
+
+static void run_btn_event_handler(lv_event_t * e)
+{
+ lv_event_code_t code = lv_event_get_code(e);
+ if(code == LV_EVENT_CLICKED) {
+ lv_anim_start(&ginfo.a);
+ }
+}
+
+static void slider_event_cb(lv_event_t * e)
+{
+ char buf[16];
+ lv_obj_t * label;
+ lv_obj_t * slider = lv_event_get_target(e);
+
+ if(slider == ginfo.p1_slider) {
+ label = ginfo.p1_label;
+ ginfo.p1 = lv_slider_get_value(slider);
+ lv_snprintf(buf, sizeof(buf), "p1:%d", ginfo.p1);
+ }
+ else {
+ label = ginfo.p2_label;
+ ginfo.p2 = lv_slider_get_value(slider);
+ lv_snprintf(buf, sizeof(buf), "p2:%d", ginfo.p2);
+ }
+
+ lv_label_set_text(label, buf);
+ refer_chart_cubic_bezier();
+}
+
+static void page_obj_init(lv_obj_t * par)
+{
+ ginfo.anim_obj = lv_obj_create(par);
+ lv_obj_set_size(ginfo.anim_obj, 30, 30);
+ lv_obj_set_align(ginfo.anim_obj, LV_ALIGN_TOP_LEFT);
+ lv_obj_clear_flag(ginfo.anim_obj, LV_OBJ_FLAG_SCROLLABLE);
+ lv_obj_set_style_bg_color(ginfo.anim_obj, lv_palette_main(LV_PALETTE_RED), LV_PART_MAIN);
+ lv_obj_set_grid_cell(ginfo.anim_obj, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 0, 1);
+
+ ginfo.p1_label = lv_label_create(par);
+ ginfo.p2_label = lv_label_create(par);
+ lv_label_set_text(ginfo.p1_label, "p1:0");
+ lv_label_set_text(ginfo.p2_label, "p2:0");
+ lv_obj_set_grid_cell(ginfo.p1_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 1, 1);
+ lv_obj_set_grid_cell(ginfo.p2_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
+
+ ginfo.p1_slider = lv_slider_create(par);
+ ginfo.p2_slider = lv_slider_create(par);
+ lv_slider_set_range(ginfo.p1_slider, 0, 1024);
+ lv_slider_set_range(ginfo.p2_slider, 0, 1024);
+ lv_obj_set_style_pad_all(ginfo.p1_slider, 2, LV_PART_KNOB);
+ lv_obj_set_style_pad_all(ginfo.p2_slider, 2, LV_PART_KNOB);
+ lv_obj_add_event_cb(ginfo.p1_slider, slider_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
+ lv_obj_add_event_cb(ginfo.p2_slider, slider_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
+ lv_obj_set_grid_cell(ginfo.p1_slider, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_START, 1, 1);
+ lv_obj_set_grid_cell(ginfo.p2_slider, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_START, 2, 1);
+
+ ginfo.run_btn = lv_btn_create(par);
+ lv_obj_add_event_cb(ginfo.run_btn, run_btn_event_handler, LV_EVENT_CLICKED, NULL);
+ lv_obj_t * btn_label = lv_label_create(ginfo.run_btn);
+ lv_label_set_text(btn_label, LV_SYMBOL_PLAY);
+ lv_obj_center(btn_label);
+ lv_obj_set_grid_cell(ginfo.run_btn, LV_GRID_ALIGN_STRETCH, 2, 1, LV_GRID_ALIGN_STRETCH, 1, 2);
+
+ ginfo.chart = lv_chart_create(par);
+ lv_obj_set_style_pad_all(ginfo.chart, 0, LV_PART_MAIN);
+ lv_obj_set_style_size(ginfo.chart, 0, LV_PART_INDICATOR);
+ lv_chart_set_type(ginfo.chart, LV_CHART_TYPE_SCATTER);
+ ginfo.ser1 = lv_chart_add_series(ginfo.chart, lv_palette_main(LV_PALETTE_RED), LV_CHART_AXIS_PRIMARY_Y);
+ lv_chart_set_range(ginfo.chart, LV_CHART_AXIS_PRIMARY_Y, 0, 1024);
+ lv_chart_set_range(ginfo.chart, LV_CHART_AXIS_PRIMARY_X, 0, 1024);
+ lv_chart_set_point_count(ginfo.chart, CHART_POINTS_NUM);
+ lv_obj_set_grid_cell(ginfo.chart, LV_GRID_ALIGN_STRETCH, 0, 3, LV_GRID_ALIGN_STRETCH, 3, 1);
+}
+
+#endif
diff --git a/lib/lvgl/examples/anim/lv_example_anim_3.py b/lib/lvgl/examples/anim/lv_example_anim_3.py
new file mode 100644
index 00000000..ef7ebb2f
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_3.py
@@ -0,0 +1,123 @@
+from micropython import const
+
+# the example show the use of cubic-bezier3 in animation.
+# the control point P1,P2 of cubic-bezier3 can be adjusted by slider.
+# and the chart shows the cubic-bezier3 in real time. you can click
+# run button see animation in current point of cubic-bezier3.
+#
+
+CHART_POINTS_NUM = const(256)
+
+class LvExampleAnim_3():
+ #
+ # create an animation
+ #
+ def __init__(self):
+ # Create a container with grid
+ col_dsc = [lv.grid_fr(1), 200, lv.grid_fr(1), lv.GRID_TEMPLATE.LAST]
+ row_dsc = [30, 10, 10, lv.grid_fr(1),lv.GRID_TEMPLATE.LAST]
+
+ self.p1 = 0
+ self.p2 = 0
+ self.cont = lv.obj(lv.scr_act())
+ self.cont.set_style_pad_all(2, lv.PART.MAIN)
+ self.cont.set_style_pad_column(10, lv.PART.MAIN)
+ self.cont.set_style_pad_row(10, lv.PART.MAIN)
+ self.cont.set_grid_dsc_array(col_dsc, row_dsc)
+ self.cont.set_size(320, 240)
+ self.cont.center()
+ self.page_obj_init(self.cont)
+
+ self.a = lv.anim_t()
+ self.a.init()
+ self.a.set_var(self.anim_obj)
+ end = self.cont.get_style_width(lv.PART.MAIN) - self.anim_obj.get_style_width(lv.PART.MAIN) - 10
+ self.a.set_values(5, end)
+ self.a.set_time(2000)
+ self.a.set_custom_exec_cb(lambda a,val: self.anim_x_cb(self.anim_obj,val))
+ self.a.set_path_cb(self.anim_path_bezier3_cb)
+ self.refer_chart_cubic_bezier()
+
+ def page_obj_init(self,par):
+ self.anim_obj = lv.obj(par)
+ self.anim_obj.set_size(30, 30)
+ self.anim_obj.set_align(lv.ALIGN.TOP_LEFT)
+ self.anim_obj.clear_flag(lv.obj.FLAG.SCROLLABLE)
+ self.anim_obj.set_style_bg_color(lv.palette_main(lv.PALETTE.RED), lv.PART.MAIN)
+ self.anim_obj.set_grid_cell(lv.GRID_ALIGN.START, 0, 1,lv.GRID_ALIGN.START, 0, 1)
+
+ self.p1_label = lv.label(par)
+ self.p2_label = lv.label(par)
+ self.p1_label.set_text("p1:0")
+ self.p2_label.set_text("p2:0")
+ self.p1_label.set_grid_cell(lv.GRID_ALIGN.START, 0, 1,lv.GRID_ALIGN.START, 1, 1)
+ self.p2_label.set_grid_cell(lv.GRID_ALIGN.START, 0, 1,lv.GRID_ALIGN.START, 2, 1)
+
+ self.p1_slider = lv.slider(par)
+ self.p2_slider = lv.slider(par)
+ self.p1_slider.set_range(0, 1024)
+ self.p2_slider.set_range(0, 1024)
+ self.p1_slider.set_style_pad_all(2, lv.PART.KNOB)
+ self.p2_slider.set_style_pad_all(2, lv.PART.KNOB)
+ self.p1_slider.add_event_cb(self.slider_event_cb, lv.EVENT.VALUE_CHANGED, None)
+ self.p2_slider.add_event_cb(self.slider_event_cb, lv.EVENT.VALUE_CHANGED, None)
+ self.p1_slider.set_grid_cell(lv.GRID_ALIGN.STRETCH, 1, 1,lv.GRID_ALIGN.START, 1, 1)
+ self.p2_slider.set_grid_cell(lv.GRID_ALIGN.STRETCH, 1, 1,lv.GRID_ALIGN.START, 2, 1)
+
+ self.run_btn = lv.btn(par)
+ self.run_btn.add_event_cb(self.run_btn_event_handler, lv.EVENT.CLICKED, None)
+ btn_label = lv.label(self.run_btn)
+ btn_label.set_text(lv.SYMBOL.PLAY)
+ btn_label.center()
+ self.run_btn.set_grid_cell(lv.GRID_ALIGN.STRETCH, 2, 1,lv.GRID_ALIGN.STRETCH, 1, 2)
+
+ self.chart = lv.chart(par)
+ self.chart.set_style_pad_all(0, lv.PART.MAIN)
+ self.chart.set_style_size(0, lv.PART.INDICATOR)
+ self.chart.set_type(lv.chart.TYPE.SCATTER)
+ self.ser1 = self.chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y)
+ self.chart.set_range(lv.chart.AXIS.PRIMARY_Y, 0, 1024)
+ self.chart.set_range(lv.chart.AXIS.PRIMARY_X, 0, 1024)
+ self.chart.set_point_count(CHART_POINTS_NUM)
+ self.chart.set_grid_cell(lv.GRID_ALIGN.STRETCH, 0, 3,lv.GRID_ALIGN.STRETCH, 3, 1)
+
+ def refer_chart_cubic_bezier(self):
+ for i in range(CHART_POINTS_NUM+1):
+ t = i * (1024 // CHART_POINTS_NUM)
+ step = lv.bezier3(t, 0, self.p1, self.p2, 1024)
+ self.chart.set_value_by_id2(self.ser1, i, t, step)
+ self.chart.refresh()
+
+ def slider_event_cb(self,e):
+ slider = e.get_target()
+
+ if slider == self.p1_slider:
+ label = self.p1_label
+ self.p1 = slider.get_value()
+ label.set_text("p1: {:d}".format(self.p1))
+ else:
+ label = self.p2_label
+ self.p2 = slider.get_value()
+ label.set_text("p1: {:d}".format(self.p2))
+
+ self.refer_chart_cubic_bezier()
+
+
+ def run_btn_event_handler(self,e):
+
+ code = e.get_code()
+ if code == lv.EVENT.CLICKED:
+ lv.anim_t.start(self.a)
+
+ def anim_x_cb(self, var, v):
+ var.set_style_translate_x(v, lv.PART.MAIN)
+
+ def anim_path_bezier3_cb(self,a):
+ t = lv.map(a.act_time, 0, a.time, 0, 1024)
+ step = lv.bezier3(t, 0, self.p1, self.p2, 1024)
+ new_value = step * (a.end_value - a.start_value)
+ new_value = new_value >> 10
+ new_value += a.start_value
+ return new_value
+
+lv_example_anim_3 = LvExampleAnim_3()
diff --git a/lib/lvgl/examples/anim/lv_example_anim_timeline_1.c b/lib/lvgl/examples/anim/lv_example_anim_timeline_1.c
new file mode 100644
index 00000000..d2d4e81b
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_timeline_1.c
@@ -0,0 +1,192 @@
+#include "../lv_examples.h"
+#if LV_USE_FLEX && LV_BUILD_EXAMPLES
+
+static lv_anim_timeline_t * anim_timeline = NULL;
+
+static lv_obj_t * obj1 = NULL;
+static lv_obj_t * obj2 = NULL;
+static lv_obj_t * obj3 = NULL;
+
+static const lv_coord_t obj_width = 90;
+static const lv_coord_t obj_height = 70;
+
+static void set_width(void * var, int32_t v)
+{
+ lv_obj_set_width((lv_obj_t *)var, v);
+}
+
+static void set_height(void * var, int32_t v)
+{
+ lv_obj_set_height((lv_obj_t *)var, v);
+}
+
+static void anim_timeline_create(void)
+{
+ /* obj1 */
+ lv_anim_t a1;
+ lv_anim_init(&a1);
+ lv_anim_set_var(&a1, obj1);
+ lv_anim_set_values(&a1, 0, obj_width);
+ lv_anim_set_early_apply(&a1, false);
+ lv_anim_set_exec_cb(&a1, (lv_anim_exec_xcb_t)set_width);
+ lv_anim_set_path_cb(&a1, lv_anim_path_overshoot);
+ lv_anim_set_time(&a1, 300);
+
+ lv_anim_t a2;
+ lv_anim_init(&a2);
+ lv_anim_set_var(&a2, obj1);
+ lv_anim_set_values(&a2, 0, obj_height);
+ lv_anim_set_early_apply(&a2, false);
+ lv_anim_set_exec_cb(&a2, (lv_anim_exec_xcb_t)set_height);
+ lv_anim_set_path_cb(&a2, lv_anim_path_ease_out);
+ lv_anim_set_time(&a2, 300);
+
+ /* obj2 */
+ lv_anim_t a3;
+ lv_anim_init(&a3);
+ lv_anim_set_var(&a3, obj2);
+ lv_anim_set_values(&a3, 0, obj_width);
+ lv_anim_set_early_apply(&a3, false);
+ lv_anim_set_exec_cb(&a3, (lv_anim_exec_xcb_t)set_width);
+ lv_anim_set_path_cb(&a3, lv_anim_path_overshoot);
+ lv_anim_set_time(&a3, 300);
+
+ lv_anim_t a4;
+ lv_anim_init(&a4);
+ lv_anim_set_var(&a4, obj2);
+ lv_anim_set_values(&a4, 0, obj_height);
+ lv_anim_set_early_apply(&a4, false);
+ lv_anim_set_exec_cb(&a4, (lv_anim_exec_xcb_t)set_height);
+ lv_anim_set_path_cb(&a4, lv_anim_path_ease_out);
+ lv_anim_set_time(&a4, 300);
+
+ /* obj3 */
+ lv_anim_t a5;
+ lv_anim_init(&a5);
+ lv_anim_set_var(&a5, obj3);
+ lv_anim_set_values(&a5, 0, obj_width);
+ lv_anim_set_early_apply(&a5, false);
+ lv_anim_set_exec_cb(&a5, (lv_anim_exec_xcb_t)set_width);
+ lv_anim_set_path_cb(&a5, lv_anim_path_overshoot);
+ lv_anim_set_time(&a5, 300);
+
+ lv_anim_t a6;
+ lv_anim_init(&a6);
+ lv_anim_set_var(&a6, obj3);
+ lv_anim_set_values(&a6, 0, obj_height);
+ lv_anim_set_early_apply(&a6, false);
+ lv_anim_set_exec_cb(&a6, (lv_anim_exec_xcb_t)set_height);
+ lv_anim_set_path_cb(&a6, lv_anim_path_ease_out);
+ lv_anim_set_time(&a6, 300);
+
+ /* Create anim timeline */
+ anim_timeline = lv_anim_timeline_create();
+ lv_anim_timeline_add(anim_timeline, 0, &a1);
+ lv_anim_timeline_add(anim_timeline, 0, &a2);
+ lv_anim_timeline_add(anim_timeline, 200, &a3);
+ lv_anim_timeline_add(anim_timeline, 200, &a4);
+ lv_anim_timeline_add(anim_timeline, 400, &a5);
+ lv_anim_timeline_add(anim_timeline, 400, &a6);
+}
+
+static void btn_start_event_handler(lv_event_t * e)
+{
+ lv_obj_t * btn = lv_event_get_target(e);
+
+ if(!anim_timeline) {
+ anim_timeline_create();
+ }
+
+ bool reverse = lv_obj_has_state(btn, LV_STATE_CHECKED);
+ lv_anim_timeline_set_reverse(anim_timeline, reverse);
+ lv_anim_timeline_start(anim_timeline);
+}
+
+static void btn_del_event_handler(lv_event_t * e)
+{
+ LV_UNUSED(e);
+ if(anim_timeline) {
+ lv_anim_timeline_del(anim_timeline);
+ anim_timeline = NULL;
+ }
+}
+
+static void btn_stop_event_handler(lv_event_t * e)
+{
+ LV_UNUSED(e);
+ if(anim_timeline) {
+ lv_anim_timeline_stop(anim_timeline);
+ }
+}
+
+static void slider_prg_event_handler(lv_event_t * e)
+{
+ lv_obj_t * slider = lv_event_get_target(e);
+
+ if(!anim_timeline) {
+ anim_timeline_create();
+ }
+
+ int32_t progress = lv_slider_get_value(slider);
+ lv_anim_timeline_set_progress(anim_timeline, progress);
+}
+
+/**
+ * Create an animation timeline
+ */
+void lv_example_anim_timeline_1(void)
+{
+ lv_obj_t * par = lv_scr_act();
+ lv_obj_set_flex_flow(par, LV_FLEX_FLOW_ROW);
+ lv_obj_set_flex_align(par, LV_FLEX_ALIGN_SPACE_AROUND, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
+
+ /* create btn_start */
+ lv_obj_t * btn_start = lv_btn_create(par);
+ lv_obj_add_event_cb(btn_start, btn_start_event_handler, LV_EVENT_VALUE_CHANGED, NULL);
+ lv_obj_add_flag(btn_start, LV_OBJ_FLAG_IGNORE_LAYOUT);
+ lv_obj_add_flag(btn_start, LV_OBJ_FLAG_CHECKABLE);
+ lv_obj_align(btn_start, LV_ALIGN_TOP_MID, -100, 20);
+
+ lv_obj_t * label_start = lv_label_create(btn_start);
+ lv_label_set_text(label_start, "Start");
+ lv_obj_center(label_start);
+
+ /* create btn_del */
+ lv_obj_t * btn_del = lv_btn_create(par);
+ lv_obj_add_event_cb(btn_del, btn_del_event_handler, LV_EVENT_CLICKED, NULL);
+ lv_obj_add_flag(btn_del, LV_OBJ_FLAG_IGNORE_LAYOUT);
+ lv_obj_align(btn_del, LV_ALIGN_TOP_MID, 0, 20);
+
+ lv_obj_t * label_del = lv_label_create(btn_del);
+ lv_label_set_text(label_del, "Delete");
+ lv_obj_center(label_del);
+
+ /* create btn_stop */
+ lv_obj_t * btn_stop = lv_btn_create(par);
+ lv_obj_add_event_cb(btn_stop, btn_stop_event_handler, LV_EVENT_CLICKED, NULL);
+ lv_obj_add_flag(btn_stop, LV_OBJ_FLAG_IGNORE_LAYOUT);
+ lv_obj_align(btn_stop, LV_ALIGN_TOP_MID, 100, 20);
+
+ lv_obj_t * label_stop = lv_label_create(btn_stop);
+ lv_label_set_text(label_stop, "Stop");
+ lv_obj_center(label_stop);
+
+ /* create slider_prg */
+ lv_obj_t * slider_prg = lv_slider_create(par);
+ lv_obj_add_event_cb(slider_prg, slider_prg_event_handler, LV_EVENT_VALUE_CHANGED, NULL);
+ lv_obj_add_flag(slider_prg, LV_OBJ_FLAG_IGNORE_LAYOUT);
+ lv_obj_align(slider_prg, LV_ALIGN_BOTTOM_MID, 0, -20);
+ lv_slider_set_range(slider_prg, 0, 65535);
+
+ /* create 3 objects */
+ obj1 = lv_obj_create(par);
+ lv_obj_set_size(obj1, obj_width, obj_height);
+
+ obj2 = lv_obj_create(par);
+ lv_obj_set_size(obj2, obj_width, obj_height);
+
+ obj3 = lv_obj_create(par);
+ lv_obj_set_size(obj3, obj_width, obj_height);
+}
+
+#endif
diff --git a/lib/lvgl/examples/anim/lv_example_anim_timeline_1.py b/lib/lvgl/examples/anim/lv_example_anim_timeline_1.py
new file mode 100644
index 00000000..b5ed3e54
--- /dev/null
+++ b/lib/lvgl/examples/anim/lv_example_anim_timeline_1.py
@@ -0,0 +1,143 @@
+class LV_ExampleAnimTimeline_1(object):
+
+ def __init__(self):
+ self.obj_width = 120
+ self.obj_height = 150
+ #
+ # Create an animation timeline
+ #
+
+ self.par = lv.scr_act()
+ self.par.set_flex_flow(lv.FLEX_FLOW.ROW)
+ self.par.set_flex_align(lv.FLEX_ALIGN.SPACE_AROUND, lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER)
+
+ self.btn_run = lv.btn(self.par)
+ self.btn_run.add_event_cb(self.btn_run_event_handler, lv.EVENT.VALUE_CHANGED, None)
+ self.btn_run.add_flag(lv.obj.FLAG.IGNORE_LAYOUT)
+ self.btn_run.add_flag(lv.obj.FLAG.CHECKABLE)
+ self.btn_run.align(lv.ALIGN.TOP_MID, -50, 20)
+
+ self.label_run = lv.label(self.btn_run)
+ self.label_run.set_text("Run")
+ self.label_run.center()
+
+ self.btn_del = lv.btn(self.par)
+ self.btn_del.add_event_cb(self.btn_del_event_handler, lv.EVENT.CLICKED, None)
+ self.btn_del.add_flag(lv.obj.FLAG.IGNORE_LAYOUT)
+ self.btn_del.align(lv.ALIGN.TOP_MID, 50, 20)
+
+ self.label_del = lv.label(self.btn_del)
+ self.label_del.set_text("Stop")
+ self.label_del.center()
+
+ self.slider = lv.slider(self.par)
+ self.slider.add_event_cb(self.slider_prg_event_handler, lv.EVENT.VALUE_CHANGED, None)
+ self.slider.add_flag(lv.obj.FLAG.IGNORE_LAYOUT)
+ self.slider.align(lv.ALIGN.BOTTOM_RIGHT, -20, -20)
+ self.slider.set_range(0, 65535)
+
+ self.obj1 = lv.obj(self.par)
+ self.obj1.set_size(self.obj_width, self.obj_height)
+
+ self.obj2 = lv.obj(self.par)
+ self.obj2.set_size(self.obj_width, self.obj_height)
+
+ self.obj3 = lv.obj(self.par)
+ self.obj3.set_size(self.obj_width, self.obj_height)
+
+ self.anim_timeline = None
+
+ def set_width(self,obj, v):
+ obj.set_width(v)
+
+ def set_height(self,obj, v):
+ obj.set_height(v)
+
+ def anim_timeline_create(self):
+ # obj1
+ self.a1 = lv.anim_t()
+ self.a1.init()
+ self.a1.set_values(0, self.obj_width)
+ self.a1.set_early_apply(False)
+ self.a1.set_custom_exec_cb(lambda a,v: self.set_width(self.obj1,v))
+ self.a1.set_path_cb(lv.anim_t.path_overshoot)
+ self.a1.set_time(300)
+
+ self.a2 = lv.anim_t()
+ self.a2.init()
+ self.a2.set_values(0, self.obj_height)
+ self.a2.set_early_apply(False)
+ self.a2.set_custom_exec_cb(lambda a,v: self.set_height(self.obj1,v))
+ self.a2.set_path_cb(lv.anim_t.path_ease_out)
+ self.a2.set_time(300)
+
+ # obj2
+ self.a3=lv.anim_t()
+ self.a3.init()
+ self.a3.set_values(0, self.obj_width)
+ self.a3.set_early_apply(False)
+ self.a3.set_custom_exec_cb(lambda a,v: self.set_width(self.obj2,v))
+ self.a3.set_path_cb(lv.anim_t.path_overshoot)
+ self.a3.set_time(300)
+
+ self.a4 = lv.anim_t()
+ self.a4.init()
+ self.a4.set_values(0, self.obj_height)
+ self.a4.set_early_apply(False)
+ self.a4.set_custom_exec_cb(lambda a,v: self.set_height(self.obj2,v))
+ self.a4.set_path_cb(lv.anim_t.path_ease_out)
+ self.a4.set_time(300)
+
+ # obj3
+ self.a5 = lv.anim_t()
+ self.a5.init()
+ self.a5.set_values(0, self.obj_width)
+ self.a5.set_early_apply(False)
+ self.a5.set_custom_exec_cb(lambda a,v: self.set_width(self.obj3,v))
+ self.a5.set_path_cb(lv.anim_t.path_overshoot)
+ self.a5.set_time(300)
+
+ self.a6 = lv.anim_t()
+ self.a6.init()
+ self.a6.set_values(0, self.obj_height)
+ self.a6.set_early_apply(False)
+ self.a6.set_custom_exec_cb(lambda a,v: self.set_height(self.obj3,v))
+ self.a6.set_path_cb(lv.anim_t.path_ease_out)
+ self.a6.set_time(300)
+
+ # Create anim timeline
+ print("Create new anim_timeline")
+ self.anim_timeline = lv.anim_timeline_create()
+ lv.anim_timeline_add(self.anim_timeline, 0, self.a1)
+ lv.anim_timeline_add(self.anim_timeline, 0, self.a2)
+ lv.anim_timeline_add(self.anim_timeline, 200, self.a3)
+ lv.anim_timeline_add(self.anim_timeline, 200, self.a4)
+ lv.anim_timeline_add(self.anim_timeline, 400, self.a5)
+ lv.anim_timeline_add(self.anim_timeline, 400, self.a6)
+
+ def slider_prg_event_handler(self,e):
+ slider = e.get_target()
+
+ if not self.anim_timeline:
+ self.anim_timeline_create()
+
+ progress = slider.get_value()
+ lv.anim_timeline_set_progress(self.anim_timeline, progress)
+
+
+ def btn_run_event_handler(self,e):
+ btn = e.get_target()
+ if not self.anim_timeline:
+ self.anim_timeline_create()
+
+ reverse = btn.has_state(lv.STATE.CHECKED)
+ lv.anim_timeline_set_reverse(self.anim_timeline,reverse)
+ lv.anim_timeline_start(self.anim_timeline)
+
+ def btn_del_event_handler(self,e):
+ if self.anim_timeline:
+ lv.anim_timeline_del(self.anim_timeline)
+ self.anim_timeline = None
+
+
+lv_example_anim_timeline_1 = LV_ExampleAnimTimeline_1()