Can't get my simple screen to update once loaded

How-to
,
1

Description

Hi all, I have just started using Squareline and LVGL and failing at just updating the screen every 500ms to increment an arc/silder. not sure what im missing but I have the screen displaying the initial image(below) and not doing anything else. I know the program isnt frozen as I output via serial which still works.

Chipset: ESP32-S3 (FN8) (Custom Board)

LVGL version: 8.3.6

Task: I want to move an arc by 1 every 500ms and reset back to 1 at 100.

So Far Achieved: I have used the simple demo ui from Squareline and adjusted some minor bits.

Code to reproduce:

#include <Arduino.h>
#include <TFT_eSPI.h>
#include <SPI.h>

#define USE_UI          //if you want to use the ui export from Squareline ,pleease define USE_UI.
#include <lvgl.h>
#include "ui.h"

static const uint16_t screenWidth  = 240;
static const uint16_t screenHeight = 320;


TFT_eSPI lcd = TFT_eSPI(); /* TFT entity */

static lv_disp_draw_buf_t draw_buf;
static lv_color_t buf1[ screenWidth * screenHeight / 13 ];

//_______________________
/* display flash */
void my_disp_flush( lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p )
{
  uint32_t w = ( area->x2 - area->x1 + 1 );
  uint32_t h = ( area->y2 - area->y1 + 1 );

  lcd.startWrite();
  lcd.setAddrWindow( area->x1, area->y1, w, h );
  lcd.pushColors( ( uint16_t * )&color_p->full, w * h, true );
  lcd.endWrite();

  lv_disp_flush_ready( disp );
}


void setup()
{
  Serial.begin( 115200 ); /*serial init */
  delay(2000);
  //LCD init
  lcd.begin();          
  lcd.setRotation(2); 
  lcd.fillScreen(TFT_BLACK);
  delay(100);
  //background light pin
  pinMode(13, OUTPUT);
  digitalWrite(13, HIGH);

  //lvgl init
  lv_init();
  
  lv_disp_draw_buf_init( &draw_buf, buf1, NULL, screenWidth * screenHeight / 13 );

  /*Display init*/
  static lv_disp_drv_t disp_drv;
  lv_disp_drv_init( &disp_drv );
  /*Display driver port of LVGL*/
  disp_drv.hor_res = screenWidth;
  disp_drv.ver_res = screenHeight;
  disp_drv.flush_cb = my_disp_flush;
  disp_drv.draw_buf = &draw_buf;
  lv_disp_drv_register( &disp_drv );

  ui_init();        //LVGL UI init
  Serial.println( "Setup done" );
}


void loop()
{
  static int16_t counter = 1;
  counter++;
  lv_arc_set_value(ui_Arc1, counter);
  lv_event_send(ui_Arc1, LV_EVENT_VALUE_CHANGED, 0);
  counter %=100;
  delay(500);
  Serial.println(".");
  lv_timer_handler();

  
}

Screenshot

tempImagepnefII
tempImagepnefII1920×2560 1.07 MB

2

You missunderstand how loop works with lvgl. If you require some control every 500 ms you need timed event not block loop.
Right loops is in many examples , but for your :slight_smile:

void loop()
{
  static int16_t counter = 1;
  counter++;
  delay(5);
  lv_timer_handler();
 if((counter%100) == 0) {
    lv_arc_set_value(ui_Arc1, counter/100); //exist too with anim and use other val no counter here
  }
}
3

You can try to use buil-in animation. See loader-with-arc example.

4

Hi thanks, I tried this exactly and still have the same issue. Its like the first image loads and nothing else afterwards.

5

Figured it out! In lv_conf.h I needed to set #define LV_TICK_CUSTOM 0 to #define LV_TICK_CUSTOM 1