convert lvgl from submodule to a plain old directory

32 files changed, 1056 insertions, 0 deletions

diff --git a/lib/lvgl b/lib/lvgl
deleted file mode 160000
-Subproject 0732400e7b564dd0e7dc4a924619d8e19c5b23a
diff --git a/lib/lvgl/examples/styles/index.rst b/lib/lvgl/examples/styles/index.rst
new file mode 100644
index 00000000..a76ff1e7
--- /dev/null
+++ b/lib/lvgl/examples/styles/index.rst
@@ -0,0 +1,98 @@
+
+Size styles
+"""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_1
+  :language: c
+
+Background styles
+"""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_2
+  :language: c
+
+Border styles
+""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_3
+  :language: c
+
+Outline styles
+""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_4
+  :language: c
+
+Shadow styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_5
+  :language: c
+
+Image styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_6
+  :language: c
+
+Arc styles
+""""""""""""""""""""""""
+
+.. lv_example:: style/lv_example_style_7
+  :language: c
+
+Text styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_8
+  :language: c
+
+Line styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_9
+  :language: c
+
+
+Transition
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_10
+  :language: c
+
+
+Using multiple styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_11
+  :language: c
+
+
+Local styles
+""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_12
+  :language: c
+
+
+Add styles to parts and states
+"""""""""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_13
+  :language: c
+
+
+Extending the current theme
+""""""""""""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_14
+  :language: c
+
+
+Opacity and Transformations
+""""""""""""""""""""""""""""""""""
+
+.. lv_example:: styles/lv_example_style_15
+  :language: c
+
+
diff --git a/lib/lvgl/examples/styles/lv_example_style.h b/lib/lvgl/examples/styles/lv_example_style.h
new file mode 100644
index 00000000..680443cc
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style.h
@@ -0,0 +1,52 @@
+/**
+ * @file lv_example_style.h
+ *
+ */
+
+#ifndef LV_EXAMPLE_STYLE_H
+#define LV_EXAMPLE_STYLE_H
+
+#ifdef __cplusplus
+extern "C" {
+#endif
+
+/*********************
+ *      INCLUDES
+ *********************/
+
+/*********************
+ *      DEFINES
+ *********************/
+
+/**********************
+ *      TYPEDEFS
+ **********************/
+
+/**********************
+ * GLOBAL PROTOTYPES
+ **********************/
+void lv_example_style_1(void);
+void lv_example_style_2(void);
+void lv_example_style_3(void);
+void lv_example_style_4(void);
+void lv_example_style_5(void);
+void lv_example_style_6(void);
+void lv_example_style_7(void);
+void lv_example_style_8(void);
+void lv_example_style_9(void);
+void lv_example_style_10(void);
+void lv_example_style_11(void);
+void lv_example_style_12(void);
+void lv_example_style_13(void);
+void lv_example_style_14(void);
+void lv_example_style_15(void);
+
+/**********************
+ *      MACROS
+ **********************/
+
+#ifdef __cplusplus
+} /*extern "C"*/
+#endif
+
+#endif /*LV_EXAMPLE_STYLE_H*/
diff --git a/lib/lvgl/examples/styles/lv_example_style_1.c b/lib/lvgl/examples/styles/lv_example_style_1.c
new file mode 100644
index 00000000..948c5d29
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_1.c
@@ -0,0 +1,31 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Using the Size, Position and Padding style properties
+ */
+void lv_example_style_1(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+    lv_style_set_radius(&style, 5);
+
+    /*Make a gradient*/
+    lv_style_set_width(&style, 150);
+    lv_style_set_height(&style, LV_SIZE_CONTENT);
+
+    lv_style_set_pad_ver(&style, 20);
+    lv_style_set_pad_left(&style, 5);
+
+    lv_style_set_x(&style, lv_pct(50));
+    lv_style_set_y(&style, 80);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+
+    lv_obj_t * label = lv_label_create(obj);
+    lv_label_set_text(label, "Hello");
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_1.py b/lib/lvgl/examples/styles/lv_example_style_1.py
new file mode 100644
index 00000000..803ce9a2
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_1.py
@@ -0,0 +1,24 @@
+#
+# Using the Size, Position and Padding style properties
+#
+style = lv.style_t()
+style.init()
+style.set_radius(5)
+
+# Make a gradient
+style.set_width(150)
+style.set_height(lv.SIZE.CONTENT)
+
+style.set_pad_ver(20)
+style.set_pad_left(5)
+
+style.set_x(lv.pct(50))
+style.set_y(80)
+
+# Create an object with the new style
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+
+label = lv.label(obj)
+label.set_text("Hello")
+
diff --git a/lib/lvgl/examples/styles/lv_example_style_10.c b/lib/lvgl/examples/styles/lv_example_style_10.c
new file mode 100644
index 00000000..f005af6f
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_10.c
@@ -0,0 +1,40 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Creating a transition
+ */
+void lv_example_style_10(void)
+{
+    static const lv_style_prop_t props[] = {LV_STYLE_BG_COLOR, LV_STYLE_BORDER_COLOR, LV_STYLE_BORDER_WIDTH, 0};
+
+    /* A default transition
+     * Make it fast (100ms) and start with some delay (200 ms)*/
+    static lv_style_transition_dsc_t trans_def;
+    lv_style_transition_dsc_init(&trans_def, props, lv_anim_path_linear, 100, 200, NULL);
+
+    /* A special transition when going to pressed state
+     * Make it slow (500 ms) but start  without delay*/
+    static lv_style_transition_dsc_t trans_pr;
+    lv_style_transition_dsc_init(&trans_pr, props, lv_anim_path_linear, 500, 0, NULL);
+
+    static lv_style_t style_def;
+    lv_style_init(&style_def);
+    lv_style_set_transition(&style_def, &trans_def);
+
+    static lv_style_t style_pr;
+    lv_style_init(&style_pr);
+    lv_style_set_bg_color(&style_pr, lv_palette_main(LV_PALETTE_RED));
+    lv_style_set_border_width(&style_pr, 6);
+    lv_style_set_border_color(&style_pr, lv_palette_darken(LV_PALETTE_RED, 3));
+    lv_style_set_transition(&style_pr, &trans_pr);
+
+    /*Create an object with the new style_pr*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style_def, 0);
+    lv_obj_add_style(obj, &style_pr, LV_STATE_PRESSED);
+
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_10.py b/lib/lvgl/examples/styles/lv_example_style_10.py
new file mode 100644
index 00000000..b71afe87
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_10.py
@@ -0,0 +1,35 @@
+#
+# Creating a transition
+#
+
+props = [lv.STYLE.BG_COLOR, lv.STYLE.BORDER_COLOR, lv.STYLE.BORDER_WIDTH, 0]
+
+# A default transition
+# Make it fast (100ms) and start with some delay (200 ms)
+
+trans_def = lv.style_transition_dsc_t()
+trans_def.init(props, lv.anim_t.path_linear, 100, 200, None)
+
+# A special transition when going to pressed state
+# Make it slow (500 ms) but start  without delay
+
+trans_pr = lv.style_transition_dsc_t()
+trans_pr.init(props, lv.anim_t.path_linear, 500, 0, None)
+
+style_def = lv.style_t()
+style_def.init()
+style_def.set_transition(trans_def)
+
+style_pr = lv.style_t()
+style_pr.init()
+style_pr.set_bg_color(lv.palette_main(lv.PALETTE.RED))
+style_pr.set_border_width(6)
+style_pr.set_border_color(lv.palette_darken(lv.PALETTE.RED, 3))
+style_pr.set_transition(trans_pr)
+
+# Create an object with the new style_pr
+obj = lv.obj(lv.scr_act())
+obj.add_style(style_def, 0)
+obj.add_style(style_pr, lv.STATE.PRESSED)
+
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_11.c b/lib/lvgl/examples/styles/lv_example_style_11.c
new file mode 100644
index 00000000..2693df85
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_11.c
@@ -0,0 +1,50 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Using multiple styles
+ */
+void lv_example_style_11(void)
+{
+    /*A base style*/
+    static lv_style_t style_base;
+    lv_style_init(&style_base);
+    lv_style_set_bg_color(&style_base, lv_palette_main(LV_PALETTE_LIGHT_BLUE));
+    lv_style_set_border_color(&style_base, lv_palette_darken(LV_PALETTE_LIGHT_BLUE, 3));
+    lv_style_set_border_width(&style_base, 2);
+    lv_style_set_radius(&style_base, 10);
+    lv_style_set_shadow_width(&style_base, 10);
+    lv_style_set_shadow_ofs_y(&style_base, 5);
+    lv_style_set_shadow_opa(&style_base, LV_OPA_50);
+    lv_style_set_text_color(&style_base, lv_color_white());
+    lv_style_set_width(&style_base, 100);
+    lv_style_set_height(&style_base, LV_SIZE_CONTENT);
+
+    /*Set only the properties that should be different*/
+    static lv_style_t style_warning;
+    lv_style_init(&style_warning);
+    lv_style_set_bg_color(&style_warning, lv_palette_main(LV_PALETTE_YELLOW));
+    lv_style_set_border_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 3));
+    lv_style_set_text_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 4));
+
+    /*Create an object with the base style only*/
+    lv_obj_t * obj_base = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj_base, &style_base, 0);
+    lv_obj_align(obj_base, LV_ALIGN_LEFT_MID, 20, 0);
+
+    lv_obj_t * label = lv_label_create(obj_base);
+    lv_label_set_text(label, "Base");
+    lv_obj_center(label);
+
+    /*Create another object with the base style and earnings style too*/
+    lv_obj_t * obj_warning = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj_warning, &style_base, 0);
+    lv_obj_add_style(obj_warning, &style_warning, 0);
+    lv_obj_align(obj_warning, LV_ALIGN_RIGHT_MID, -20, 0);
+
+    label = lv_label_create(obj_warning);
+    lv_label_set_text(label, "Warning");
+    lv_obj_center(label);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_11.py b/lib/lvgl/examples/styles/lv_example_style_11.py
new file mode 100644
index 00000000..68f3f11f
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_11.py
@@ -0,0 +1,43 @@
+#
+# Using multiple styles
+#
+# A base style
+
+style_base = lv.style_t()
+style_base.init()
+style_base.set_bg_color(lv.palette_main(lv.PALETTE.LIGHT_BLUE))
+style_base.set_border_color(lv.palette_darken(lv.PALETTE.LIGHT_BLUE, 3))
+style_base.set_border_width(2)
+style_base.set_radius(10)
+style_base.set_shadow_width(10)
+style_base.set_shadow_ofs_y(5)
+style_base.set_shadow_opa(lv.OPA._50)
+style_base.set_text_color(lv.color_white())
+style_base.set_width(100)
+style_base.set_height(lv.SIZE.CONTENT)
+
+# Set only the properties that should be different
+style_warning = lv.style_t()
+style_warning.init()
+style_warning.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW))
+style_warning.set_border_color(lv.palette_darken(lv.PALETTE.YELLOW, 3))
+style_warning.set_text_color(lv.palette_darken(lv.PALETTE.YELLOW, 4))
+
+# Create an object with the base style only
+obj_base = lv.obj(lv.scr_act())
+obj_base.add_style(style_base, 0)
+obj_base.align(lv.ALIGN.LEFT_MID, 20, 0)
+
+label = lv.label(obj_base)
+label.set_text("Base")
+label.center()
+
+# Create another object with the base style and earnings style too
+obj_warning = lv.obj(lv.scr_act())
+obj_warning.add_style(style_base, 0)
+obj_warning.add_style(style_warning, 0)
+obj_warning.align(lv.ALIGN.RIGHT_MID, -20, 0)
+
+label = lv.label(obj_warning)
+label.set_text("Warning")
+label.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_12.c b/lib/lvgl/examples/styles/lv_example_style_12.c
new file mode 100644
index 00000000..5eb25e86
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_12.c
@@ -0,0 +1,24 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Local styles
+ */
+void lv_example_style_12(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+    lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_GREEN));
+    lv_style_set_border_color(&style, lv_palette_lighten(LV_PALETTE_GREEN, 3));
+    lv_style_set_border_width(&style, 3);
+
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+
+    /*Overwrite the background color locally*/
+    lv_obj_set_style_bg_color(obj, lv_palette_main(LV_PALETTE_ORANGE), LV_PART_MAIN);
+
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_12.py b/lib/lvgl/examples/styles/lv_example_style_12.py
new file mode 100644
index 00000000..2557c441
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_12.py
@@ -0,0 +1,17 @@
+#
+# Local styles
+#
+
+style = lv.style_t()
+style.init()
+style.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
+style.set_border_color(lv.palette_lighten(lv.PALETTE.GREEN, 3))
+style.set_border_width(3)
+
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+
+# Overwrite the background color locally
+obj.set_style_bg_color(lv.palette_main(lv.PALETTE.ORANGE), lv.PART.MAIN)
+
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_13.c b/lib/lvgl/examples/styles/lv_example_style_13.c
new file mode 100644
index 00000000..ca5ca857
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_13.c
@@ -0,0 +1,29 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Add styles to parts and states
+ */
+void lv_example_style_13(void)
+{
+    static lv_style_t style_indic;
+    lv_style_init(&style_indic);
+    lv_style_set_bg_color(&style_indic, lv_palette_lighten(LV_PALETTE_RED, 3));
+    lv_style_set_bg_grad_color(&style_indic, lv_palette_main(LV_PALETTE_RED));
+    lv_style_set_bg_grad_dir(&style_indic, LV_GRAD_DIR_HOR);
+
+    static lv_style_t style_indic_pr;
+    lv_style_init(&style_indic_pr);
+    lv_style_set_shadow_color(&style_indic_pr, lv_palette_main(LV_PALETTE_RED));
+    lv_style_set_shadow_width(&style_indic_pr, 10);
+    lv_style_set_shadow_spread(&style_indic_pr, 3);
+
+    /*Create an object with the new style_pr*/
+    lv_obj_t * obj = lv_slider_create(lv_scr_act());
+    lv_obj_add_style(obj, &style_indic, LV_PART_INDICATOR);
+    lv_obj_add_style(obj, &style_indic_pr, LV_PART_INDICATOR | LV_STATE_PRESSED);
+    lv_slider_set_value(obj, 70, LV_ANIM_OFF);
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_13.py b/lib/lvgl/examples/styles/lv_example_style_13.py
new file mode 100644
index 00000000..7d505cac
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_13.py
@@ -0,0 +1,22 @@
+#
+# Add styles to parts and states
+#
+
+style_indic = lv.style_t()
+style_indic.init()
+style_indic.set_bg_color(lv.palette_lighten(lv.PALETTE.RED, 3))
+style_indic.set_bg_grad_color(lv.palette_main(lv.PALETTE.RED))
+style_indic.set_bg_grad_dir(lv.GRAD_DIR.HOR)
+
+style_indic_pr = lv.style_t()
+style_indic_pr.init()
+style_indic_pr.set_shadow_color(lv.palette_main(lv.PALETTE.RED))
+style_indic_pr.set_shadow_width(10)
+style_indic_pr.set_shadow_spread(3)
+
+# Create an object with the new style_pr
+obj = lv.slider(lv.scr_act())
+obj.add_style(style_indic, lv.PART.INDICATOR)
+obj.add_style(style_indic_pr, lv.PART.INDICATOR | lv.STATE.PRESSED)
+obj.set_value(70, lv.ANIM.OFF)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_14.c b/lib/lvgl/examples/styles/lv_example_style_14.c
new file mode 100644
index 00000000..cdb20863
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_14.c
@@ -0,0 +1,64 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+
+static lv_style_t style_btn;
+
+/*Will be called when the styles of the base theme are already added
+  to add new styles*/
+static void new_theme_apply_cb(lv_theme_t * th, lv_obj_t * obj)
+{
+    LV_UNUSED(th);
+
+    if(lv_obj_check_type(obj, &lv_btn_class)) {
+        lv_obj_add_style(obj, &style_btn, 0);
+    }
+}
+
+static void new_theme_init_and_set(void)
+{
+    /*Initialize the styles*/
+    lv_style_init(&style_btn);
+    lv_style_set_bg_color(&style_btn, lv_palette_main(LV_PALETTE_GREEN));
+    lv_style_set_border_color(&style_btn, lv_palette_darken(LV_PALETTE_GREEN, 3));
+    lv_style_set_border_width(&style_btn, 3);
+
+    /*Initialize the new theme from the current theme*/
+    lv_theme_t * th_act = lv_disp_get_theme(NULL);
+    static lv_theme_t th_new;
+    th_new = *th_act;
+
+    /*Set the parent theme and the style apply callback for the new theme*/
+    lv_theme_set_parent(&th_new, th_act);
+    lv_theme_set_apply_cb(&th_new, new_theme_apply_cb);
+
+    /*Assign the new theme to the current display*/
+    lv_disp_set_theme(NULL, &th_new);
+}
+
+
+
+/**
+ * Extending the current theme
+ */
+void lv_example_style_14(void)
+{
+    lv_obj_t * btn;
+    lv_obj_t * label;
+
+    btn = lv_btn_create(lv_scr_act());
+    lv_obj_align(btn, LV_ALIGN_TOP_MID, 0, 20);
+
+    label = lv_label_create(btn);
+    lv_label_set_text(label, "Original theme");
+
+    new_theme_init_and_set();
+
+    btn = lv_btn_create(lv_scr_act());
+    lv_obj_align(btn, LV_ALIGN_BOTTOM_MID, 0, -20);
+
+    label = lv_label_create(btn);
+    lv_label_set_text(label, "New theme");
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_14.py b/lib/lvgl/examples/styles/lv_example_style_14.py
new file mode 100644
index 00000000..fbb5702d
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_14.py
@@ -0,0 +1,55 @@
+# Will be called when the styles of the base theme are already added
+# to add new styles
+
+
+class NewTheme(lv.theme_t):
+    def __init__(self):
+        super().__init__()
+        # Initialize the styles
+        self.style_btn = lv.style_t()
+        self.style_btn.init()
+        self.style_btn.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
+        self.style_btn.set_border_color(lv.palette_darken(lv.PALETTE.GREEN, 3))
+        self.style_btn.set_border_width(3)
+
+        # This theme is based on active theme
+        th_act = lv.theme_get_from_obj(lv.scr_act())
+        # This theme will be applied only after base theme is applied
+        self.set_parent(th_act)
+
+
+class ExampleStyle_14:
+
+    def __init__(self):
+        #
+        # Extending the current theme
+        #
+
+        btn = lv.btn(lv.scr_act())
+        btn.align(lv.ALIGN.TOP_MID, 0, 20)
+
+        label = lv.label(btn)
+        label.set_text("Original theme")
+
+        self.new_theme_init_and_set()
+
+        btn = lv.btn(lv.scr_act())
+        btn.align(lv.ALIGN.BOTTOM_MID, 0, -20)
+
+        label = lv.label(btn)
+        label.set_text("New theme")
+
+    def new_theme_apply_cb(self, th, obj):
+        print(th,obj)
+        if obj.get_class() == lv.btn_class:
+            obj.add_style(self.th_new.style_btn, 0)
+
+    def new_theme_init_and_set(self):
+        print("new_theme_init_and_set")
+        # Initialize the new theme from the current theme
+        self.th_new = NewTheme()
+        self.th_new.set_apply_cb(self.new_theme_apply_cb)
+        lv.disp_get_default().set_theme(self.th_new)
+
+
+exampleStyle_14 = ExampleStyle_14()
diff --git a/lib/lvgl/examples/styles/lv_example_style_15.c b/lib/lvgl/examples/styles/lv_example_style_15.c
new file mode 100644
index 00000000..cab321f7
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_15.c
@@ -0,0 +1,50 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_BTN && LV_USE_LABEL
+
+
+
+/**
+ * Opacity and Transformations
+ */
+void lv_example_style_15(void)
+{
+    lv_obj_t * btn;
+    lv_obj_t * label;
+
+    /*Normal button*/
+    btn = lv_btn_create(lv_scr_act());
+    lv_obj_set_size(btn, 100, 40);
+    lv_obj_align(btn, LV_ALIGN_CENTER, 0, -70);
+
+    label = lv_label_create(btn);
+    lv_label_set_text(label, "Normal");
+    lv_obj_center(label);
+
+    /*Set opacity
+     *The button and the label is rendered to a layer first and that layer is blended*/
+    btn = lv_btn_create(lv_scr_act());
+    lv_obj_set_size(btn, 100, 40);
+    lv_obj_set_style_opa(btn, LV_OPA_50, 0);
+    lv_obj_align(btn, LV_ALIGN_CENTER, 0, 0);
+
+    label = lv_label_create(btn);
+    lv_label_set_text(label, "Opa:50%");
+    lv_obj_center(label);
+
+    /*Set transformations
+     *The button and the label is rendered to a layer first and that layer is transformed*/
+    btn = lv_btn_create(lv_scr_act());
+    lv_obj_set_size(btn, 100, 40);
+    lv_obj_set_style_transform_angle(btn, 150, 0);        /*15 deg*/
+    lv_obj_set_style_transform_zoom(btn, 256 + 64, 0);   /*1.25x*/
+    lv_obj_set_style_transform_pivot_x(btn, 50, 0);
+    lv_obj_set_style_transform_pivot_y(btn, 20, 0);
+    lv_obj_set_style_opa(btn, LV_OPA_50, 0);
+    lv_obj_align(btn, LV_ALIGN_CENTER, 0, 70);
+
+    label = lv_label_create(btn);
+    lv_label_set_text(label, "Transf.");
+    lv_obj_center(label);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_2.c b/lib/lvgl/examples/styles/lv_example_style_2.c
new file mode 100644
index 00000000..125fcb50
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_2.c
@@ -0,0 +1,33 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES
+
+/**
+ * Using the background style properties
+ */
+void lv_example_style_2(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+    lv_style_set_radius(&style, 5);
+
+    /*Make a gradient*/
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    static lv_grad_dsc_t grad;
+    grad.dir = LV_GRAD_DIR_VER;
+    grad.stops_count = 2;
+    grad.stops[0].color = lv_palette_lighten(LV_PALETTE_GREY, 1);
+    grad.stops[1].color = lv_palette_main(LV_PALETTE_BLUE);
+
+    /*Shift the gradient to the bottom*/
+    grad.stops[0].frac  = 128;
+    grad.stops[1].frac  = 192;
+
+    lv_style_set_bg_grad(&style, &grad);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_2.py b/lib/lvgl/examples/styles/lv_example_style_2.py
new file mode 100644
index 00000000..a7d21578
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_2.py
@@ -0,0 +1,21 @@
+#
+# Using the background style properties
+#
+style = lv.style_t()
+style.init()
+style.set_radius(5)
+
+# Make a gradient
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
+style.set_bg_grad_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_bg_grad_dir(lv.GRAD_DIR.VER)
+
+# Shift the gradient to the bottom
+style.set_bg_main_stop(128)
+style.set_bg_grad_stop(192)
+
+# Create an object with the new style
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_3.c b/lib/lvgl/examples/styles/lv_example_style_3.c
new file mode 100644
index 00000000..a05bc3c3
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_3.c
@@ -0,0 +1,29 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES
+
+/**
+ * Using the border style properties
+ */
+void lv_example_style_3(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    /*Set a background color and a radius*/
+    lv_style_set_radius(&style, 10);
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
+
+    /*Add border to the bottom+right*/
+    lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+    lv_style_set_border_width(&style, 5);
+    lv_style_set_border_opa(&style, LV_OPA_50);
+    lv_style_set_border_side(&style, LV_BORDER_SIDE_BOTTOM | LV_BORDER_SIDE_RIGHT);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_3.py b/lib/lvgl/examples/styles/lv_example_style_3.py
new file mode 100644
index 00000000..c9100f4f
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_3.py
@@ -0,0 +1,21 @@
+#
+# Using the border style properties
+#
+style = lv.style_t()
+style.init()
+
+# Set a background color and a radius
+style.set_radius(10)
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
+
+# Add border to the bottom+right
+style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_border_width(5)
+style.set_border_opa(lv.OPA._50)
+style.set_border_side(lv.BORDER_SIDE.BOTTOM | lv.BORDER_SIDE.RIGHT)
+
+# Create an object with the new style
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_4.c b/lib/lvgl/examples/styles/lv_example_style_4.c
new file mode 100644
index 00000000..5f5b8d36
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_4.c
@@ -0,0 +1,29 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES
+
+/**
+ * Using the outline style properties
+ */
+void lv_example_style_4(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    /*Set a background color and a radius*/
+    lv_style_set_radius(&style, 5);
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
+
+    /*Add outline*/
+    lv_style_set_outline_width(&style, 2);
+    lv_style_set_outline_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+    lv_style_set_outline_pad(&style, 8);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_obj_center(obj);
+}
+
+#endif
+
diff --git a/lib/lvgl/examples/styles/lv_example_style_4.py b/lib/lvgl/examples/styles/lv_example_style_4.py
new file mode 100644
index 00000000..246c6a6c
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_4.py
@@ -0,0 +1,21 @@
+#
+# Using the outline style properties
+#
+
+style = lv.style_t()
+style.init()
+
+# Set a background color and a radius
+style.set_radius(5)
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
+
+# Add outline
+style.set_outline_width(2)
+style.set_outline_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_outline_pad(8)
+
+# Create an object with the new style
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_5.c b/lib/lvgl/examples/styles/lv_example_style_5.c
new file mode 100644
index 00000000..8bc8afbe
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_5.c
@@ -0,0 +1,29 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES
+
+/**
+ * Using the Shadow style properties
+ */
+void lv_example_style_5(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    /*Set a background color and a radius*/
+    lv_style_set_radius(&style, 5);
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
+
+    /*Add a shadow*/
+    lv_style_set_shadow_width(&style, 55);
+    lv_style_set_shadow_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+    //    lv_style_set_shadow_ofs_x(&style, 10);
+    //    lv_style_set_shadow_ofs_y(&style, 20);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_obj_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_5.py b/lib/lvgl/examples/styles/lv_example_style_5.py
new file mode 100644
index 00000000..905f29f5
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_5.py
@@ -0,0 +1,22 @@
+#
+# Using the Shadow style properties
+#
+
+style = lv.style_t()
+style.init()
+
+# Set a background color and a radius
+style.set_radius(5)
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
+
+# Add a shadow
+style.set_shadow_width(8)
+style.set_shadow_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_shadow_ofs_x(10)
+style.set_shadow_ofs_y(20)
+
+# Create an object with the new style
+obj = lv.obj(lv.scr_act())
+obj.add_style(style, 0)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_6.c b/lib/lvgl/examples/styles/lv_example_style_6.c
new file mode 100644
index 00000000..3c6fdb94
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_6.c
@@ -0,0 +1,33 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_IMG
+
+/**
+ * Using the Image style properties
+ */
+void lv_example_style_6(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    /*Set a background color and a radius*/
+    lv_style_set_radius(&style, 5);
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
+    lv_style_set_border_width(&style, 2);
+    lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+
+    lv_style_set_img_recolor(&style, lv_palette_main(LV_PALETTE_BLUE));
+    lv_style_set_img_recolor_opa(&style, LV_OPA_50);
+    lv_style_set_transform_angle(&style, 300);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_img_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+
+    LV_IMG_DECLARE(img_cogwheel_argb);
+    lv_img_set_src(obj, &img_cogwheel_argb);
+
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_6.py b/lib/lvgl/examples/styles/lv_example_style_6.py
new file mode 100644
index 00000000..9efe14e4
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_6.py
@@ -0,0 +1,43 @@
+from imagetools import get_png_info, open_png
+# Register PNG image decoder
+decoder = lv.img.decoder_create()
+decoder.info_cb = get_png_info
+decoder.open_cb = open_png
+
+# Create an image from the png file
+try:
+    with open('../assets/img_cogwheel_argb.png', 'rb') as f:
+        png_data = f.read()
+except:
+    print("Could not find img_cogwheel_argb.png")
+    sys.exit()
+
+img_cogwheel_argb = lv.img_dsc_t({
+  'data_size': len(png_data),
+  'data': png_data
+})
+
+#
+# Using the Image style properties
+#
+style = lv.style_t()
+style.init()
+
+# Set a background color and a radius
+style.set_radius(5)
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
+style.set_border_width(2)
+style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
+
+style.set_img_recolor(lv.palette_main(lv.PALETTE.BLUE))
+style.set_img_recolor_opa(lv.OPA._50)
+# style.set_transform_angle(300)
+
+# Create an object with the new style
+obj = lv.img(lv.scr_act())
+obj.add_style(style, 0)
+
+obj.set_src(img_cogwheel_argb)
+
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_7.c b/lib/lvgl/examples/styles/lv_example_style_7.c
new file mode 100644
index 00000000..dfd77ea6
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_7.c
@@ -0,0 +1,21 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_ARC
+
+/**
+ * Using the Arc style properties
+ */
+void lv_example_style_7(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    lv_style_set_arc_color(&style, lv_palette_main(LV_PALETTE_RED));
+    lv_style_set_arc_width(&style, 4);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_arc_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_obj_center(obj);
+}
+#endif
+
diff --git a/lib/lvgl/examples/styles/lv_example_style_7.py b/lib/lvgl/examples/styles/lv_example_style_7.py
new file mode 100644
index 00000000..cc49fb56
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_7.py
@@ -0,0 +1,13 @@
+#
+# Using the Arc style properties
+#
+style = lv.style_t()
+style.init()
+
+style.set_arc_color(lv.palette_main(lv.PALETTE.RED))
+style.set_arc_width(4)
+
+# Create an object with the new style
+obj = lv.arc(lv.scr_act())
+obj.add_style(style, 0)
+obj.center()
diff --git a/lib/lvgl/examples/styles/lv_example_style_8.c b/lib/lvgl/examples/styles/lv_example_style_8.c
new file mode 100644
index 00000000..d816b02d
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_8.c
@@ -0,0 +1,33 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_LABEL
+
+/**
+ * Using the text style properties
+ */
+void lv_example_style_8(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    lv_style_set_radius(&style, 5);
+    lv_style_set_bg_opa(&style, LV_OPA_COVER);
+    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 2));
+    lv_style_set_border_width(&style, 2);
+    lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+    lv_style_set_pad_all(&style, 10);
+
+    lv_style_set_text_color(&style, lv_palette_main(LV_PALETTE_BLUE));
+    lv_style_set_text_letter_space(&style, 5);
+    lv_style_set_text_line_space(&style, 20);
+    lv_style_set_text_decor(&style, LV_TEXT_DECOR_UNDERLINE);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_label_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+    lv_label_set_text(obj, "Text of\n"
+                      "a label");
+
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_8.py b/lib/lvgl/examples/styles/lv_example_style_8.py
new file mode 100644
index 00000000..27128989
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_8.py
@@ -0,0 +1,27 @@
+#
+# Using the text style properties
+#
+
+style = lv.style_t()
+style.init()
+
+style.set_radius(5)
+style.set_bg_opa(lv.OPA.COVER)
+style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
+style.set_border_width(2)
+style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_pad_all(10)
+
+style.set_text_color(lv.palette_main(lv.PALETTE.BLUE))
+style.set_text_letter_space(5)
+style.set_text_line_space(20)
+style.set_text_decor(lv.TEXT_DECOR.UNDERLINE)
+
+# Create an object with the new style
+obj = lv.label(lv.scr_act())
+obj.add_style(style, 0)
+obj.set_text("Text of\n"
+             "a label")
+
+obj.center()
+
diff --git a/lib/lvgl/examples/styles/lv_example_style_9.c b/lib/lvgl/examples/styles/lv_example_style_9.c
new file mode 100644
index 00000000..00141b4b
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_9.c
@@ -0,0 +1,26 @@
+#include "../lv_examples.h"
+#if LV_BUILD_EXAMPLES && LV_USE_LINE
+
+/**
+ * Using the line style properties
+ */
+void lv_example_style_9(void)
+{
+    static lv_style_t style;
+    lv_style_init(&style);
+
+    lv_style_set_line_color(&style, lv_palette_main(LV_PALETTE_GREY));
+    lv_style_set_line_width(&style, 6);
+    lv_style_set_line_rounded(&style, true);
+
+    /*Create an object with the new style*/
+    lv_obj_t * obj = lv_line_create(lv_scr_act());
+    lv_obj_add_style(obj, &style, 0);
+
+    static lv_point_t p[] = {{10, 30}, {30, 50}, {100, 0}};
+    lv_line_set_points(obj, p, 3);
+
+    lv_obj_center(obj);
+}
+
+#endif
diff --git a/lib/lvgl/examples/styles/lv_example_style_9.py b/lib/lvgl/examples/styles/lv_example_style_9.py
new file mode 100644
index 00000000..7f54d3f3
--- /dev/null
+++ b/lib/lvgl/examples/styles/lv_example_style_9.py
@@ -0,0 +1,21 @@
+#
+# Using the line style properties
+#
+
+style = lv.style_t()
+style.init()
+
+style.set_line_color(lv.palette_main(lv.PALETTE.GREY))
+style.set_line_width(6)
+style.set_line_rounded(True)
+
+# Create an object with the new style
+obj = lv.line(lv.scr_act())
+obj.add_style(style, 0)
+p =  [ {"x":10, "y":30},
+       {"x":30, "y":50},
+       {"x":100, "y":0}]
+
+obj.set_points(p, 3)
+
+obj.center()