Compare commits

..

No commits in common. "0b5c302aa2e4a25a1b196f1328225b288b48ca55" and "2522f5da71421aee0613025cd730230cafaab338" have entirely different histories.

31 changed files with 225 additions and 532 deletions

View File

@ -37,8 +37,6 @@ CONFIG_LV_FS_STDIO_LETTER=65
CONFIG_LV_FS_STDIO_PATH=""
CONFIG_LV_FS_STDIO_CACHE_SIZE=4096
CONFIG_LV_USE_LODEPNG=n
# 2D keyboard navigation in grids (lvgl_grid_navigation_add())
CONFIG_LV_USE_GRIDNAV=y
CONFIG_LV_USE_BUILTIN_MALLOC=n
# Routes lv_malloc/realloc/free through Modules/lvgl-module/source/lv_mem_custom.c, which prefers
# PSRAM (falls back to internal RAM automatically) instead of a fixed-size pool or plain malloc.

View File

@ -22,3 +22,5 @@ lvgl.colorDepth=8
lvgl.fontSize=24
lvgl.theme=Mono
lvgl.statusbarColorsInverted=true
sdkconfig.CONFIG_LV_THEME_DEFAULT_TRANSITION_TIME=0

View File

@ -23,7 +23,11 @@ display.shape=rectangle
display.dpi=128
lvgl.colorDepth=8
# Monochrome theme: the default colour theme renders accent-coloured UI that
# thresholds to invisible on a 1bpp panel (enables CONFIG_LV_USE_THEME_MONO).
lvgl.theme=Mono
lvgl.statusbarColorsInverted=true
cdn.warningMessage=Display not reliably working. Use at your own risk.
sdkconfig.CONFIG_LV_THEME_DEFAULT_TRANSITION_TIME=0

View File

@ -22,7 +22,11 @@ display.shape=rectangle
display.dpi=128
lvgl.colorDepth=8
# Monochrome theme: the default colour theme renders accent-coloured UI that
# thresholds to invisible on a 1bpp panel (enables CONFIG_LV_USE_THEME_MONO).
lvgl.theme=Mono
lvgl.statusbarColorsInverted=true
cdn.warningMessage=Only for hardware revision 1.0! Display not reliably working. Use at your own risk.
sdkconfig.CONFIG_LV_THEME_DEFAULT_TRANSITION_TIME=0

View File

@ -25,3 +25,4 @@ lvgl.theme=Mono
lvgl.statusbarColorsInverted=true
sdkconfig.CONFIG_EPD_DISPLAY_TYPE_ED047TC2=y
sdkconfig.CONFIG_LV_THEME_DEFAULT_TRANSITION_TIME=0

View File

