Using a 320x320 4" ST7796 Display with Rotation issue #3611

frankcappelle · 2025-01-07T15:53:44Z

frankcappelle
Jan 7, 2025

I have a 320x320 SPI 4" display that works perfectly fine at setRotation(0) and setRotation(1). However, when rotated to 2 & 3, the screen just displays half the screen as if the origin has move 160 pix to the left. I carefully researched the st7796 datasheet and tried various changes to no avail. Tried different MX, MY, MV etc setting and still no joy. If I shift the image 160px to the right, I get the start of the coordinates, but still half a screen. In reading, I also tried TFT_eSPI tft = TFT_eSPI(320,320); to override the default xy dimensions.
Any assistance would be apprecistad. Thank you.

frankcappelle · 2025-01-07T16:01:07Z

frankcappelle
Jan 7, 2025
Author

I should also point out with the images uploaded, rotation 2 & 3 images show a residual image of the previous image because of the memory? latency of the tft. If I completely powered down between rotation settings, the (bad) half of the screen would be black & white gibberish.

0 replies

AnRich26 · 2025-01-09T08:18:05Z

AnRich26
Jan 9, 2025

A while back i had almost the same isue, i had a display witch was seported but not the pixel size. Eventially after playing around and this might yust help you as it help me. In User_Setup.h whear the screen pixel sizes are defined:

#define TFT_WIDTH
#define TFT_HIGHT

Comment out those lines and add new lines thear with your screen hight and width. On my display it worked and i am still using that same display within a project in my room. Hope that whil help

0 replies

frankcappelle · 2025-01-09T14:29:30Z

frankcappelle
Jan 9, 2025
Author

AnRich26,
Thank you for your suggestion but still no joy. Seems like the whole screen and screen memory is shifted to the left. I tried your suggestion, along with setting the origin to 0,0; 160,0; etc. The image that was visible shifted but still in the confines of the left half of the screen. It is as if it is drawing the unseen portion off screen and I'm just seeing the remainder.
It's very odd that the whole screen is visible in rotation 0 & 1. I'm now looking at the st7796_rotation.h file to see if any clues there.
If anyone else has an idea, it would be appreciated.
Thank you

Here's the link to the tft screen I'm using:
https://www.buydisplay.com/square-3-92-inch-320x320-ips-tft-lcd-display-spi-interface?srsltid=AfmBOooM7b7KiPVdMyOwgpHNhkW7czOeTVEPj1_B8XttgH5tPGVgYccI

1 reply

AnRich26 Jan 10, 2025

In TFT_DRIVERS folder edit ST7796_defines.h
Change:

#ifndef TFT_WIDTH
#define TFT_WIDTH  320
#endif

#ifndef TFT_HEIGHT
#define TFT_HEIGHT 480
#endif

To:

#ifndef TFT_WIDTH
#define TFT_WIDTH  320
#endif

#ifndef TFT_HEIGHT
#define TFT_HEIGHT 320
#endif

That part is in control of display pixel size management and rotation for the display. If that dosent work then i am out of ideas, have gone thrue all the files. I am using also ST7796 display but 480x320 pixels, if i tell the driver that my display changed to 320x320 i still get picture no ofset and rotation works, maby its got something to do with how the driver talks to display. You can always look for same driver and compare the 2 structures, maybe yust line of code somewear that is giving you offset.

frankcappelle · 2025-01-09T19:31:16Z

frankcappelle
Jan 9, 2025
Author

Thanks to a hint from AnRich26, zi started to look at screen pixel size. I figured that somehow the screen was being shifted left. After much much trial and error, I came up with a solution, but the cause still evades me.
I set:
TFT_eSPI tft = TFT_eSPI(480,320);
Then I shifted the origin to the right by 160 pixels:
tft.setOrigin(160,0);
Now in rotation 3, everything appears properly and centered. Still some other positioning issues to deal with, like adding an offset of 160 to every x position so that it appears properly on the screen.
A work-around at best.

