Assets, Icons, UI toolkit. Part 1. (#202)

* Assets: import from gdrive
* Assets: fully working build pipeline and registry
* NFC: menu icon
* Gui: layers. Irukagotchi: base app to handle input on idle screen. Makefile: reboot after flash in dfu mode.
* ValueMutex: with lambda
* Assets: proper animation frames sorting
* ValueMutex: proper furi_open usage
* Assets,GUI: split icon into icon data and icon state.
* Format source code
* Docker: add python3 and imagemagic
* Irukagotchi: cleanup
* GUI: event lock moved to gui.
* Rfid: proper gui layer
* GUI: elements. Menu: frame and scroll
* GUI, Menu: format code.
* Menu: dual font main menu
* Menu: format sources
* GUI: 0 total scrollbar
* CI: enable lfs
* Menu: pixel perfect main menu

Co-authored-by: Aleksandr Kutuzov <aku@plooks.com>
Co-authored-by: aanper <mail@s3f.ru>

applications/gui/canvas.c

@@ -1,5 +1,7 @@
 #include "canvas.h"
 #include "canvas_i.h"
+#include "icon.h"
+#include "icon_i.h"
 
 #include <assert.h>
 #include <flipper.h>
@@ -20,6 +22,11 @@ void canvas_clear(CanvasApi* api);
 void canvas_color_set(CanvasApi* api, uint8_t color);
 void canvas_font_set(CanvasApi* api, Font font);
 void canvas_str_draw(CanvasApi* api, uint8_t x, uint8_t y, const char* str);
+void canvas_icon_draw(CanvasApi* api, uint8_t x, uint8_t y, Icon* icon);
+void canvas_dot_draw(CanvasApi* api, uint8_t x, uint8_t y);
+void canvas_box_draw(CanvasApi* api, uint8_t x, uint8_t y, uint8_t width, uint8_t height);
+void canvas_draw_frame(CanvasApi* api, uint8_t x, uint8_t y, uint8_t width, uint8_t height);
+void canvas_draw_line(CanvasApi* api, uint8_t x1, uint8_t y1, uint8_t x2, uint8_t y2);
 
 uint8_t u8g2_gpio_and_delay_stm32(u8x8_t* u8x8, uint8_t msg, uint8_t arg_int, void* arg_ptr);
 uint8_t u8x8_hw_spi_stm32(u8x8_t* u8x8, uint8_t msg, uint8_t arg_int, void* arg_ptr);
@@ -43,6 +50,11 @@ CanvasApi* canvas_api_init() {
     canvas->api.set_color = canvas_color_set;
     canvas->api.set_font = canvas_font_set;
     canvas->api.draw_str = canvas_str_draw;
+    canvas->api.draw_icon = canvas_icon_draw;
+    canvas->api.draw_dot = canvas_dot_draw;
+    canvas->api.draw_box = canvas_box_draw;
+    canvas->api.draw_frame = canvas_draw_frame;
+    canvas->api.draw_line = canvas_draw_line;
 
     return (CanvasApi*)canvas;
 }
@@ -112,8 +124,43 @@ void canvas_font_set(CanvasApi* api, Font font) {
 
 void canvas_str_draw(CanvasApi* api, uint8_t x, uint8_t y, const char* str) {
     assert(api);
+    if(!str) return;
     Canvas* canvas = (Canvas*)api;
     x += canvas->offset_x;
     y += canvas->offset_y;
     u8g2_DrawStr(&canvas->fb, x, y, str);
 }
+
+void canvas_icon_draw(CanvasApi* api, uint8_t x, uint8_t y, Icon* icon) {
+    assert(api);
+    if(!icon) return;
+    Canvas* canvas = (Canvas*)api;
+    x += canvas->offset_x;
+    y += canvas->offset_y;
+    u8g2_DrawXBM(
+        &canvas->fb, x, y, icon_get_width(icon), icon_get_height(icon), icon_get_data(icon));
+}
+
+void canvas_dot_draw(CanvasApi* api, uint8_t x, uint8_t y) {
+    assert(api);
+    Canvas* canvas = (Canvas*)api;
+    u8g2_DrawPixel(&canvas->fb, x, y);
+}
+
+void canvas_box_draw(CanvasApi* api, uint8_t x, uint8_t y, uint8_t width, uint8_t height) {
+    assert(api);
+    Canvas* canvas = (Canvas*)api;
+    u8g2_DrawBox(&canvas->fb, x, y, width, height);
+}
+
+void canvas_draw_frame(CanvasApi* api, uint8_t x, uint8_t y, uint8_t width, uint8_t height) {
+    assert(api);
+    Canvas* canvas = (Canvas*)api;
+    u8g2_DrawFrame(&canvas->fb, x, y, width, height);
+}
+
+void canvas_draw_line(CanvasApi* api, uint8_t x1, uint8_t y1, uint8_t x2, uint8_t y2) {
+    assert(api);
+    Canvas* canvas = (Canvas*)api;
+    u8g2_DrawLine(&canvas->fb, x1, y1, x2, y2);
+}

applications/gui/canvas.h

@@ -2,6 +2,7 @@
 
 #include <stdint.h>
 #include <u8g2.h>
+#include <gui/icon.h>
 
 typedef enum {
     ColorWhite = 0x00,
@@ -24,4 +25,9 @@ struct CanvasApi {
     void (*set_font)(CanvasApi* canvas, Font font);
 
     void (*draw_str)(CanvasApi* canvas, uint8_t x, uint8_t y, const char* str);
+    void (*draw_icon)(CanvasApi* canvas, uint8_t x, uint8_t y, Icon* icon);
+    void (*draw_dot)(CanvasApi* canvas, uint8_t x, uint8_t y);
+    void (*draw_box)(CanvasApi* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height);
+    void (*draw_frame)(CanvasApi* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height);
+    void (*draw_line)(CanvasApi* canvas, uint8_t x1, uint8_t y1, uint8_t x2, uint8_t y2);
 };

applications/gui/elements.c

@@ -0,0 +1,31 @@
+#include "elements.h"
+
+void elements_scrollbar(CanvasApi* canvas, uint8_t pos, uint8_t total) {
+    uint8_t width = canvas->width(canvas);
+    uint8_t height = canvas->height(canvas);
+    // prevent overflows
+    canvas->set_color(canvas, ColorWhite);
+    canvas->draw_box(canvas, width - 3, 0, 3, height);
+    // dot line
+    canvas->set_color(canvas, ColorBlack);
+    for(uint8_t i = 0; i < height; i += 2) {
+        canvas->draw_dot(canvas, width - 2, i);
+    }
+    // Position block
+    if(total) {
+        uint8_t block_h = ((float)height) / total;
+        canvas->draw_box(canvas, width - 3, block_h * pos, 3, block_h);
+    }
+}
+
+void elements_frame(CanvasApi* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height) {
+    canvas->draw_line(canvas, x + 2, y, x + width - 2, y);
+    canvas->draw_line(canvas, x + 1, y + height - 1, x + width, y + height - 1);
+    canvas->draw_line(canvas, x + 2, y + height, x + width - 1, y + height);
+
+    canvas->draw_line(canvas, x, y + 2, x, y + height - 2);
+    canvas->draw_line(canvas, x + width - 1, y + 1, x + width - 1, y + height - 2);
+    canvas->draw_line(canvas, x + width, y + 2, x + width, y + height - 2);
+
+    canvas->draw_dot(canvas, x + 1, y + 1);
+}

applications/gui/elements.h

@@ -0,0 +1,8 @@
+#pragma once
+
+#include <stdint.h>
+#include "canvas.h"
+
+void elements_scrollbar(CanvasApi* canvas, uint8_t pos, uint8_t total);
+
+void elements_frame(CanvasApi* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height);

applications/gui/gui.c

@@ -3,8 +3,8 @@
 
 #include <flipper.h>
 #include <flipper_v2.h>
-#include <stdio.h>
 #include <m-array.h>
+#include <stdio.h>
 
 #include "gui_event.h"
 #include "canvas.h"
@@ -18,54 +18,10 @@ struct Gui {
     GuiApi api;
     GuiEvent* event;
     CanvasApi* canvas_api;
-    WidgetArray_t widgets_status_bar;
-    WidgetArray_t widgets;
-    WidgetArray_t widgets_fs;
-    WidgetArray_t widgets_dialog;
+    WidgetArray_t layers[GuiLayerMAX];
+    osMutexId_t mutex;
 };
 
-void gui_add_widget(GuiApi* gui_api, Widget* widget, WidgetLayer layer) {
-    assert(gui_api);
-    assert(widget);
-    Gui* gui = (Gui*)gui_api;
-
-    // TODO add mutex on widget array
-    WidgetArray_t* widget_array = NULL;
-
-    switch(layer) {
-    case WidgetLayerStatusBar:
-        widget_array = &gui->widgets_status_bar;
-        break;
-    case WidgetLayerMain:
-        widget_array = &gui->widgets;
-        break;
-    case WidgetLayerFullscreen:
-        widget_array = &gui->widgets_fs;
-        break;
-    case WidgetLayerDialog:
-        widget_array = &gui->widgets_dialog;
-        break;
-    default:
-        break;
-    }
-
-    assert(widget_array);
-
-    gui_event_lock(gui->event);
-    WidgetArray_push_back(*widget_array, widget);
-    widget_gui_set(widget, gui);
-    gui_event_unlock(gui->event);
-
-    gui_update(gui);
-}
-
-void gui_update(Gui* gui) {
-    assert(gui);
-    GuiMessage message;
-    message.type = GuiMessageTypeRedraw;
-    gui_event_messsage_send(gui->event, &message);
-}
-
 Widget* gui_widget_find_enabled(WidgetArray_t array) {
     size_t widgets_count = WidgetArray_size(array);
     for(size_t i = 0; i < widgets_count; i++) {
@@ -77,9 +33,16 @@ Widget* gui_widget_find_enabled(WidgetArray_t array) {
     return NULL;
 }
 
+void gui_update(Gui* gui) {
+    assert(gui);
+    GuiMessage message;
+    message.type = GuiMessageTypeRedraw;
+    gui_event_messsage_send(gui->event, &message);
+}
+
 bool gui_redraw_fs(Gui* gui) {
     canvas_frame_set(gui->canvas_api, 0, 0, 128, 64);
-    Widget* widget = gui_widget_find_enabled(gui->widgets_fs);
+    Widget* widget = gui_widget_find_enabled(gui->layers[GuiLayerFullscreen]);
     if(widget) {
         widget_draw(widget, gui->canvas_api);
         return true;
@@ -88,64 +51,128 @@ bool gui_redraw_fs(Gui* gui) {
     }
 }
 
-void gui_redraw_status_bar(Gui* gui) {
+bool gui_redraw_status_bar(Gui* gui) {
     canvas_frame_set(gui->canvas_api, 0, 0, 128, 64);
-    Widget* widget = gui_widget_find_enabled(gui->widgets_status_bar);
-    if(widget) widget_draw(widget, gui->canvas_api);
+    Widget* widget = gui_widget_find_enabled(gui->layers[GuiLayerStatusBar]);
+    if(widget) {
+        widget_draw(widget, gui->canvas_api);
+        return true;
+    }
+    return false;
 }
 
-void gui_redraw_normal(Gui* gui) {
+bool gui_redraw_normal(Gui* gui) {
     canvas_frame_set(gui->canvas_api, 0, 9, 128, 55);
-    Widget* widget = gui_widget_find_enabled(gui->widgets);
-    if(widget) widget_draw(widget, gui->canvas_api);
+    Widget* widget = gui_widget_find_enabled(gui->layers[GuiLayerMain]);
+    if(widget) {
+        widget_draw(widget, gui->canvas_api);
+        return true;
+    }
+    return false;
 }
 
-void gui_redraw_dialogs(Gui* gui) {
-    canvas_frame_set(gui->canvas_api, 10, 20, 118, 44);
-    Widget* widget = gui_widget_find_enabled(gui->widgets_dialog);
-    if(widget) widget_draw(widget, gui->canvas_api);
+bool gui_redraw_none(Gui* gui) {
+    canvas_frame_set(gui->canvas_api, 0, 9, 118, 44);
+    Widget* widget = gui_widget_find_enabled(gui->layers[GuiLayerNone]);
+    if(widget) {
+        widget_draw(widget, gui->canvas_api);
+        return true;
+    }
+
+    return false;
 }
 
 void gui_redraw(Gui* gui) {
     assert(gui);
+    gui_lock(gui);
 
     if(!gui_redraw_fs(gui)) {
+        if(!gui_redraw_normal(gui)) {
+            gui_redraw_none(gui);
+        }
         gui_redraw_status_bar(gui);
-        gui_redraw_normal(gui);
     }
-    gui_redraw_dialogs(gui);
 
     canvas_commit(gui->canvas_api);
+    gui_unlock(gui);
 }
 
 void gui_input(Gui* gui, InputEvent* input_event) {
     assert(gui);
+    gui_lock(gui);
 
-    Widget* widget = gui_widget_find_enabled(gui->widgets_dialog);
-    if(!widget) widget = gui_widget_find_enabled(gui->widgets_fs);
-    if(!widget) widget = gui_widget_find_enabled(gui->widgets);
+    Widget* widget = gui_widget_find_enabled(gui->layers[GuiLayerFullscreen]);
+    if(!widget) widget = gui_widget_find_enabled(gui->layers[GuiLayerMain]);
+    if(!widget) widget = gui_widget_find_enabled(gui->layers[GuiLayerNone]);
 
     if(widget) {
         widget_input(widget, input_event);
     }
+
+    gui_unlock(gui);
+}
+
+void gui_lock(Gui* gui) {
+    assert(gui);
+    assert(osMutexAcquire(gui->mutex, osWaitForever) == osOK);
+}
+
+void gui_unlock(Gui* gui) {
+    assert(gui);
+    assert(osMutexRelease(gui->mutex) == osOK);
+}
+
+void gui_add_widget(GuiApi* gui_api, Widget* widget, GuiLayer layer) {
+    assert(gui_api);
+    assert(widget);
+    assert(layer < GuiLayerMAX);
+    Gui* gui = (Gui*)gui_api;
+
+    gui_lock(gui);
+    WidgetArray_push_back(gui->layers[layer], widget);
+    widget_gui_set(widget, gui);
+    gui_unlock(gui);
+    gui_update(gui);
+}
+
+void gui_remove_widget(GuiApi* gui_api, Widget* widget) {
+    assert(gui_api);
+    assert(widget);
+    Gui* gui = (Gui*)gui_api;
+
+    gui_lock(gui);
+
+    widget_gui_set(widget, NULL);
+    WidgetArray_it_t it;
+    for(size_t i = 0; i < GuiLayerMAX; i++) {
+        WidgetArray_it(it, gui->layers[i]);
+        while(!WidgetArray_end_p(it)) {
+            if(*WidgetArray_ref(it) == widget) {
+                WidgetArray_remove(gui->layers[i], it);
+            }
+            WidgetArray_next(it);
+        }
+    }
+
+    gui_unlock(gui);
 }
 
 Gui* gui_alloc() {
     Gui* gui = furi_alloc(sizeof(Gui));
-
-    // Initialize widget arrays
-    WidgetArray_init(gui->widgets_status_bar);
-    WidgetArray_init(gui->widgets);
-    WidgetArray_init(gui->widgets_fs);
-    WidgetArray_init(gui->widgets_dialog);
-
+    // Set API functions
+    gui->api.add_widget = gui_add_widget;
+    gui->api.remove_widget = gui_remove_widget;
+    // Allocate mutex
+    gui->mutex = osMutexNew(NULL);
+    assert(gui->mutex);
     // Event dispatcher
     gui->event = gui_event_alloc();
-
     // Drawing canvas api
     gui->canvas_api = canvas_api_init();
-
-    gui->api.add_widget = gui_add_widget;
+    // Compose Layers
+    for(size_t i = 0; i < GuiLayerMAX; i++) {
+        WidgetArray_init(gui->layers[i]);
+    }
 
     return gui;
 }

applications/gui/gui.h

@@ -4,15 +4,17 @@
 #include "canvas.h"
 
 typedef enum {
-    WidgetLayerStatusBar,
-    WidgetLayerMain,
-    WidgetLayerFullscreen,
-    WidgetLayerDialog
-} WidgetLayer;
+    GuiLayerNone, /* Special layer for internal use only */
 
-typedef struct Widget Widget;
+    GuiLayerStatusBar, /* Status bar widget layer */
+    GuiLayerMain, /* Main widget layer, status bar is shown */
+    GuiLayerFullscreen, /* Fullscreen widget layer */
+
+    GuiLayerMAX /* Don't use or move, special value */
+} GuiLayer;
 
 typedef struct GuiApi GuiApi;
 struct GuiApi {
-    void (*add_widget)(GuiApi* gui_api, Widget* widget, WidgetLayer layer);
+    void (*add_widget)(GuiApi* gui_api, Widget* widget, GuiLayer layer);
+    void (*remove_widget)(GuiApi* gui_api, Widget* widget);
 };

applications/gui/gui_event.c

@@ -8,7 +8,6 @@
 struct GuiEvent {
     PubSub* input_event_record;
     osMessageQueueId_t mqueue;
-    osMutexId_t lock_mutex;
 };
 
 void gui_event_input_events_callback(const void* value, void* ctx) {
@@ -33,37 +32,15 @@ GuiEvent* gui_event_alloc() {
     assert(gui_event->input_event_record != NULL);
     subscribe_pubsub(gui_event->input_event_record, gui_event_input_events_callback, gui_event);
 
-    // Lock mutex
-    gui_event->lock_mutex = osMutexNew(NULL);
-    assert(gui_event->lock_mutex);
-    gui_event_lock(gui_event);
-
     return gui_event;
 }
 
 void gui_event_free(GuiEvent* gui_event) {
-    osStatus_t status;
     assert(gui_event);
-    gui_event_unlock(gui_event);
-    status = osMessageQueueDelete(gui_event->mqueue);
-    assert(status == osOK);
+    assert(osMessageQueueDelete(gui_event->mqueue) == osOK);
     free(gui_event);
 }
 
-void gui_event_lock(GuiEvent* gui_event) {
-    osStatus_t status;
-    assert(gui_event);
-    status = osMutexAcquire(gui_event->lock_mutex, osWaitForever);
-    assert(status == osOK);
-}
-
-void gui_event_unlock(GuiEvent* gui_event) {
-    osStatus_t status;
-    assert(gui_event);
-    status = osMutexRelease(gui_event->lock_mutex);
-    assert(status == osOK);
-}
-
 void gui_event_messsage_send(GuiEvent* gui_event, GuiMessage* message) {
     assert(gui_event);
     assert(message);
@@ -71,12 +48,10 @@ void gui_event_messsage_send(GuiEvent* gui_event, GuiMessage* message) {
 }
 
 GuiMessage gui_event_message_next(GuiEvent* gui_event) {
-    osStatus_t status;
     assert(gui_event);
     GuiMessage message;
-    gui_event_unlock(gui_event);
-    status = osMessageQueueGet(gui_event->mqueue, &message, NULL, osWaitForever);
-    assert(status == osOK);
-    gui_event_lock(gui_event);
+
+    assert(osMessageQueueGet(gui_event->mqueue, &message, NULL, osWaitForever) == osOK);
+
     return message;
 }

applications/gui/gui_event.h

@@ -20,10 +20,6 @@ GuiEvent* gui_event_alloc();
 
 void gui_event_free(GuiEvent* gui_event);
 
-void gui_event_lock(GuiEvent* gui_event);
-
-void gui_event_unlock(GuiEvent* gui_event);
-
 void gui_event_messsage_send(GuiEvent* gui_event, GuiMessage* message);
 
 GuiMessage gui_event_message_next(GuiEvent* gui_event);

applications/gui/gui_i.h

@@ -3,3 +3,5 @@
 typedef struct Gui Gui;
 
 void gui_update(Gui* gui);
+void gui_lock(Gui* gui);
+void gui_unlock(Gui* gui);

applications/gui/icon.c

@@ -0,0 +1,63 @@
+#include "icon.h"
+#include "icon_i.h"
+
+#include <cmsis_os2.h>
+#include <flipper.h>
+#include <assert.h>
+
+Icon* icon_alloc(const IconData* data) {
+    Icon* icon = furi_alloc(sizeof(Icon));
+    icon->data = data;
+    return icon;
+}
+
+void icon_free(Icon* icon) {
+    assert(icon);
+    free(icon);
+}
+
+const uint8_t* icon_get_data(Icon* icon) {
+    assert(icon);
+    if(icon->tick) {
+        uint32_t now = osKernelGetTickCount();
+        if(now < icon->tick) {
+            icon->tick = now;
+            icon_next_frame(icon);
+        } else if(now - icon->tick > osKernelGetTickFreq() / icon->data->frame_rate) {
+            icon->tick = now;
+            icon_next_frame(icon);
+        }
+    }
+    return icon->data->frames[icon->frame];
+}
+
+void icon_next_frame(Icon* icon) {
+    assert(icon);
+    icon->frame = (icon->frame + 1) % icon->data->frame_count;
+}
+
+uint8_t icon_get_width(Icon* icon) {
+    assert(icon);
+    return icon->data->width;
+}
+
+uint8_t icon_get_height(Icon* icon) {
+    assert(icon);
+    return icon->data->height;
+}
+
+bool icon_is_animated(Icon* icon) {
+    assert(icon);
+    return icon->data->frame_count > 1;
+}
+
+void icon_start_animation(Icon* icon) {
+    assert(icon);
+    icon->tick = osKernelGetTickCount();
+}
+
+void icon_stop_animation(Icon* icon) {
+    assert(icon);
+    icon->tick = 0;
+    icon->frame = 0;
+}

applications/gui/icon.h

@@ -0,0 +1,21 @@
+#pragma once
+
+#include <stdint.h>
+#include <stdbool.h>
+
+typedef struct IconData IconData;
+typedef struct Icon Icon;
+
+Icon* icon_alloc(const IconData* data);
+
+void icon_free(Icon* icon);
+
+uint8_t icon_get_width(Icon* icon);
+
+uint8_t icon_get_height(Icon* icon);
+
+bool icon_is_animated(Icon* icon);
+
+void icon_start_animation(Icon* icon);
+
+void icon_stop_animation(Icon* icon);

applications/gui/icon_i.h

@@ -0,0 +1,21 @@
+#pragma once
+
+#include <stdint.h>
+
+struct IconData {
+    const uint8_t width;
+    const uint8_t height;
+    const uint8_t frame_count;
+    const uint8_t frame_rate;
+    const uint8_t** frames;
+};
+
+struct Icon {
+    const IconData* data;
+    uint8_t frame;
+    uint32_t tick;
+};
+
+const uint8_t* icon_get_data(Icon* icon);
+
+void icon_next_frame(Icon* icon);

applications/gui/widget.c

@@ -32,8 +32,10 @@ void widget_free(Widget* widget) {
 
 void widget_enabled_set(Widget* widget, bool enabled) {
     assert(widget);
-    widget->is_enabled = enabled;
-    widget_update(widget);
+    if(widget->is_enabled != enabled) {
+        widget->is_enabled = enabled;
+        widget_update(widget);
+    }
 }
 
 bool widget_is_enabled(Widget* widget) {