@ -103,7 +103,7 @@ static error_t start(Device* device) {
error_t error = acquire_button(
config->pin_primary,
two_button_mode ? (uint32_t)CODEPOINT_ENTER : (uint32_t)CODEPOINT_FOCUS_NEXT,
two_button_mode ? (uint32_t)CODEPOINT_ENTER : (uint32_t)CODEPOINT_ARROW_DOWN,
two_button_mode ? (uint32_t)CODEPOINT_ESCAPE : (uint32_t)CODEPOINT_ENTER,
&internal->primary
);
@ -112,7 +112,7 @@ static error_t start(Device* device) {
return error;
}
error = acquire_button(config->pin_secondary, CODEPOINT_FOCUS_NEXT, CODEPOINT_FOCUS_PREVIOUS, &internal->secondary);
error = acquire_button(config->pin_secondary, CODEPOINT_ARROW_DOWN, CODEPOINT_ARROW_UP, &internal->secondary);
if (error != ERROR_NONE) {
if (internal->primary.in_use) {
gpio_descriptor_release(internal->primary.descriptor);

View File

@ -1,7 +1,7 @@
description: >
GPIO-attached rotary encoder wheel - a 2-phase quadrature encoder (decoded via the ESP32
hardware PCNT peripheral) plus an optional separate click/enter button. Exposes a
KEYBOARD_TYPE device: each wheel detent is translated to a focus next/previous key, and the
KEYBOARD_TYPE device: each wheel detent is translated to an arrow up/down key, and the
button (if present) press/release is translated to the enter key.
compatible: "tactility,gpio-encoder"

View File

@ -262,7 +262,7 @@ static void poll_wheel(GpioEncoderInternal* internal) {
int32_t detents = total / internal->pulses_per_detent;
internal->pulse_remainder = total % internal->pulses_per_detent;
uint32_t key = detents >= 0 ? CODEPOINT_FOCUS_NEXT : CODEPOINT_FOCUS_PREVIOUS;
uint32_t key = detents >= 0 ? CODEPOINT_ARROW_DOWN : CODEPOINT_ARROW_UP;
int32_t count = detents >= 0 ? detents : -detents;
for (int32_t i = 0; i < count; i++) {
// A press without its matching release would leave the consumer thinking the key

View File

@ -29,15 +29,6 @@ else ()
set(ui_density_variable "LVGL_UI_DENSITY_DEFAULT")
message("UI density set to default: ${ui_density}")
endif ()
# Read the theme: whether the device uses dark mode by default
GET_VALUE_FROM_MAP(device_properties "lvgl.theme" lvgl_theme)
if (NOT lvgl_theme OR lvgl_theme STREQUAL "DefaultDark")
set(theme_dark 1)
elseif (lvgl_theme STREQUAL "DefaultLight" OR lvgl_theme STREQUAL "Mono")
set(theme_dark 0)
else ()
message(FATAL_ERROR "Invalid lvgl.theme: '${lvgl_theme}'. Must be 'DefaultDark', 'DefaultLight' or 'Mono'")
endif ()
# ####################################
# Create module
@ -83,6 +74,4 @@ target_compile_definitions(${MODULE_NAME} PUBLIC
"-DLV_LVGL_H_INCLUDE_SIMPLE"
# UiDensity
"-DTT_LVGL_UI_DENSITY=${ui_density_variable}"
# Default theme mode: 1 for dark, 0 for light
"-DTT_LVGL_THEME_DARK=${theme_dark}"
)

View File

@ -1,45 +0,0 @@
// SPDX-License-Identifier: Apache-2.0
#pragma once
#include <lvgl.h>
#ifdef __cplusplus
extern "C" {
#endif
/**
* @brief Lets the arrow keys move the focus between the container's children by their position, e.g. in a grid of buttons.
* The container takes the place of its children in the focus group. Moving past the first or last row leaves the container.
* @param[in] container the container with the focusable children
*/
void lvgl_grid_navigation_add(lv_obj_t* container);
/**
* @brief Turns grid navigation off again: the focusable children rejoin the container's focus group.
* @param[in] container a container that was passed to lvgl_grid_navigation_add()
*/
void lvgl_grid_navigation_remove(lv_obj_t* container);
/**
* @brief Moves the focus to the next or previous child in their order, for devices that can only step through widgets.
* Past the last or first child, the focus moves to the next or previous object in the container's focus group.
* @param[in] container a container that was passed to lvgl_grid_navigation_add()
* @param[in] next true for the next child, false for the previous child
*/
void lvgl_grid_navigation_focus_next(lv_obj_t* container, bool next);
/**
* @param[in] container a container that was passed to lvgl_grid_navigation_add()
* @return the focused child, or NULL when no child is focused
*/
lv_obj_t* lvgl_grid_navigation_get_focused(lv_obj_t* container);
/**
* @param[in] obj the object to check
* @return true when the object is a container that was passed to lvgl_grid_navigation_add()
*/
bool lvgl_grid_navigation_is_container(const lv_obj_t* obj);
#ifdef __cplusplus
}
#endif

View File

@ -31,12 +31,6 @@ void lvgl_theme_get_settings(LvglThemeSettings* settings);
*/
void lvgl_theme_get_default_settings(LvglThemeSettings* settings);
/**
* @brief Checks whether the active theme is the monochrome theme: on monochrome and greyscale displays, or when selected in the settings.
* @return true when the monochrome theme is active
*/
bool lvgl_theme_is_mono(void);
/**
* @brief Sets the theme settings. They are used for displays that are added afterwards, e.g. when LVGL (re)starts.
* @param[in] settings the theme settings

View File

@ -1,20 +0,0 @@
// SPDX-License-Identifier: Apache-2.0
#pragma once
#include <lvgl.h>
#ifdef __cplusplus
extern "C" {
#endif
/**
* @brief Creates a badge: a small dot that marks its parent (e.g. a favourite item).
* The theme determines its size and colour. It ignores the parent's layout, so the app aligns it (e.g. LV_ALIGN_TOP_RIGHT).
* @param[in] parent the object to mark
* @return the created badge
*/
lv_obj_t* lvgl_badge_create(lv_obj_t* parent);
#ifdef __cplusplus
}
#endif

View File

@ -1,7 +1,6 @@
// SPDX-License-Identifier: Apache-2.0
#include <lvgl/devices/keyboard.h>
#include <lvgl/devices/device_context.h>
#include <lvgl/grid_navigation.h>
#include <lvgl/lvgl.h>
#include <tactility/drivers/keyboard.h>
@ -56,8 +55,6 @@ static uint32_t codepoint_to_lv_key(uint32_t key) {
case CODEPOINT_ARROW_UP: return LV_KEY_PREV;
case CODEPOINT_ARROW_RIGHT: return LV_KEY_RIGHT;
case CODEPOINT_ARROW_DOWN: return LV_KEY_NEXT;
case CODEPOINT_FOCUS_NEXT: return LV_KEY_NEXT;
case CODEPOINT_FOCUS_PREVIOUS: return LV_KEY_PREV;
case CODEPOINT_HOME: return LV_KEY_HOME;
case CODEPOINT_END: return LV_KEY_END;
default: return key;
@ -75,25 +72,6 @@ static void lvgl_keyboard_read_cb(lv_indev_t* indev, lv_indev_data_t* data) {
}
data->key = codepoint_to_lv_key(key_data.key);
lv_group_t* group = lv_indev_get_group(indev);
lv_obj_t* focused = group != nullptr ? lv_group_get_focused(group) : nullptr;
if (lvgl_grid_navigation_is_container(focused)) {
if (key_data.key == CODEPOINT_ARROW_UP) {
// Grid navigation moves the focus in two dimensions with the arrow keys
data->key = LV_KEY_UP;
} else if (key_data.key == CODEPOINT_ARROW_DOWN) {
data->key = LV_KEY_DOWN;
} else if (key_data.key == CODEPOINT_FOCUS_NEXT || key_data.key == CODEPOINT_FOCUS_PREVIOUS) {
// Devices that can only step through widgets visit the children in their order.
// LVGL doesn't see these keys: the group would skip the children, as only the container is in the group.
if (key_data.pressed) {
lvgl_grid_navigation_focus_next(focused, key_data.key == CODEPOINT_FOCUS_NEXT);
}
data->state = LV_INDEV_STATE_RELEASED;
data->continue_reading = key_data.continue_reading;
return;
}
}
data->state = key_data.pressed ? LV_INDEV_STATE_PRESSED : LV_INDEV_STATE_RELEASED;
data->continue_reading = key_data.continue_reading;
}

View File

@ -1,107 +0,0 @@
// SPDX-License-Identifier: Apache-2.0
#include <lvgl/grid_navigation.h>
// Marks containers with grid navigation, so the keyboard sends them up and down keys
constexpr lv_obj_flag_t GRID_NAVIGATION_FLAG = LV_OBJ_FLAG_USER_1;
static void remove_from_group(lv_obj_t* child) {
if (lv_obj_get_group(child) != nullptr) {
lv_group_remove_obj(child);
}
}
// Children join the default group when they're created, but grid navigation focuses them through the container
static void on_child_created(lv_event_t* event) {
auto* child = static_cast<lv_obj_t*>(lv_event_get_param(event));
auto* container = lv_event_get_current_target_obj(event);
if (child != nullptr && lv_obj_get_parent(child) == container) {
remove_from_group(child);
}
}
void lvgl_grid_navigation_add(lv_obj_t* container) {
lv_gridnav_add(container, LV_GRIDNAV_CTRL_NONE);
lv_obj_add_flag(container, GRID_NAVIGATION_FLAG);
const uint32_t child_count = lv_obj_get_child_count(container);
for (uint32_t i = 0; i < child_count; i++) {
remove_from_group(lv_obj_get_child(container, static_cast<int32_t>(i)));
}
lv_obj_add_event_cb(container, on_child_created, LV_EVENT_CHILD_CREATED, nullptr);
auto* group = lv_group_get_default();
if (group != nullptr && lv_obj_get_group(container) == nullptr) {
lv_group_add_obj(group, container);
}
}
void lvgl_grid_navigation_remove(lv_obj_t* container) {
if (!lvgl_grid_navigation_is_container(container)) {
return;
}
lv_obj_t* focused_child = lvgl_grid_navigation_get_focused(container);
lv_group_t* group = lv_obj_get_group(container);
const bool container_focused = group != nullptr && lv_group_get_focused(group) == container;
lv_gridnav_remove(container);
lv_obj_remove_event_cb(container, on_child_created);
lv_obj_remove_flag(container, GRID_NAVIGATION_FLAG);
if (group == nullptr) {
return;
}
// The children are added at the end of the group
const uint32_t child_count = lv_obj_get_child_count(container);
for (uint32_t i = 0; i < child_count; i++) {
auto* child = lv_obj_get_child(container, static_cast<int32_t>(i));
if (lv_obj_is_group_def(child) && lv_obj_get_group(child) == nullptr) {
lv_group_add_obj(group, child);
}
}
if (container_focused && focused_child != nullptr) {
lv_group_focus_obj(focused_child);
}
}
// Matches which children grid navigation can focus
static bool is_focusable(lv_obj_t* obj) {
return !lv_obj_has_flag(obj, LV_OBJ_FLAG_HIDDEN) && lv_obj_has_flag_any(obj, static_cast<lv_obj_flag_t>(LV_OBJ_FLAG_CLICKABLE | LV_OBJ_FLAG_CLICK_FOCUSABLE));
}
void lvgl_grid_navigation_focus_next(lv_obj_t* container, bool next) {
const auto child_count = static_cast<int32_t>(lv_obj_get_child_count(container));
lv_obj_t* focused = lvgl_grid_navigation_get_focused(container);
int32_t index = focused != nullptr ? lv_obj_get_index(focused) : (next ? -1 : child_count);
for (index += next ? 1 : -1; index >= 0 && index < child_count; index += next ? 1 : -1) {
auto* child = lv_obj_get_child(container, index);
if (is_focusable(child)) {
lv_gridnav_set_focused(container, child, LV_ANIM_ON);
return;
}
}
lv_group_t* group = lv_obj_get_group(container);
if (group != nullptr) {
if (next) {
lv_group_focus_next(group);
} else {
lv_group_focus_prev(group);
}
}
}
lv_obj_t* lvgl_grid_navigation_get_focused(lv_obj_t* container) {
// Grid navigation marks the focused child with the focused state
const uint32_t child_count = lv_obj_get_child_count(container);
for (uint32_t i = 0; i < child_count; i++) {
auto* child = lv_obj_get_child(container, static_cast<int32_t>(i));
if (lv_obj_has_state(child, LV_STATE_FOCUSED)) {
return child;
}
}
return nullptr;
}
bool lvgl_grid_navigation_is_container(const lv_obj_t* obj) {
return obj != nullptr && lv_obj_has_flag(obj, GRID_NAVIGATION_FLAG);
}

View File

@ -10,9 +10,7 @@
#include <lvgl/devices/pointer.h>
#include <lvgl/widgets/sliderbox.h>
#include <lvgl/grid_navigation.h>
#include <lvgl/theme.h>
#include <lvgl/widgets/badge.h>
#include <lvgl/widgets/card.h>
#include <lvgl/widgets/chip.h>
#include <lvgl/widgets/icon_button.h>
@ -62,19 +60,10 @@ const struct ModuleSymbol lvgl_module_symbols[] = {
DEFINE_MODULE_SYMBOL(lvgl_pointer_add),
DEFINE_MODULE_SYMBOL(lvgl_pointer_get_slot_index),
DEFINE_MODULE_SYMBOL(lvgl_pointer_remove),
// lvgl_grid_navigation
DEFINE_MODULE_SYMBOL(lvgl_grid_navigation_add),
DEFINE_MODULE_SYMBOL(lvgl_grid_navigation_remove),
DEFINE_MODULE_SYMBOL(lvgl_grid_navigation_focus_next),
DEFINE_MODULE_SYMBOL(lvgl_grid_navigation_get_focused),
DEFINE_MODULE_SYMBOL(lvgl_grid_navigation_is_container),
// lvgl_theme
DEFINE_MODULE_SYMBOL(lvgl_theme_get_settings),
DEFINE_MODULE_SYMBOL(lvgl_theme_get_default_settings),
DEFINE_MODULE_SYMBOL(lvgl_theme_set_settings),
DEFINE_MODULE_SYMBOL(lvgl_theme_is_mono),
// lvgl_badge
DEFINE_MODULE_SYMBOL(lvgl_badge_create),
// lvgl_card
DEFINE_MODULE_SYMBOL(lvgl_card_create),
// lvgl_chip

View File

@ -23,7 +23,11 @@ static ActiveTheme active_theme = ActiveTheme::None;
void lvgl_theme_get_default_settings(LvglThemeSettings* settings) {
lv_theme_material_config_t material_config;
lv_theme_material_config_init(&material_config);
settings->is_dark = TT_LVGL_THEME_DARK;
#if defined(LV_THEME_DEFAULT_DARK) && LV_THEME_DEFAULT_DARK
settings->is_dark = true;
#else
settings->is_dark = false;
#endif
settings->is_mono = false;
settings->animations_enabled = true;
settings->color_primary = material_config.color_primary;
@ -44,10 +48,6 @@ void lvgl_theme_set_settings(const LvglThemeSettings* settings) {
theme_settings_set = true;
}
bool lvgl_theme_is_mono() {
return active_theme == ActiveTheme::MaterialMono;
}
static lv_theme_t* get_active_theme() {
switch (active_theme) {
case ActiveTheme::Material:

View File

@ -15,7 +15,6 @@ extern const lv_obj_class_t lvgl_icon_button_tonal_class;
extern const lv_obj_class_t lvgl_sliderbox_class;
extern const lv_obj_class_t lvgl_card_class;
extern const lv_obj_class_t lvgl_chip_class;
extern const lv_obj_class_t lvgl_badge_class;
#define NEUTRAL_4 lv_color_hex(0x0E0E0E)
#define NEUTRAL_6 lv_color_hex(0x131313)
@ -137,8 +136,6 @@ extern const lv_obj_class_t lvgl_badge_class;
#define CHIP_SHAPE (theme->config.is_compact ? CORNER_COMPACT : CORNER_SMALL)
#define CHIP_PAD_HOR (theme->config.is_compact ? 3 : SPACE_4)
#define CHIP_PAD_VER (theme->config.is_compact ? 2 : LV_DPX_CALC(theme->disp_dpi, 6))
#define BADGE_COLOR COLOR_PRIMARY
#define BADGE_SIZE (theme->config.is_compact ? 4 : LV_DPX_CALC(theme->disp_dpi, 6))
#define SCROLLBAR_COLOR COLOR_OUTLINE
#define SCROLLBAR_OPACITY (LV_OPA_40)
#define SCROLLBAR_SCROLLED_OPACITY (LV_OPA_70)
@ -162,6 +159,7 @@ extern const lv_obj_class_t lvgl_badge_class;
#define TEXT_BUTTON_PRESSED_CONTAINER_COLOR COLOR_PRIMARY
#define TEXT_BUTTON_PAD_HOR (theme->config.is_compact ? 3 : SPACE_3)
#define ICON_BUTTON_COLOR COLOR_ON_SURFACE_VARIANT
#define ICON_BUTTON_SELECTED_COLOR COLOR_PRIMARY
#define ICON_BUTTON_CONTAINER_SHAPE (theme->config.is_compact ? CORNER_COMPACT : CORNER_LARGE)
#define ICON_BUTTON_FILLED_COLOR COLOR_PRIMARY
#define ICON_BUTTON_FILLED_ICON_COLOR COLOR_ON_PRIMARY
@ -334,7 +332,6 @@ typedef struct {
lv_style_t screen;
lv_style_t container;
lv_style_t card;
lv_style_t badge;
lv_style_t chip;
lv_style_t chip_selected;
#if LV_USE_BUTTON
@ -357,11 +354,13 @@ typedef struct {
lv_style_t text_button_pressed;
#endif
lv_style_t icon_button;
lv_style_t icon_button_selected;
lv_style_t icon_button_filled;
lv_style_t icon_button_filled_pressed;
lv_style_t icon_button_tonal;
lv_style_t icon_button_tonal_pressed;
lv_style_t app_bar;
lv_style_t app_bar_actions;
lv_style_t app_bar_button;
lv_style_t app_bar_button_pressed;
lv_style_t app_bar_focus_ring;
@ -758,13 +757,6 @@ static void style_init(my_theme_t * theme)
lv_style_set_pad_all(&theme->styles.card, CARD_PAD);
lv_style_set_pad_gap(&theme->styles.card, CARD_GAP);
style_init_reset(&theme->styles.badge);
lv_style_set_width(&theme->styles.badge, BADGE_SIZE);
lv_style_set_height(&theme->styles.badge, BADGE_SIZE);
lv_style_set_radius(&theme->styles.badge, LV_RADIUS_CIRCLE);
lv_style_set_bg_color(&theme->styles.badge, BADGE_COLOR);
lv_style_set_bg_opa(&theme->styles.badge, LV_OPA_COVER);
style_init_reset(&theme->styles.chip);
lv_style_set_bg_opa(&theme->styles.chip, LV_OPA_TRANSP);
lv_style_set_text_color(&theme->styles.chip, CHIP_LABEL_COLOR);
@ -835,6 +827,9 @@ static void style_init(my_theme_t * theme)
lv_style_set_radius(&theme->styles.icon_button, BUTTON_SHAPE);
lv_style_set_pad_all(&theme->styles.icon_button, BUTTON_PAD_VER);
style_init_reset(&theme->styles.icon_button_selected);
lv_style_set_text_color(&theme->styles.icon_button_selected, ICON_BUTTON_SELECTED_COLOR);
style_init_reset(&theme->styles.icon_button_filled);
lv_style_set_bg_color(&theme->styles.icon_button_filled, ICON_BUTTON_FILLED_COLOR);
lv_style_set_bg_opa(&theme->styles.icon_button_filled, LV_OPA_COVER);
@ -865,6 +860,13 @@ static void style_init(my_theme_t * theme)
lv_style_set_pad_ver(&theme->styles.app_bar, 0);
lv_style_set_pad_gap(&theme->styles.app_bar, APP_BAR_GAP);
style_init_reset(&theme->styles.app_bar_actions);
lv_style_set_bg_opa(&theme->styles.app_bar_actions, LV_OPA_TRANSP);
lv_style_set_border_width(&theme->styles.app_bar_actions, 0);
lv_style_set_radius(&theme->styles.app_bar_actions, 0);
lv_style_set_pad_all(&theme->styles.app_bar_actions, 0);
lv_style_set_pad_gap(&theme->styles.app_bar_actions, APP_BAR_GAP);
style_init_reset(&theme->styles.app_bar_button);
lv_style_set_pad_all(&theme->styles.app_bar_button, 0);
lv_style_set_text_color(&theme->styles.app_bar_button, APP_BAR_CONTENT_COLOR);
@ -1609,6 +1611,11 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
return;
}
#endif
/* toolbar > obj */
if(lv_obj_check_type(parent, &lvgl_toolbar_class)) {
lv_obj_add_style(obj, &theme->styles.app_bar_actions, 0);
return;
}
/* obj */
lv_obj_add_style(obj, &theme->styles.container, 0);
lv_obj_add_style(obj, &theme->styles.scrollbar, LV_PART_SCROLLBAR);
@ -1692,8 +1699,21 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
lv_obj_add_style(obj, &theme->styles.disabled, LV_STATE_DISABLED);
return;
}
/* toolbar > obj > icon_button */
if(lv_obj_check_type(lss_ancestor(obj, 2), &lvgl_toolbar_class) && lv_obj_check_type(parent, &lv_obj_class)) {
lv_obj_add_style(obj, &theme->styles.icon_button, 0);
lv_obj_add_style(obj, &theme->styles.app_bar_button, 0);
lv_obj_add_style(obj, &theme->styles.transition_exit, 0);
lv_obj_add_style(obj, &theme->styles.app_bar_button_pressed, LV_STATE_PRESSED);
lv_obj_add_style(obj, &theme->styles.transition_enter, LV_STATE_PRESSED);
lv_obj_add_style(obj, &theme->styles.app_bar_focus_ring, LV_STATE_FOCUS_KEY);
lv_obj_add_style(obj, &theme->styles.app_bar_focus_ring, LV_STATE_EDITED);
lv_obj_add_style(obj, &theme->styles.disabled, LV_STATE_DISABLED);
return;
}
/* icon_button */
lv_obj_add_style(obj, &theme->styles.icon_button, 0);
lv_obj_add_style(obj, &theme->styles.icon_button_selected, LV_STATE_CHECKED);
lv_obj_add_style(obj, &theme->styles.transition_exit, 0);
lv_obj_add_style(obj, &theme->styles.state_pressed, LV_STATE_PRESSED);
lv_obj_add_style(obj, &theme->styles.transition_enter, LV_STATE_PRESSED);
@ -1704,8 +1724,8 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
}
#if LV_USE_DROPDOWN
if(lv_obj_check_type(obj, &lv_dropdown_class)) {
/* toolbar > dropdown */
if(lv_obj_check_type(parent, &lvgl_toolbar_class)) {
/* toolbar > obj > dropdown */
if(lv_obj_check_type(lss_ancestor(obj, 2), &lvgl_toolbar_class) && lv_obj_check_type(parent, &lv_obj_class)) {
lv_obj_add_style(obj, &theme->styles.field, 0);
lv_obj_add_style(obj, &theme->styles.transition_exit, 0);
lv_obj_add_style(obj, &theme->styles.state_pressed, LV_STATE_PRESSED);
@ -1833,11 +1853,6 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
return;
}
#endif
if(lv_obj_check_type(obj, &lvgl_badge_class)) {
/* badge */
lv_obj_add_style(obj, &theme->styles.badge, 0);
return;
}
if(lv_obj_check_type(obj, &lvgl_chip_class)) {
/* chip */
lv_obj_add_style(obj, &theme->styles.chip, 0);

View File

@ -15,7 +15,6 @@ extern const lv_obj_class_t lvgl_icon_button_tonal_class;
extern const lv_obj_class_t lvgl_sliderbox_class;
extern const lv_obj_class_t lvgl_card_class;
extern const lv_obj_class_t lvgl_chip_class;
extern const lv_obj_class_t lvgl_badge_class;
#define BLACK lv_color_black()
#define WHITE lv_color_white()
@ -87,8 +86,6 @@ extern const lv_obj_class_t lvgl_badge_class;
#define CHIP_SHAPE (theme->config.is_compact ? CORNER_COMPACT : CORNER_SMALL)
#define CHIP_PAD_HOR (theme->config.is_compact ? 3 : SPACE_4)
#define CHIP_PAD_VER (theme->config.is_compact ? 2 : SPACE_2)
#define BADGE_COLOR COLOR_ON_SURFACE
#define BADGE_SIZE (theme->config.is_compact ? 4 : LV_DPX_CALC(theme->disp_dpi, 6))
#define SCROLLBAR_COLOR COLOR_ON_SURFACE
#define SCROLLBAR_WIDTH (theme->config.is_compact ? 2 : LV_DPX_CALC(theme->disp_dpi, 3))
#define SCROLLBAR_PAD 1
@ -216,16 +213,17 @@ typedef struct {
lv_style_t screen;
lv_style_t container;
lv_style_t card;
lv_style_t badge;
lv_style_t chip;
#if LV_USE_BUTTON || LV_USE_MSGBOX
lv_style_t button;
#endif
lv_style_t icon_button;
lv_style_t icon_button_selected;
lv_style_t icon_button_filled;
lv_style_t icon_button_filled_pressed;
lv_style_t icon_button_tonal;
lv_style_t app_bar;
lv_style_t app_bar_actions;
lv_style_t app_bar_button;
lv_style_t app_bar_focus_ring;
#if LV_USE_SWITCH
@ -548,13 +546,6 @@ static void style_init(my_theme_t * theme)
lv_style_set_pad_all(&theme->styles.card, CARD_PAD);
lv_style_set_pad_gap(&theme->styles.card, CARD_GAP);
style_init_reset(&theme->styles.badge);
lv_style_set_width(&theme->styles.badge, BADGE_SIZE);
lv_style_set_height(&theme->styles.badge, BADGE_SIZE);
lv_style_set_radius(&theme->styles.badge, LV_RADIUS_CIRCLE);
lv_style_set_bg_color(&theme->styles.badge, BADGE_COLOR);
lv_style_set_bg_opa(&theme->styles.badge, LV_OPA_COVER);
style_init_reset(&theme->styles.chip);
lv_style_set_bg_color(&theme->styles.chip, COLOR_SURFACE);
lv_style_set_bg_opa(&theme->styles.chip, LV_OPA_COVER);
@ -585,6 +576,10 @@ static void style_init(my_theme_t * theme)
lv_style_set_radius(&theme->styles.icon_button, BUTTON_SHAPE);
lv_style_set_pad_all(&theme->styles.icon_button, BUTTON_PAD_VER);
style_init_reset(&theme->styles.icon_button_selected);
lv_style_set_border_color(&theme->styles.icon_button_selected, COLOR_OUTLINE);
lv_style_set_border_width(&theme->styles.icon_button_selected, BORDER);
style_init_reset(&theme->styles.icon_button_filled);
lv_style_set_bg_color(&theme->styles.icon_button_filled, ICON_BUTTON_FILLED_COLOR);
lv_style_set_bg_opa(&theme->styles.icon_button_filled, LV_OPA_COVER);
@ -619,6 +614,13 @@ static void style_init(my_theme_t * theme)
lv_style_set_pad_ver(&theme->styles.app_bar, 0);
lv_style_set_pad_gap(&theme->styles.app_bar, APP_BAR_GAP);
style_init_reset(&theme->styles.app_bar_actions);
lv_style_set_bg_opa(&theme->styles.app_bar_actions, LV_OPA_TRANSP);
lv_style_set_border_width(&theme->styles.app_bar_actions, 0);
lv_style_set_radius(&theme->styles.app_bar_actions, 0);
lv_style_set_pad_all(&theme->styles.app_bar_actions, 0);
lv_style_set_pad_gap(&theme->styles.app_bar_actions, APP_BAR_GAP);
style_init_reset(&theme->styles.app_bar_button);
lv_style_set_pad_all(&theme->styles.app_bar_button, 0);
@ -1260,6 +1262,11 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
return;
}
#endif
/* toolbar > obj */
if(lv_obj_check_type(parent, &lvgl_toolbar_class)) {
lv_obj_add_style(obj, &theme->styles.app_bar_actions, 0);
return;
}
/* obj */
lv_obj_add_style(obj, &theme->styles.container, 0);
lv_obj_add_style(obj, &theme->styles.scrollbar, LV_PART_SCROLLBAR);
@ -1326,8 +1333,19 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
lv_obj_add_style(obj, &theme->styles.disabled, LV_STATE_DISABLED);
return;
}
/* toolbar > obj > icon_button */
if(lv_obj_check_type(lss_ancestor(obj, 2), &lvgl_toolbar_class) && lv_obj_check_type(parent, &lv_obj_class)) {
lv_obj_add_style(obj, &theme->styles.icon_button, 0);
lv_obj_add_style(obj, &theme->styles.app_bar_button, 0);
lv_obj_add_style(obj, &theme->styles.inverted, LV_STATE_PRESSED);
lv_obj_add_style(obj, &theme->styles.app_bar_focus_ring, LV_STATE_FOCUS_KEY);
lv_obj_add_style(obj, &theme->styles.app_bar_focus_ring, LV_STATE_EDITED);
lv_obj_add_style(obj, &theme->styles.disabled, LV_STATE_DISABLED);
return;
}
/* icon_button */
lv_obj_add_style(obj, &theme->styles.icon_button, 0);
lv_obj_add_style(obj, &theme->styles.icon_button_selected, LV_STATE_CHECKED);
lv_obj_add_style(obj, &theme->styles.inverted, LV_STATE_PRESSED);
lv_obj_add_style(obj, &theme->styles.focus_ring_inset, LV_STATE_FOCUS_KEY);
lv_obj_add_style(obj, &theme->styles.edit_ring_inset, LV_STATE_EDITED);
@ -1428,11 +1446,6 @@ static void theme_apply(lv_theme_t * th, lv_obj_t * obj)
return;
}
#endif
if(lv_obj_check_type(obj, &lvgl_badge_class)) {
/* badge */
lv_obj_add_style(obj, &theme->styles.badge, 0);
return;
}
if(lv_obj_check_type(obj, &lvgl_chip_class)) {
/* chip */
lv_obj_add_style(obj, &theme->styles.chip, 0);

View File

@ -1,33 +0,0 @@
// SPDX-License-Identifier: Apache-2.0
#define LV_USE_PRIVATE_API 1 // For the lv_obj_class_t declaration
#include <lvgl/widgets/badge.h>
static void badge_constructor(const lv_obj_class_t* class_p, lv_obj_t* obj) {
LV_UNUSED(class_p);
lv_obj_remove_flag(obj, LV_OBJ_FLAG_CLICKABLE);
lv_obj_remove_flag(obj, LV_OBJ_FLAG_SCROLLABLE);
lv_obj_add_flag(obj, LV_OBJ_FLAG_IGNORE_LAYOUT);
}
// Not static: the theme styles badges by this class
extern "C" const lv_obj_class_t lvgl_badge_class = {
.base_class = &lv_obj_class,
.constructor_cb = badge_constructor,
.destructor_cb = nullptr,
.event_cb = nullptr,
.user_data = nullptr,
.name = "badge",
.width_def = 0,
.height_def = 0,
.editable = LV_OBJ_CLASS_EDITABLE_INHERIT,
.group_def = LV_OBJ_CLASS_GROUP_DEF_FALSE,
.instance_size = 0,
.theme_inheritable = LV_OBJ_CLASS_THEME_INHERITABLE_FALSE
};
lv_obj_t* lvgl_badge_create(lv_obj_t* parent) {
lv_obj_t* obj = lv_obj_class_create_obj(&lvgl_badge_class, parent);
lv_obj_class_init_obj(obj);
return obj;
}

View File

@ -4,16 +4,12 @@
#include <lvgl/widgets/toolbar.h>
#include <lvgl/fonts.h>
#include <lvgl/grid_navigation.h>
#include <lvgl/lvgl.h>
#include <lvgl/widgets/icon_button.h>
#include <lvgl/widgets/spinner.h>
#include <tactility/check.h>
#include <tactility/drivers/pointer.h>
#include <tactility/log.h>
constexpr auto* TAG = "lvgl_toolbar";
static uint32_t getToolbarHeight(UiDensity uiDensity) {
if (uiDensity == LVGL_UI_DENSITY_COMPACT) {
@ -43,6 +39,7 @@ typedef struct {
lv_obj_t* title_label;
lv_obj_t* close_button;
lv_obj_t* close_button_image;
lv_obj_t* action_container;
uint8_t action_count;
lv_event_cb_t nav_action_callback;
} Toolbar;
@ -102,8 +99,6 @@ lv_obj_t* lvgl_toolbar_create(lv_obj_t* parent, const char* title) {
lv_obj_center(obj);
lv_obj_set_flex_flow(obj, LV_FLEX_FLOW_ROW);
lv_obj_set_flex_align(obj, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
// The arrow keys move between the close button and the actions, and up and down leave the toolbar
lvgl_grid_navigation_add(obj);
toolbar->close_button = create_action_button(obj, ui_density);
toolbar->close_button_image = lv_image_create(toolbar->close_button);
@ -115,6 +110,11 @@ lv_obj_t* lvgl_toolbar_create(lv_obj_t* parent, const char* title) {
lv_label_set_long_mode(toolbar->title_label, LV_LABEL_LONG_MODE_SCROLL);
lv_obj_set_flex_grow(toolbar->title_label, 1);
toolbar->action_container = lv_obj_create(obj);
lv_obj_set_size(toolbar->action_container, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_set_flex_flow(toolbar->action_container, LV_FLEX_FLOW_ROW);
lv_obj_set_flex_align(toolbar->action_container, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
lvgl_toolbar_set_nav_action(obj, LV_SYMBOL_CLOSE, &default_nav_action, nullptr);
// If we don't have a touch device, we assume there's some other kind of input like a keyboard, an encoder or button control
@ -122,8 +122,8 @@ lv_obj_t* lvgl_toolbar_create(lv_obj_t* parent, const char* title) {
// an extra time for every screen.
if (!device_has_active_by_type(&POINTER_TYPE)) {
lv_obj_update_layout(obj); // Resolve flex layout first, so focus/state invalidate against final coords
lv_group_focus_obj(obj);
lv_gridnav_set_focused(obj, toolbar->close_button, LV_ANIM_OFF);
lv_group_focus_obj(toolbar->close_button);
lv_obj_add_state(toolbar->close_button, LV_STATE_FOCUS_KEY);
}
return obj;
@ -151,7 +151,7 @@ static lv_obj_t* toolbar_add_button_action(lv_obj_t* obj, const char* imageOrBut
check(toolbar->action_count < TOOLBAR_ACTION_LIMIT, "max actions reached");
toolbar->action_count++;
lv_obj_t* action_button = create_action_button(obj, lvgl_get_ui_density());
lv_obj_t* action_button = create_action_button(toolbar->action_container, lvgl_get_ui_density());
lv_obj_add_event_cb(action_button, callback, LV_EVENT_SHORT_CLICKED, user_data);
lv_obj_t* button_content;
if (isImage) {
@ -179,7 +179,7 @@ lv_obj_t* lvgl_toolbar_add_switch_action(lv_obj_t* obj) {
check(toolbar->action_count < TOOLBAR_ACTION_LIMIT, "max actions reached");
toolbar->action_count++;
return lv_switch_create(obj);
return lv_switch_create(toolbar->action_container);
}
lv_obj_t* lvgl_toolbar_add_dropdown_action(lv_obj_t* obj, const char* options, lv_coord_t width, const char* text) {
@ -187,11 +187,7 @@ lv_obj_t* lvgl_toolbar_add_dropdown_action(lv_obj_t* obj, const char* options, l
check(toolbar->action_count < TOOLBAR_ACTION_LIMIT, "max actions reached");
toolbar->action_count++;
// The arrow keys can't both navigate the toolbar and the opened dropdown
LOG_W(TAG, "Dropdown actions are deprecated: the toolbar can't be navigated with the arrow keys when it has one");
lvgl_grid_navigation_remove(obj);
lv_obj_t* widget = lv_dropdown_create(obj);
lv_obj_t* widget = lv_dropdown_create(toolbar->action_container);
lv_dropdown_set_options(widget, options);
lv_dropdown_set_selected_highlight(widget, false);
if (width > 0) {
@ -209,7 +205,7 @@ lv_obj_t* lvgl_toolbar_add_spinner_action(lv_obj_t* obj) {
check(toolbar->action_count < TOOLBAR_ACTION_LIMIT, "max actions reached");
toolbar->action_count++;
auto* spinner = lvgl_spinner_create(obj);
auto* spinner = lvgl_spinner_create(toolbar->action_container);
if (lv_display_get_color_format(lv_obj_get_display(obj)) == LV_COLOR_FORMAT_L8) {
lv_obj_set_style_image_recolor(spinner, lv_theme_get_color_secondary(obj), LV_STATE_DEFAULT);
@ -221,9 +217,6 @@ lv_obj_t* lvgl_toolbar_add_spinner_action(lv_obj_t* obj) {
void lvgl_toolbar_clear_actions(lv_obj_t* obj) {
auto* toolbar = reinterpret_cast<Toolbar*>(obj);
// The actions follow the close button and the title
while (lv_obj_get_child_count(obj) > 2) {
lv_obj_delete(lv_obj_get_child(obj, 2));
}
lv_obj_clean(toolbar->action_container);
toolbar->action_count = 0;
}

View File

@ -28,7 +28,6 @@
@widget sliderbox: lvgl_sliderbox_class;
@widget card: lvgl_card_class;
@widget chip: lvgl_chip_class;
@widget badge: lvgl_badge_class;
// ============================================================
// 1. Base tokens
@ -199,10 +198,6 @@
@chip-pad-hor: if($isCompact, 3, @space-4);
@chip-pad-ver: if($isCompact, 2, 6dp);
// Badge (lvgl_badge_create): a small dot that marks an item, e.g. a favourite
@badge-color: @color-primary;
@badge-size: if($isCompact, 4, 6dp);
// Scrollbar
@scrollbar-color: @color-outline;
@scrollbar-opacity: 40%;
@ -233,6 +228,7 @@
// Icon button (dialog and window header buttons)
@icon-button-color: @color-on-surface-variant;
@icon-button-selected-color: @color-primary;
// Filled and tonal icon buttons: Material 3 large icon buttons with a container
@icon-button-container-shape: if($isCompact, @corner-compact, @corner-large);
@ -565,14 +561,6 @@ card {
padGap: @card-gap;
}
badge {
width: @badge-size;
height: @badge-size;
radius: circle;
bgColor: @badge-color;
bgOpa: cover;
}
chip {
bgOpa: transp;
textColor: @chip-label-color;
@ -641,6 +629,11 @@ icon_button {
padAll: @button-pad-ver;
}
// Material 3 selected (toggled) icon button
icon_button_selected {
textColor: @icon-button-selected-color;
}
icon_button_filled {
bgColor: @icon-button-filled-color;
bgOpa: cover;
@ -676,6 +669,14 @@ app_bar {
padGap: @app-bar-gap;
}
app_bar_actions {
bgOpa: transp;
borderWidth: 0;
radius: 0;
padAll: 0;
padGap: @app-bar-gap;
}
app_bar_button {
padAll: 0;
textColor: @app-bar-content-color;
@ -1228,6 +1229,10 @@ apply(calendar > obj) {
// No styles
}
apply(toolbar > obj) {
app_bar_actions: default;
}
apply(obj) {
container: default;
scrollbar: part.scrollbar;
@ -1267,7 +1272,7 @@ apply(button) {
button_disabled: state.disabled;
}
apply(toolbar > icon_button) {
apply(toolbar > icon_button, toolbar > obj > icon_button) {
icon_button: default;
app_bar_button: default;
transition_exit: default;
@ -1278,7 +1283,7 @@ apply(toolbar > icon_button) {
disabled: state.disabled;
}
apply(toolbar > dropdown) {
apply(toolbar > obj > dropdown) {
@include dropdown;
app_bar_field: default;
app_bar_focus_ring: state.focusKey;
@ -1290,6 +1295,7 @@ apply(toolbar) {
apply(icon_button) {
icon_button: default;
icon_button_selected: state.checked;
transition_exit: default;
state_pressed: state.pressed;
transition_enter: state.pressed;
@ -1374,10 +1380,6 @@ apply(checkbox) {
disabled: state.disabled;
}
apply(badge) {
badge: default;
}
apply(chip) {
chip: default;
transition_exit: default;

View File

@ -29,7 +29,6 @@
@widget sliderbox: lvgl_sliderbox_class;
@widget card: lvgl_card_class;
@widget chip: lvgl_chip_class;
@widget badge: lvgl_badge_class;
// ============================================================
// 1. Base tokens
@ -142,10 +141,6 @@
@chip-pad-hor: if($isCompact, 3, @space-4);
@chip-pad-ver: if($isCompact, 2, @space-2);
// Badge (lvgl_badge_create): a small dot that marks an item, e.g. a favourite
@badge-color: @color-on-surface;
@badge-size: if($isCompact, 4, 6dp);
// Scrollbar
@scrollbar-color: @color-on-surface;
@scrollbar-width: if($isCompact, 2, 3dp);
@ -392,14 +387,6 @@ card {
padGap: @card-gap;
}
badge {
width: @badge-size;
height: @badge-size;
radius: circle;
bgColor: @badge-color;
bgOpa: cover;
}
chip {
bgColor: @color-surface;
bgOpa: cover;
@ -431,6 +418,12 @@ icon_button {
padAll: @button-pad-ver;
}
// Selected (toggled) icon button: outlined, as there is no colour to show it with
icon_button_selected {
borderColor: @color-outline;
borderWidth: @border;
}
icon_button_filled {
bgColor: @icon-button-filled-color;
bgOpa: cover;
@ -470,6 +463,14 @@ app_bar {
padGap: @app-bar-gap;
}
app_bar_actions {
bgOpa: transp;
borderWidth: 0;
radius: 0;
padAll: 0;
padGap: @app-bar-gap;
}
app_bar_button {
padAll: 0;
}
@ -936,6 +937,10 @@ apply(calendar > obj) {
// No styles
}
apply(toolbar > obj) {
app_bar_actions: default;
}
apply(obj) {
container: default;
scrollbar: part.scrollbar;
@ -951,7 +956,7 @@ apply(tabview > *[0] > button) {
edit_ring: state.edited;
}
apply(toolbar > icon_button) {
apply(toolbar > icon_button, toolbar > obj > icon_button) {
icon_button: default;
app_bar_button: default;
inverted: state.pressed;
@ -966,6 +971,7 @@ apply(toolbar) {
apply(icon_button) {
icon_button: default;
icon_button_selected: state.checked;
inverted: state.pressed;
focus_ring_inset: state.focusKey;
edit_ring_inset: state.edited;
@ -1037,10 +1043,6 @@ apply(checkbox) {
disabled: part.indicator, state.disabled;
}
apply(badge) {
badge: default;
}
apply(chip) {
chip: default;
inverted: state.checked;

View File

@ -17,7 +17,8 @@ namespace tt::app::selectiondialog {
* @a callerAppInstanceId (a new-model app - see app/manager.h). The caller receives the
* result as an APP_EVENT_RESULT in its own event loop: result is the selected item's index
* (>= 0), -1 if 0 items were provided (an error - the dialog auto-closes without showing
* anything), or -2 if the dialog was dismissed without a selection. No result_bundle. If exactly 1 item is provided, the dialog
* anything), or a value not matching any item (currently always 1) if the dialog was
* dismissed without a selection. No result_bundle. If exactly 1 item is provided, the dialog
* auto-closes with result index 0 without showing anything. The caller is responsible for
* calling app_manager_stop() on the returned instance id once it has handled the result.
* @return the new dialog's app instance id

View File

@ -2,8 +2,6 @@
#include <lvgl/devices/indev.h>
#include <lvgl/fonts.h>
#include <lvgl/grid_navigation.h>
#include <lvgl/widgets/badge.h>
#include <lvgl/widgets/icon_button.h>
#include <lvgl/widgets/toolbar.h>
@ -105,14 +103,13 @@ void AppGrid::requestRepopulate(bool keepSelection) {
}
void AppGrid::populate() {
// Captured before lv_obj_clean() deletes the currently focused tile below: creating
// replacement tiles doesn't restore the focus, so the app id is remembered here and
// re-focused on its new tile once rebuilt.
// Captured before lv_obj_clean() deletes the currently focused tile below: LVGL moves
// focus elsewhere as it leaves the group, and creating replacement tiles doesn't restore
// it, so the app id is remembered here and re-focused on its new tile once rebuilt.
std::string focusedAppId;
lv_group_t* group = lv_group_get_default();
if (group != nullptr && keepSelectionOnRepopulate) {
// Grid navigation focuses the grid in the group, and a tile within the grid
lv_obj_t* focused = lv_group_get_focused(group) == grid ? lvgl_grid_navigation_get_focused(grid) : nullptr;
lv_obj_t* focused = lv_group_get_focused(group);
if (focused != nullptr && lv_obj_get_parent(focused) == grid) {
focusedAppId = static_cast<const AppGridItem*>(lv_obj_get_user_data(focused))->manifest.id;
}
@ -152,8 +149,11 @@ void AppGrid::populate() {
for (uint32_t i = first; i < last; i++) {
const auto& item = items[i];
// The theme styles the tile as an icon button, including its focus and pressed states
// The theme styles the tile as an icon button: its focus, pressed and selected (favourite) states
lv_obj_t* tile = lvgl_icon_button_create(grid);
if (item.highlighted) {
lv_obj_add_state(tile, LV_STATE_CHECKED);
}
lv_obj_set_size(tile, layout.tileWidth, layout.tileHeight);
lv_obj_set_style_pad_all(tile, layout.pad, LV_STATE_DEFAULT);
lv_obj_set_style_pad_row(tile, layout.pad / 2, LV_STATE_DEFAULT);
@ -175,12 +175,6 @@ void AppGrid::populate() {
lv_label_set_long_mode(label, LV_LABEL_LONG_MODE_DOTS);
lv_label_set_text(label, item.manifest.name);
// A badge marks favourites, as it doesn't look like the focus indicator
if (item.highlighted) {
auto* badge = lvgl_badge_create(tile);
lv_obj_align(badge, LV_ALIGN_TOP_RIGHT, 0, 0);
}
lv_obj_add_event_cb(tile, onTileClicked, LV_EVENT_SHORT_CLICKED, this);
if (callbacks.onLongPressed != nullptr) {
lv_obj_add_event_cb(tile, onTileLongPressed, LV_EVENT_LONG_PRESSED, this);
@ -195,8 +189,8 @@ void AppGrid::populate() {
}
if (focusedTile != nullptr) {
lv_group_focus_obj(grid);
lv_gridnav_set_focused(grid, focusedTile, LV_ANIM_OFF);
lv_group_focus_obj(focusedTile);
lv_obj_add_state(focusedTile, LV_STATE_FOCUS_KEY);
}
}
@ -213,8 +207,6 @@ void AppGrid::createWidgets(lv_obj_t* parent, lv_obj_t* toolbar) {
lv_obj_set_style_pad_column(grid, TILE_GAP, LV_STATE_DEFAULT);
lv_obj_set_style_border_width(grid, 0, LV_STATE_DEFAULT);
lv_obj_remove_flag(grid, LV_OBJ_FLAG_SCROLLABLE);
// The arrow keys move between the tiles in rows and columns
lvgl_grid_navigation_add(grid);
// Resolves the grid's flex_grow height, which the page size is derived from.
lv_obj_update_layout(parent);

View File

@ -1,5 +1,4 @@
#include <Tactility/app/fileselection/FileSelection.h>
#include <Tactility/app/selectiondialog/SelectionDialog.h>
#include <Tactility/file/File.h>
#include <Tactility/lvgl/Fonts.h>
#include <Tactility/lvgl/Lvgl.h>
@ -74,14 +73,6 @@ constexpr NamedColor PALETTE_COLORS[] = {
{ "Grey", LV_PALETTE_GREY },
};
constexpr size_t COLOR_COUNT = 3;
constexpr const char* COLOR_TITLES[COLOR_COUNT] = { "Primary color", "Secondary color", "Error color" };
struct ColorRowWidgets {
lv_obj_t* row = nullptr;
lv_obj_t* swatch = nullptr;
};
struct FontRowWidgets {
lv_obj_t* defaultButton = nullptr;
lv_obj_t* fileLabel = nullptr;
@ -93,7 +84,6 @@ struct Context {
TaskEventGroup* eventGroup = nullptr;
uint32_t selectRegularBit = 0;
uint32_t selectMonoBit = 0;
uint32_t selectColorBit = 0;
uint32_t applyBit = 0;
uint32_t cacheUpdatedBit = 0;
@ -111,9 +101,6 @@ struct Context {
std::atomic<bool> cacheUpdateSucceeded = false;
uint32_t selectLaunchId = 0;
/** The colour that the selection dialog is for */
size_t selectColorIndex = 0;
uint32_t colorSelectLaunchId = 0;
FontSlot selectSlot = FontSlot::Regular;
AppStream selectStream {};
uint8_t selectBuffer[256] {};
@ -128,7 +115,7 @@ struct Context {
lv_obj_t* darkChip = nullptr;
lv_obj_t* regularThemeChip = nullptr;
lv_obj_t* monoThemeChip = nullptr;
ColorRowWidgets colorRows[COLOR_COUNT];
lv_obj_t* colorRows[3] = {};
/** The display can only show the mono theme */
bool isMonoDisplay = false;
};
@ -196,8 +183,6 @@ void setChecked(lv_obj_t* object, bool checked) {
}
}
void updateColorRow(Context* ctx, size_t index);
void updateThemeWidgets(Context* ctx) {
const bool dark = isDark(ctx->pendingSettings);
setChecked(ctx->lightChip, !dark);
@ -207,10 +192,9 @@ void updateThemeWidgets(Context* ctx) {
setChecked(ctx->monoThemeChip, ctx->pendingSettings.monoTheme);
}
// The mono theme doesn't use colours
for (size_t i = 0; i < COLOR_COUNT; i++) {
if (ctx->colorRows[i].row != nullptr) {
setHidden(ctx->colorRows[i].row, ctx->pendingSettings.monoTheme);
updateColorRow(ctx, i);
for (auto* row : ctx->colorRows) {
if (row != nullptr) {
setHidden(row, ctx->pendingSettings.monoTheme);
}
}
}
@ -272,35 +256,18 @@ uint32_t getPaletteColor(lv_palette_t palette) {
constexpr size_t PALETTE_COLOR_COUNT = sizeof(PALETTE_COLORS) / sizeof(PALETTE_COLORS[0]);
std::optional<uint32_t>& getColor(settings::appearance::AppearanceSettings& settings, size_t index) {
switch (index) {
case 0:
return settings.primaryColor;
case 1:
return settings.secondaryColor;
default:
return settings.errorColor;
}
}
uint32_t getDefaultColor(size_t index) {
LvglThemeSettings defaults;
lvgl_theme_get_default_settings(&defaults);
const lv_color_t colors[COLOR_COUNT] = { defaults.color_primary, defaults.color_secondary, defaults.color_error };
return lv_color_to_u32(colors[index]) & 0xFFFFFF;
}
void updateColorRow(Context* ctx, size_t index) {
const auto& widgets = ctx->colorRows[index];
const auto& color = getColor(ctx->pendingSettings, index);
lv_obj_set_style_bg_color(widgets.swatch, lv_color_hex(color.value_or(getDefaultColor(index))), LV_STATE_DEFAULT);
}
void onColorButtonPressed(lv_event_t* event) {
void onColorChanged(lv_event_t* event) {
auto* ctx = static_cast<Context*>(lv_event_get_user_data(event));
auto* button = static_cast<lv_obj_t*>(lv_event_get_target(event));
ctx->selectColorIndex = reinterpret_cast<uintptr_t>(lv_obj_get_user_data(button));
task_event_group_signal(ctx->eventGroup, ctx->selectColorBit);
auto* dropdown = static_cast<lv_obj_t*>(lv_event_get_target(event));
auto* color = static_cast<std::optional<uint32_t>*>(lv_obj_get_user_data(dropdown));
const uint32_t selected = lv_dropdown_get_selected(dropdown);
if (selected == 0) {
color->reset();
} else if (selected <= PALETTE_COLOR_COUNT) {
*color = getPaletteColor(PALETTE_COLORS[selected - 1].palette);
}
// Any other option is the custom colour from the settings file, which stays unchanged
updateWidgets(ctx);
}
void onBackPressed(lv_event_t* event) {
@ -406,32 +373,29 @@ lv_obj_t* createChip(lv_obj_t* parent, const char* text, lv_event_cb_t callback,
return chip;
}
ColorRowWidgets createColorRow(lv_obj_t* parent, size_t index, Context* ctx) {
ColorRowWidgets widgets;
// "Title [swatch] [Change]"
widgets.row = createLabeledRow(parent, COLOR_TITLES[index]);
lv_obj_t* createColorRow(lv_obj_t* parent, const char* text, std::optional<uint32_t>* color, Context* ctx) {
auto* row = createLabeledRow(parent, text);
auto* dropdown = lv_dropdown_create(row);
// The colour preview: its colour is the setting, its border uses the theme's text colour
widgets.swatch = lv_obj_create(widgets.row);
lv_obj_remove_style_all(widgets.swatch);
lv_obj_remove_flag(widgets.swatch, LV_OBJ_FLAG_SCROLLABLE);
lv_obj_remove_flag(widgets.swatch, LV_OBJ_FLAG_CLICKABLE);
lv_obj_set_style_bg_opa(widgets.swatch, LV_OPA_COVER, LV_STATE_DEFAULT);
lv_obj_set_style_border_width(widgets.swatch, 1, LV_STATE_DEFAULT);
lv_obj_set_style_border_color(widgets.swatch, lv_obj_get_style_text_color(widgets.swatch, LV_PART_MAIN), LV_STATE_DEFAULT);
lv_obj_set_style_radius(widgets.swatch, LV_DPX(4), LV_STATE_DEFAULT);
auto* button = lv_button_create(widgets.row);
auto* button_label = lv_label_create(button);
lv_label_set_text(button_label, "Change");
lv_obj_set_user_data(button, reinterpret_cast<void*>(static_cast<uintptr_t>(index)));
lv_obj_add_event_cb(button, onColorButtonPressed, LV_EVENT_SHORT_CLICKED, ctx);
// As high as the button
lv_obj_update_layout(button);
const int32_t swatch_size = lv_obj_get_height(button);
lv_obj_set_size(widgets.swatch, swatch_size, swatch_size);
return widgets;
std::string options = "Default";
uint32_t selected = 0;
for (size_t i = 0; i < PALETTE_COLOR_COUNT; i++) {
options += "\n";
options += PALETTE_COLORS[i].name;
if (color->has_value() && **color == getPaletteColor(PALETTE_COLORS[i].palette)) {
selected = i + 1;
}
}
// A colour that isn't in the palette was set in the settings file
if (color->has_value() && selected == 0) {
options += "\nCustom";
selected = PALETTE_COLOR_COUNT + 1;
}
lv_dropdown_set_options(dropdown, options.c_str());
lv_dropdown_set_selected(dropdown, selected);
lv_obj_set_user_data(dropdown, color);
lv_obj_add_event_cb(dropdown, onColorChanged, LV_EVENT_VALUE_CHANGED, ctx);
return row;
}
void createThemeCard(lv_obj_t* parent, Context* ctx) {
@ -454,9 +418,9 @@ void createThemeCard(lv_obj_t* parent, Context* ctx) {
lv_obj_add_event_cb(animations_checkbox, onAnimationsChanged, LV_EVENT_VALUE_CHANGED, ctx);
if (!ctx->isMonoDisplay) {
for (size_t i = 0; i < COLOR_COUNT; i++) {
ctx->colorRows[i] = createColorRow(card, i, ctx);
}
ctx->colorRows[0] = createColorRow(card, "Primary color", &ctx->pendingSettings.primaryColor, ctx);
ctx->colorRows[1] = createColorRow(card, "Secondary color", &ctx->pendingSettings.secondaryColor, ctx);
ctx->colorRows[2] = createColorRow(card, "Error color", &ctx->pendingSettings.errorColor, ctx);
}
}
@ -557,8 +521,8 @@ void destroyWidgets(void* userData) {
ctx->darkChip = nullptr;
ctx->regularThemeChip = nullptr;
ctx->monoThemeChip = nullptr;
for (auto& row : ctx->colorRows) {
row = {};
for (auto*& row : ctx->colorRows) {
row = nullptr;
}
}
@ -667,37 +631,6 @@ void startFileSelection(Context* ctx, FontSlot slot) {
ctx->selectLaunchId = fileselection::startForExistingFile(ctx->appInstanceId, ctx->selectStream, ctx->selectBuffer, sizeof(ctx->selectBuffer), ctx->eventGroup);
}
void startColorSelection(Context* ctx) {
if (ctx->colorSelectLaunchId != 0 || ctx->applying) {
return;
}
std::vector<std::string> items;
items.reserve(PALETTE_COLOR_COUNT + 1);
items.emplace_back("Default");
for (const auto& named_color : PALETTE_COLORS) {
items.emplace_back(named_color.name);
}
ctx->colorSelectLaunchId = selectiondialog::start(ctx->appInstanceId, COLOR_TITLES[ctx->selectColorIndex], items);
}
void onColorSelectionResult(Context* ctx, const AppEvent& event) {
ctx->colorSelectLaunchId = 0;
// Index 0 is "Default", the others are the palette colours. Other results mean that the dialog was dismissed.
const int32_t selected = event.result.result;
if (selected >= 0 && selected <= static_cast<int32_t>(PALETTE_COLOR_COUNT)) {
lvgl_lock();
auto& color = getColor(ctx->pendingSettings, ctx->selectColorIndex);
if (selected == 0) {
color.reset();
} else {
color = getPaletteColor(PALETTE_COLORS[selected - 1].palette);
}
updateWidgets(ctx);
lvgl_unlock();
}
app_manager_stop(event.result.launch_id);
}
void onFileSelectionResult(Context* ctx, const AppEvent& event) {
ctx->selectLaunchId = 0;
if (event.result.result == 0 /* Ok */) {
@ -732,7 +665,6 @@ int32_t appMain(int argc, char* argv[]) {
ctx.eventGroup = &event_group;
check(task_event_group_claim_bit(&event_group, &ctx.selectRegularBit) == ERROR_NONE);
check(task_event_group_claim_bit(&event_group, &ctx.selectMonoBit) == ERROR_NONE);
check(task_event_group_claim_bit(&event_group, &ctx.selectColorBit) == ERROR_NONE);
check(task_event_group_claim_bit(&event_group, &ctx.applyBit) == ERROR_NONE);
check(task_event_group_claim_bit(&event_group, &ctx.cacheUpdatedBit) == ERROR_NONE);
@ -752,9 +684,6 @@ int32_t appMain(int argc, char* argv[]) {
if (flags & ctx.selectMonoBit) {
startFileSelection(&ctx, FontSlot::Mono);
}
if (flags & ctx.selectColorBit) {
startColorSelection(&ctx);
}
if (flags & ctx.applyBit) {
startApply(&ctx);
}
@ -768,8 +697,6 @@ int32_t appMain(int argc, char* argv[]) {
should_close = true;
} else if (event.type == APP_EVENT_RESULT && event.result.launch_id == ctx.selectLaunchId) {
onFileSelectionResult(&ctx, event);
} else if (event.type == APP_EVENT_RESULT && event.result.launch_id == ctx.colorSelectLaunchId) {
onColorSelectionResult(&ctx, event);
}
}
}

View File

@ -9,9 +9,7 @@
#include <lvgl.h>
#include <lvgl/icons/launcher.h>
#include <lvgl/fonts.h>
#include <lvgl/grid_navigation.h>
#include <lvgl/lvgl.h>
#include <lvgl/theme.h>
#include <lvgl/widgets/icon_button.h>
#include <lvgl_window_manager/window_manager.h>
@ -153,14 +151,10 @@ void createWidgets(lv_obj_t* parent, void*) {
}
// The app list is the main action, so it stands out more than the others
// Filled buttons would be solid black blocks with the monochrome theme
const auto variant = lvgl_theme_is_mono() ? LVGL_ICON_BUTTON_STANDARD : LVGL_ICON_BUTTON_FILLED;
auto* app_list_button = createAppButton(buttons_wrapper, variant, LVGL_ICON_LAUNCHER_APPS, "tactility.applist");
createAppButton(buttons_wrapper, variant, LVGL_ICON_LAUNCHER_FOLDER, "tactility.files");
createAppButton(buttons_wrapper, variant, LVGL_ICON_LAUNCHER_SETTINGS, "tactility.settings");
auto* app_list_button = createAppButton(buttons_wrapper, LVGL_ICON_BUTTON_FILLED, LVGL_ICON_LAUNCHER_APPS, "tactility.applist");
createAppButton(buttons_wrapper, LVGL_ICON_BUTTON_FILLED, LVGL_ICON_LAUNCHER_FOLDER, "tactility.files");
createAppButton(buttons_wrapper, LVGL_ICON_BUTTON_FILLED, LVGL_ICON_LAUNCHER_SETTINGS, "tactility.settings");
applyButtonMargins(buttons_wrapper, is_landscape_display);
// The arrow keys move between the buttons, in a row or a column
lvgl_grid_navigation_add(buttons_wrapper);
// The launcher's container is several levels below the screen, and LVGL only sends
// LV_EVENT_SIZE_CHANGED to the screen object itself on a resolution change - so the
@ -185,8 +179,8 @@ void createWidgets(lv_obj_t* parent, void*) {
// an extra time.
if (!device_has_active_by_type(&POINTER_TYPE)) {
// lv_obj_update_layout(parent); // Resolve flex layout first, so focus/state invalidate against final coords
lv_group_focus_obj(buttons_wrapper);
lv_gridnav_set_focused(buttons_wrapper, app_list_button, LV_ANIM_OFF);
lv_group_focus_obj(app_list_button);
lv_obj_add_state(app_list_button, LV_STATE_FOCUS_KEY);
}
}

View File

@ -32,7 +32,7 @@ struct Context {
// The eventual appMain() return value - see AlertDialog.cpp's Context::result for why this
// is a plain (non-atomic) field safely shared between the LVGL thread (writer, before
// emitting APP_EVENT_CLOSE) and this dialog's own thread (reader, after waking from it).
int32_t result = -2; // Cancelled - safety-net default if closed without selecting an item
int32_t result = 1; // Cancelled - safety-net default if closed without selecting an item
};
struct ItemContext {

View File

@ -30,25 +30,11 @@ static std::optional<uint32_t> parseColor(const std::map<std::string, std::strin
return static_cast<uint32_t>(std::strtoul(entry->second.c_str(), nullptr, 16)) & 0xFFFFFF;
}
// Saving only updates the keys that are written, so an unset colour is written as an empty value
static void putColor(std::map<std::string, std::string>& map, const char* key, std::optional<uint32_t> color) {
if (color.has_value()) {
char text[8];
std::snprintf(text, sizeof(text), "%06" PRIX32, *color);
map[key] = text;
} else {
map[key] = "";
}
}
static const char* toString(ThemeMode mode) {
switch (mode) {
case ThemeMode::Light:
return "light";
case ThemeMode::Dark:
return "dark";
default:
return "default";
}
}
@ -117,7 +103,9 @@ bool save(const AppearanceSettings& settings) {
map[SETTINGS_KEY_FONT_SIZE] = std::to_string(settings.fontSize);
map[SETTINGS_KEY_REGULAR_FONT_PATH] = settings.regularFontPath;
map[SETTINGS_KEY_MONO_FONT_PATH] = settings.monoFontPath;
map[SETTINGS_KEY_THEME_MODE] = toString(settings.themeMode);
if (settings.themeMode != ThemeMode::DeviceDefault) {
map[SETTINGS_KEY_THEME_MODE] = settings.themeMode == ThemeMode::Dark ? "dark" : "light";
}
map[SETTINGS_KEY_MONO_THEME] = settings.monoTheme ? "true" : "false";
map[SETTINGS_KEY_ANIMATIONS] = settings.animationsEnabled ? "true" : "false";
putColor(map, SETTINGS_KEY_PRIMARY_COLOR, settings.primaryColor);

View File

@ -30,10 +30,6 @@ typedef enum {
CODEPOINT_ARROW_DOWN = 0x2193,
CODEPOINT_HOME = 0x21F1,
CODEPOINT_END = 0x21F2,
/** Moves the focus to the next widget, for devices that can only step through widgets (e.g. an encoder wheel) */
CODEPOINT_FOCUS_NEXT = 0x21E5,
/** Moves the focus to the previous widget, for devices that can only step through widgets (e.g. an encoder wheel) */
CODEPOINT_FOCUS_PREVIOUS = 0x21E4,
} CodePoint;
/**

View File

@ -292,13 +292,20 @@ def write_lvgl_variables(output_file, device_properties: dict):
has_statusbar_colors_inverted = get_boolean_property_or_false(device_properties, "lvgl.statusbarColorsInverted")
if has_statusbar_colors_inverted:
output_file.write("CONFIG_TT_LVGL_STATUSBAR_COLORS_INVERTED=y\n")
# Tactility uses its own themes (Modules/lvgl-module), and lvgl.theme only selects the default light or dark mode
theme = get_property_or_default(device_properties, "lvgl.theme", "DefaultDark")
if theme not in ("DefaultDark", "DefaultLight", "Mono"):
if theme == "DefaultDark":
output_file.write("CONFIG_LV_THEME_DEFAULT_DARK=y\n")
elif theme == "DefaultLight":
output_file.write("CONFIG_LV_THEME_DEFAULT_LIGHT=y\n")
elif theme == "Mono":
output_file.write("CONFIG_LV_USE_THEME_MONO=y\n")
# LVGL selects the theme with #if LV_USE_THEME_DEFAULT / #elif LV_USE_THEME_SIMPLE /
# #elif LV_USE_THEME_MONO, and the Kconfig defaults enable DEFAULT+SIMPLE for any
# non-1bpp color depth so MONO only takes effect once those are disabled.
output_file.write("CONFIG_LV_USE_THEME_DEFAULT=n\n")
output_file.write("CONFIG_LV_USE_THEME_SIMPLE=n\n")
else:
exit_with_error(f"Unknown theme: {theme}")
output_file.write("CONFIG_LV_USE_THEME_DEFAULT=n\n")
output_file.write("CONFIG_LV_USE_THEME_SIMPLE=n\n")
output_file.write("CONFIG_LV_USE_THEME_MONO=n\n")
font_size_text = get_property_or_none(device_properties, "font.defaultSize")
if font_size_text is None:
font_size_text = get_property_or_default(device_properties, "lvgl.fontSize", "14")

View File

@ -557,13 +557,22 @@
* THEMES
*==================*/
/*Tactility uses its own themes (Modules/lvgl-module), so LVGL's themes are disabled*/
/*A simple, impressive and very complete theme*/
#define LV_USE_THEME_DEFAULT 0
#define LV_USE_THEME_DEFAULT 1
#if LV_USE_THEME_DEFAULT
/*0: Light mode; 1: Dark mode*/
#define LV_THEME_DEFAULT_DARK 1
/*1: Enable grow on press*/
#define LV_THEME_DEFAULT_GROW 1
/*Default transition time in [ms]*/
#define LV_THEME_DEFAULT_TRANSITION_TIME 80
#endif /*LV_USE_THEME_DEFAULT*/
/*A very simple theme that is a good starting point for a custom theme*/
#define LV_USE_THEME_SIMPLE 0
#define LV_USE_THEME_SIMPLE 1
/*A theme designed for monochrome displays*/
#define LV_USE_THEME_MONO 0
@ -773,7 +782,7 @@
#define LV_USE_MONKEY 0
/*1: Enable grid navigation*/
#define LV_USE_GRIDNAV 1
#define LV_USE_GRIDNAV 0
/*1: Enable lv_obj fragment*/
#define LV_USE_FRAGMENT 0