I guess the st7796 driver sees it as a 480x320 display. Is this wasting memory.. I don't know.

To make rotation 2 work, I set:
TFT_eSPI tft = TFT_eSPI(320,480);
and
tft.setOrigin(0,160);
then add the 160px offset to Y.

I think I can make this work for me, but it's not fun!
Hope to find the right solution soon.
Thanks

ps: I do want to mention that I tried an example with LovyanGFX in various rotations and this problem did not exist. Very curious!

1 reply

AnRich26 Jan 10, 2025

What happens when you tel the driver instead of:

TFT_eSPI tft = TFT_eSPI(320,480)

You tell it:

TFT_eSPI tft = TFT_eSPI(320,320)

The display you are using is square so you need to tell the compiler to set the display pixel correct, at this momment it looks like it will off set everything and it comes down to the offset of the 160 pixels you talked about.

AnRich26 · 2025-01-10T10:53:55Z

AnRich26
Jan 10, 2025

On my display, code used:

// Include Librarys.
#include <Arduino.h>
#include <SPI.h>
#include <TFT_eSPI.h>

// Defines & Constants.
// Display Backlight.
#define BackLight 33
int Brightness = 100;

#define TFT_GREY 0x7BEF

TFT_eSPI myGLCD = TFT_eSPI();       // Invoke custom library

unsigned long runTime = 0;
void setup()
{
  randomSeed(analogRead(A0));
  // Serial Debug.
  Serial.begin(115200);
  // Wait For Serial Port To Connect. Needed For Native USB.
#ifndef ESP32
  while (!Serial);
#endif
  // Init Backlight.
  pinMode(BackLight, OUTPUT);
  /*
#if ESP_IDF_VERSION_MAJOR == 5
  ledcAttach(BackLight, 10000, 8);
  Serial.println("Ledc Idf 5!")
#else
  ledcSetup(0, 10000, 8);
  ledcAttachPin(BackLight, 0);
  Serial.println("Ledc Idf Lower Than 5!");
//#endif
  */
  digitalWrite(BackLight, HIGH);
  
  //ledcWrite(BackLight, Brightness);
  // Init Graphics Driver.
// Setup the LCD
  myGLCD.init();
  myGLCD.setRotation(1);
}

