Description
I’m trying to code a Magic the gathering life counter. I currently have already created both counters and they are working fine on the screen. The issue is, I need one of them to be flipped horizontally and vertically (I could flip the label order since the symbols are symmetric but I couldn’t flip the label itself).
What MCU/Processor/Board and compiler are you using?
I’m using a ESP32 on a custom TFT w/ touch board. Just a regular ESP32 with stuff already added to it.
What LVGL version are you using?
lib_deps =
tamctec/TAMC_GT911@^1.0.2
lvgl/lvgl@^8.3.2
Wire
bodmer/TFT_eSPI@^2.4.79
What do you want to achieve?
Flip objects.
What have you tried so far?
I have tried using the style transform angle without success.
Code to reproduce
Create counter fn:
lv_obj_t* createCounter(int initialValue, lv_obj_t* parent)
{
auto root = lv_obj_create(parent);
static lv_coord_t col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
static lv_coord_t row_dsc[] = {LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
lv_obj_set_grid_dsc_array(root, col_dsc, row_dsc);
auto label = lv_label_create(root);
lv_label_set_text(label, String(initialValue).c_str());
lv_obj_set_style_text_font(label, &lv_font_montserrat_48, 0);
lv_obj_clear_flag(label, LV_OBJ_FLAG_CLICKABLE);
lv_obj_set_style_text_align(label, LV_TEXT_ALIGN_CENTER, 0);
lv_obj_set_grid_cell(label, LV_GRID_ALIGN_CENTER, 1, 1, LV_GRID_ALIGN_CENTER, 0, 1); //grid 1, 0
CounterData* counterData = new CounterData;
counterData->count = initialValue;
counterData->counter_label = label;
lv_obj_t * btn = lv_btn_create(root);
lv_obj_set_style_bg_img_src(btn, LV_SYMBOL_PLUS, 0);
lv_obj_add_event_cb(btn, lv_spinbox_increment_event_cb, LV_EVENT_ALL, NULL);
lv_obj_set_user_data(btn, counterData);
lv_obj_set_grid_cell(btn, LV_GRID_ALIGN_STRETCH, 2, 1, LV_GRID_ALIGN_STRETCH, 0, 1); //grid 2, 0
btn = lv_btn_create(root);
lv_obj_set_style_bg_img_src(btn, LV_SYMBOL_MINUS, 0);
lv_obj_add_event_cb(btn, lv_spinbox_decrement_event_cb, LV_EVENT_ALL, NULL);
lv_obj_set_user_data(btn, counterData);
lv_obj_set_grid_cell(btn, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_STRETCH, 0, 1); //grid 0, 0
return root;
}
Create screen fn:
void create2PlayerMtgScreen(int initialLife)
{
lv_obj_t* screen = lv_obj_create(NULL);
static lv_coord_t col_dsc[] = {LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
static lv_coord_t row_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
lv_obj_center(screen);
lv_obj_set_grid_dsc_array(screen, col_dsc, row_dsc);
lv_obj_t* counter = createCounter(initialLife, screen);
lv_obj_set_grid_cell(counter, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_STRETCH, 0, 1);
counter = createCounter(initialLife, screen);
lv_obj_set_grid_cell(counter, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
//lv_obj_set_style_transform_angle(counter, 180, 0);
lv_scr_load(screen);
}
#include <Arduino.h>
#include "ZLVGL/ZLVSetup.h" //these headers just setup the display and touch
#include "ZLVGL/ZLVPanel.h" //these headers just setup the display and touch
#include "ZLVGL/ZLVTouch.h" //these headers just setup the display and touch
#include "Counter/LifeCounter.h"
#include "Counter/TwoPlayerCounterScreen.h"
void setup()
{
ZLVSetupTouch(); //Just touch setup, this is working fine
ZLVCreatePanel(); //Just display setup, this is working fine
create2PlayerMtgScreen(40);
}
void loop()
{
lv_timer_handler();
delay( 5 );
}
Screenshot and/or video
Current result:
Desired result:
