Why is there an offset in what I see in SLS and on the ESP32S3 display

What do you want to achieve?

A simple replica of what I see on the UI design page in SquareLine Studio on my display board.

I have built a simple UI to illustrate clearly what is going on with SLS. I just cannot get the output to replicate what I see in SLS, actually on the display board.

What have you tried so far?

I have built a demo UI to show the issue: it contains a single screen with a blue border, labels at the top left, top right, centre, bottom left and bottom right. However, when I export the template and UI, then compile and upload this in Arduino2, the result does not match what I see in SLS. There is a peculiar offset in the layout and the top part of the display is not showing on screen, and the bottom part of the design does not extend to the bottom of the actual display. It is as if there is an actual vertical offset (in this configuration) thus the contents of the display buffer are not being forced into correct area of the display - well, that’s how I see it!

The offset x and offset y parameters in Project Settings are both set to 0; I have also tried amending these values but they appear to do nothing with the resulting layout, so I am not sure how or where they are used in the SLS generated code.

The screenshot shows on the top - what I see in the design page of SLS, and on the bottom - what I see on my display board. For some reason, that I have been pulling my hair out (what little of it I have left lol) all day, I cannot for the life of me figure out why this is happening!

I suspect it is one of those simple things that I just can’t seem to put my fingers on.

Could someone please give me some pointers, so I can get this wonderful app up and running.

  • SquareLine Studio version: 1.2.1
  • Operating system: MacOSx
  • Target hardware: LilyGo T-Display ESP32S3

I think it’s not related to SLS or LVGL but rather a display driver issue.

What happens if you comment out ui_init() and call lv_obj_set_style_bg_color(lv_scr_act(), lv_color_hex(0xff0000), 0); instead. You should see the whole screen in red.

If you still see the issue, then it’s really related to the display driver.

Thanks for the reply. Yes, I see the same issue, I do not see red covering the entire screen.

However, when I load, compile and upload the watch/weather/chat example file, it works perfectly and I see the output covering the entire screen.

Weird eh…?

Any suggestions?

Ooooh… check this @kisgvegabor

I changed the SLS file to be portrait orientation, amending the rotation to90deg, re-exported the template and UI files, loaded this into Arduino IDE, compiled and uploaded - and would you look at this…

I wonder what I should do here. Is this something I need to report to LilyGo or is it something I can continue to investigate with you guys?

Interesting eh…?

For anyone else who may be using one of the LilyGo T-Display boards, I have managed to find a workaround, and have reported my findings on to the team at SLS.

Here’s what I did to fix it and get the code filling the entire screen…

I managed to get it working with both the SLS clock/weather/chat example script and my demo script, and the change I made was as follows;

Line 18 in the ui.ino file

TFT_eSPI tft = TFT_eSPI( screenWidth, screenHeight ); /* TFT instance */

Remove the variables contained inside the parenthesis…

TFT_eSPI tft = TFT_eSPI(); /* TFT instance */

… and it all works fine


Sorry for the late reply. It’s very interesting that it solved the issue. Anyway, that you for letting us know.

I’ve contacted LilyGo but no answer so far. :frowning:

Their products are surprisingly good it must be said, but their support is sorely lacking.

I did however manage to get someone to contact me via email after reporting an issue to them on WhatsApp - I am in the UK. You might want to try that route :slight_smile:

On another matter, I appear to be having loads of issues with SLS, even when designing very simple UI’s… takes such a long time to look into and resolve that I am considering the possibility of giving up on it for the time being. Shame, as it is an excellent UI designer product that fits in perfectly with what I am attempting.

1 Like

Sorry to hear that. :frowning: In order to better understand the main pain points of the users, could you summarize what are the major problems in your case? This we could understand better what causes issues for the users and prioritize these things.

Sure… before I do, would you like me to reply here or in a separate new thread…?

For the sake of clarity please open a new topic for it.

Will do.

I am in UK and I’ve been coding much of the day, so I will dive back into SLS and lvgl tomorrow and will report findings in a new thread. Apologies, I don’t mean to come across as negative, but I have had a bit of a mare with SLS and I sooooooo wanted it to work as it would suit what I am currently manually coding for just perfectly.

Also… I would say to actually persevere with them as the boards they produce, especially the T-Display boards that are 320*170 resolution are pretty nifty ESP32S3 development boards. I now own three of them, a T-Display, a T-Display Touch version and a T-Embed versions (with built in rotary controller) - and will certainly be buying more. They appear to be fast becoming very popular so to have these added as part of the default base functionality within SLS would be beneficial to you I should imagine.

Apologies about the 3rd reply here, but I have spent several hours having another go, and so instead of opening a new thread to write up any issues encountered on the way, I will instead open a new thread suggesting how to overcome any issues. :slight_smile:

I managed to figure things out, so it might help other users of the lilyGo T-Display boards be able to use SquareLine Studio.

How’s that :slight_smile:

I understand that it’s frustrating if something is not working. Thank you for keep trying and posting your findings.

I’d be curios if the issues are related to SquareLine itself or making the LilyGo board working with LVGL (or in general).

No problem - and I have managed to resolve the issues which were not related to Squareline but moreover with a specific TFT_eSPI library and the LilyGo T-Display boards themselves. I posted a little tutorial here on the forum to outline how to get them working.

Hope this helps.

1 Like