void loop()
{
  randomSeed(millis());
  //randomSeed(1234); // This ensure test is repeatable with exact same draws each loop
  int buf[318];
  int x, x2;
  int y, y2;
  int r;
  runTime = millis();
// Clear the screen and draw the frame
  myGLCD.fillScreen(TFT_BLACK);


  myGLCD.fillRect(0, 0, 319, 14,TFT_RED);

  myGLCD.fillRect(0, 226, 319, 14,TFT_GREY);

  myGLCD.setTextColor(TFT_BLACK,TFT_RED);
  myGLCD.drawCentreString("* TFT_eSPI *", 160, 4, 1);
  myGLCD.setTextColor(TFT_YELLOW,TFT_GREY);
  myGLCD.drawCentreString("Adapted by Bodmer", 160, 228,1);

  myGLCD.drawRect(0, 14, 319, 211, TFT_BLUE);

// Draw crosshairs
  myGLCD.drawLine(159, 15, 159, 224,TFT_BLUE);
  myGLCD.drawLine(1, 119, 318, 119,TFT_BLUE);
  for (int i=9; i<310; i+=10)
    myGLCD.drawLine(i, 117, i, 121,TFT_BLUE);
  for (int i=19; i<220; i+=10)
    myGLCD.drawLine(157, i, 161, i,TFT_BLUE);

// Draw sin-, cos- and tan-lines  
  myGLCD.setTextColor(TFT_CYAN);
  myGLCD.drawString("Sin", 5, 15,2);
  for (int i=1; i<318; i++)
  {
    myGLCD.drawPixel(i,119+(sin(((i*1.13)*3.14)/180)*95),TFT_CYAN);
  }
  myGLCD.setTextColor(TFT_RED);
  myGLCD.drawString("Cos", 5, 30,2);
  for (int i=1; i<318; i++)
  {
    myGLCD.drawPixel(i,119+(cos(((i*1.13)*3.14)/180)*95),TFT_RED);
  }
  myGLCD.setTextColor(TFT_YELLOW);
  myGLCD.drawString("Tan", 5, 45,2);
  for (int i=1; i<318; i++)
  {
    myGLCD.drawPixel(i,119+(tan(((i*1.13)*3.14)/180)),TFT_YELLOW);
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  myGLCD.drawLine(159, 15, 159, 224,TFT_BLUE);
  myGLCD.drawLine(1, 119, 318, 119,TFT_BLUE);
int col = 0;
// Draw a moving sinewave
  x=1;
  for (int i=1; i<(317*20); i++) 
  {
    x++;
    if (x==318)
      x=1;
    if (i>318)
    {
      if ((x==159)||(buf[x-1]==119))
        col = TFT_BLUE;
      else
      myGLCD.drawPixel(x,buf[x-1],TFT_BLACK);
    }
    y=119+(sin(((i*1.1)*3.14)/180)*(90-(i / 100)));
    myGLCD.drawPixel(x,y,TFT_BLUE);
    buf[x-1]=y;
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some filled rectangles
  for (int i=1; i<6; i++)
  {
    switch (i)
    {
      case 1:
        col = TFT_MAGENTA;
        break;
      case 2:
        col = TFT_RED;
        break;
      case 3:
        col = TFT_GREEN;
        break;
      case 4:
        col = TFT_BLUE;
        break;
      case 5:
        col = TFT_YELLOW;
        break;
    }
    myGLCD.fillRect(70+(i*20), 30+(i*20), 60, 60,col);
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some filled, rounded rectangles
  for (int i=1; i<6; i++)
  {
    switch (i)
    {
      case 1:
        col = TFT_MAGENTA;
        break;
      case 2:
        col = TFT_RED;
        break;
      case 3:
        col = TFT_GREEN;
        break;
      case 4:
        col = TFT_BLUE;
        break;
      case 5:
        col = TFT_YELLOW;
        break;
    }
    myGLCD.fillRoundRect(190-(i*20), 30+(i*20), 60,60, 3,col);
  }
  
  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some filled circles
  for (int i=1; i<6; i++)
  {
    switch (i)
    {
      case 1:
        col = TFT_MAGENTA;
        break;
      case 2:
        col = TFT_RED;
        break;
      case 3:
        col = TFT_GREEN;
        break;
      case 4:
        col = TFT_BLUE;
        break;
      case 5:
        col = TFT_YELLOW;
        break;
    }
    myGLCD.fillCircle(100+(i*20),60+(i*20), 30,col);
  }
  
  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some lines in a pattern

  for (int i=15; i<224; i+=5)
  {
    myGLCD.drawLine(1, i, (i*1.44)-10, 223,TFT_RED);
  }

  for (int i=223; i>15; i-=5)
  {
    myGLCD.drawLine(317, i, (i*1.44)-11, 15,TFT_RED);
  }

  for (int i=223; i>15; i-=5)
  {
    myGLCD.drawLine(1, i, 331-(i*1.44), 15,TFT_CYAN);
  }

  for (int i=15; i<224; i+=5)
  {
    myGLCD.drawLine(317, i, 330-(i*1.44), 223,TFT_CYAN);
  }
  
  delay(0);


  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some random circles
  for (int i=0; i<100; i++)
  {
    x=32+random(256);
    y=45+random(146);
    r=random(30);
    myGLCD.drawCircle(x, y, r,random(0xFFFF));
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some random rectangles
  for (int i=0; i<100; i++)
  {
    x=2+random(316);
    y=16+random(207);
    x2=2+random(316);
    y2=16+random(207);
    if (x2<x) {
      r=x;x=x2;x2=r;
    }
    if (y2<y) {
      r=y;y=y2;y2=r;
    }
    myGLCD.drawRect(x, y, x2-x, y2-y,random(0xFFFF));
  }

  delay(0);


  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

// Draw some random rounded rectangles
  for (int i=0; i<100; i++)
  {
    x=2+random(316);
    y=16+random(207);
    x2=2+random(316);
    y2=16+random(207);
    // We need to get the width and height and do some window checking
    if (x2<x) {
      r=x;x=x2;x2=r;
    }
    if (y2<y) {
      r=y;y=y2;y2=r;
    }
    // We need a minimum size of 6
    if((x2-x)<6) x2=x+6;
    if((y2-y)<6) y2=y+6;
    myGLCD.drawRoundRect(x, y, x2-x,y2-y, 3,random(0xFFFF));
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

 //randomSeed(1234);
 int colour = 0;
 for (int i=0; i<100; i++)
  {
    x=2+random(316);
    y=16+random(209);
    x2=2+random(316);
    y2=16+random(209);
    colour=random(0xFFFF);
    myGLCD.drawLine(x, y, x2, y2,colour);
  }

  delay(0);

  myGLCD.fillRect(1,15,317,209,TFT_BLACK);

  // This test has been modified as it takes more time to calculate the random numbers
  // than to draw the pixels (3 seconds to produce 30,000 randoms)!
  for (int i=0; i<10000; i++)
  {
    myGLCD.drawPixel(2+random(316), 16+random(209),random(0xFFFF));
  }

  // Draw 10,000 pixels to fill a 100x100 pixel box
  // use the coords as the colour to produce the banding
  //byte i = 100;
  //while (i--) {
  //  byte j = 100;
  //  while (j--) myGLCD.drawPixel(i+110,j+70,i+j);
  //  //while (j--) myGLCD.drawPixel(i+110,j+70,0xFFFF);
  //}
  delay(0);

  myGLCD.fillScreen(TFT_BLUE);
  myGLCD.fillRoundRect(80, 70, 239-80,169-70, 3,TFT_RED);
  
  myGLCD.setTextColor(TFT_WHITE,TFT_RED);
  myGLCD.drawCentreString("That's it!", 160, 93,2);
  myGLCD.drawCentreString("Restarting in a", 160, 119,2);
  myGLCD.drawCentreString("few seconds...", 160, 132,2);

  runTime = millis()-runTime;
  myGLCD.setTextColor(TFT_GREEN,TFT_BLUE);
  myGLCD.drawCentreString("Runtime: (msecs)", 160, 210,2);
  myGLCD.setTextDatum(TC_DATUM);
  myGLCD.drawNumber(runTime, 160, 225,2);
  delay (5000);
}

I eddited ST7796_defines.h and changed:

#ifndef TFT_HEIGHT
#define TFT_HEIGHT 480
#endif

To:

#ifndef TFT_HEIGHT
#define TFT_HEIGHT 320
#endif

and shows its working with correct new settings.

0 replies

AnRich26 · 2025-01-10T10:55:39Z

AnRich26
Jan 10, 2025

20250110_124950.mp4

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Using a 320x320 4" ST7796 Display with Rotation issue #3611

{{title}}

Replies: 6 comments 2 replies

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{title}}

Select a reply

Using a 320x320 4" ST7796 Display with Rotation issue #3611

frankcappelle Jan 7, 2025

Replies: 6 comments · 2 replies

frankcappelle Jan 7, 2025 Author

AnRich26 Jan 9, 2025

frankcappelle Jan 9, 2025 Author

AnRich26 Jan 10, 2025

frankcappelle Jan 9, 2025 Author

AnRich26 Jan 10, 2025

AnRich26 Jan 10, 2025

AnRich26 Jan 10, 2025

frankcappelle
Jan 7, 2025

Replies: 6 comments 2 replies

frankcappelle
Jan 7, 2025
Author

AnRich26
Jan 9, 2025

frankcappelle
Jan 9, 2025
Author

frankcappelle
Jan 9, 2025
Author

AnRich26
Jan 10, 2025

AnRich26
Jan 10, 2025