please help with 2.8 Spi display ili9341

How can i add tft.fillScreen(BLACK); inside "if" in the loop without it filling the screen each loop.

i know it doesn't make sense but i hope that you understand what i'm asking for.

for example like if i want to but 2 buttons in the main screen and each button take me to a different screen.
that what i started working on.

led_btn.press(down && led_btn.contains(pixel_x, pixel_y));
RGB_btn.press(down && RGB_btn.contains(pixel_x, pixel_y));
if (led_btn.isPressed()) {
screen=1;}
if(screen==1){
tft.fillScreen(BLACK);
on_btn.drawButton(false);
off_btn.drawButton(false);
flickeron_btn.drawButton(false);
flickeroff_btn.drawButton(false);
on_btn.press(down && on_btn.contains(pixel_x, pixel_y));
off_btn.press(down && off_btn.contains(pixel_x, pixel_y));
flickeron_btn.press(down && flickeron_btn.contains(pixel_x, pixel_y));
flickeroff_btn.press(down && flickeroff_btn.contains(pixel_x, pixel_y));
if (on_btn.isPressed()) {
digitalWrite(LED, HIGH);
flag = 0;
}
if (off_btn.isPressed()) {
digitalWrite(LED, LOW);
flag = 0;
}
if (flickeron_btn.isPressed()) {
flag = 1;
}
if (flickeroff_btn.isPressed()) {
flag = 0;
}
if(flag == 1) {
digitalWrite(LED, HIGH);
delay(500);
digitalWrite(LED, LOW);
delay(500);
}
}

i think i should remove FillScreen from the loop but i dont know where to put it .

Please use the CODE button. Either copy-paste your whole sketch into the CODE window or attach the file.
And please use ctrl-T to format your code.

Have you bought a pencil yet?
Pencils are better than pens. You can erase a mistake and draw it again.

You can design what you want each screen to look like.
And what you want to do when a button is pressed.

It is your job to decide what you want to do.

David.

i have done writing the code i want it and i tested it in my screen and it works find.

but i need you to check if you can please.

Project #1.ino (5.58 KB)

I do not have RGB leds but your program seems to work ok.

You have probably noticed that update gets a little messy when you have a LOT of buttons.
I put the buttons in a list and use helper functions e.g.

extern bool update_button(Adafruit_GFX_Button *b, bool down);
extern bool update_button_list(Adafruit_GFX_Button **pb);
extern void draw_button_list(Adafruit_GFX_Button **pb);

These helper functions use pointers. You might find pointers difficult to understand.
But they certainly make your program logic easier to maintain.
I suggest that you try buttons with different shape and size.

#if 1
// INCLUDE FILES
#include <Adafruit_GFX.h>
#include <Adafruit_ILI9341.h>
#include <XPT2046_Touchscreen.h>

#define XPT_CS  3
#define XPT_IRQ 255       //ignore interrupt pin

//const int TS_BOT=3679,TS_TOP=347,TS_LEFT=258,TS_RT=3635;  //old 2.4"
const int TS_BOT = 374, TS_TOP = 3944, TS_LEFT = 3714, TS_RT = 251; //new 2.4"

#define BLACK    0x0000
#define BLUE     0x001F
#define RED      0xF800
#define GREEN    0x07E0
#define CYAN     0x07FF
#define MAGENTA  0xF81F
#define YELLOW   0xFFE0
#define WHITE    0xFFFF
#define redled   5
#define greenled 6
#define blueled  7
int flag = 0, screen = 0;
//  GLOBAL VARIABLES, CONSTRUCTORS
const int LED = A5;     //which pin for LED

Adafruit_ILI9341 tft(10, 9, 8);
XPT2046_Touchscreen ts(XPT_CS, XPT_IRQ);
Adafruit_GFX_Button on_btn, off_btn, flickeron_btn, flickeroff_btn, led_btn, RGB_btn, red_btn, green_btn, blue_btn, yellow_btn, purple_btn, aqua_btn, back_btn;
// easier to handle a list of button pointers
Adafruit_GFX_Button *screen0[] = {&led_btn, &RGB_btn, NULL };
Adafruit_GFX_Button *screen1[] = {&on_btn, &off_btn, &flickeron_btn, &flickeroff_btn, &back_btn, NULL };
Adafruit_GFX_Button *screen2[] = {&red_btn, &green_btn, &blue_btn, &yellow_btn, &purple_btn, &aqua_btn, &back_btn, NULL };

// TOUCH MADE AS SEPARATE GLOBAL FUNCTION
int pixel_x, pixel_y;   //make global

bool Touch_getXY(void)
{
    bool down = ts.touched();
    if (down) {         //XPT2046_Touchscreen can use hardware
        TS_Point p = ts.getPoint(); //XPT_2046_touchscreen wired for LANDSCAPE
        pixel_x = map(p.x, TS_LEFT, TS_RT, 0, tft.width());
        pixel_y = map(p.y, TS_TOP, TS_BOT, 0, tft.height());
        //        tft.drawPixel(pixel_x, pixel_y, WHITE);
    }
    return down;
}

// FORWARD DECLARATIONS because IDE sometimes misses them 
extern void setColor(int red, int green, int blue);
extern bool update_button(Adafruit_GFX_Button *b, bool down);
extern bool update_button_list(Adafruit_GFX_Button **pb);
extern void draw_button_list(Adafruit_GFX_Button **pb);

// INITIALISE GPIO, TOUCH, TFT, BUTTONS
void setup(void)
{
    pinMode(A4, OUTPUT);
    digitalWrite(A4, LOW);     //so that an LED fits between A4, A5
    pinMode(LED, OUTPUT);
    digitalWrite(LED, LOW);
    pinMode(redled, OUTPUT);
    pinMode(greenled, OUTPUT);
    pinMode(blueled, OUTPUT);
    ts.begin();
    tft.begin();
    tft.setRotation(1);     //LANDSCAPE
    on_btn.initButton(&tft,  80, 40, 120, 40, WHITE, GREEN, BLACK, "ON", 2);
    off_btn.initButton(&tft, 240, 40, 120, 40, WHITE, RED, BLACK, "OFF", 2);
    flickeron_btn.initButton(&tft,  80, 160, 120, 40, WHITE, GREEN, BLACK, "flickerON", 2);
    flickeroff_btn.initButton(&tft, 240, 160, 120, 40, WHITE, RED, BLACK, "flickerOFF", 2);
    led_btn.initButton(&tft,  80, 120, 120, 40, BLACK, WHITE, BLACK, "LED", 2);
    RGB_btn.initButton(&tft, 240, 120, 120, 40, BLACK, WHITE, BLACK, "RGB", 2);
    red_btn.initButton(&tft,  80, 40, 120, 40, WHITE, RED, BLACK, "RED", 2);
    green_btn.initButton(&tft, 240, 40, 120, 40, WHITE, GREEN, BLACK, "GREEN", 2);
    blue_btn.initButton(&tft,  80, 100, 120, 40, WHITE, BLUE, BLACK, "BLUE", 2);
    yellow_btn.initButton(&tft, 240, 100, 120, 40, WHITE, YELLOW, BLACK, "YELLOW", 2);
    purple_btn.initButton(&tft,  80, 160, 120, 40, WHITE, MAGENTA, BLACK, "PURPLE", 2);
    aqua_btn.initButton(&tft, 240, 160, 120, 40, WHITE, CYAN, BLACK, "AQUA", 2);
    back_btn.initButton(&tft, 160, 220, 120, 40, BLACK, WHITE, BLACK, "BACK", 2);
    tft.fillScreen(BLACK);
    led_btn.drawButton(false);
    RGB_btn.drawButton(false);
}

void loop(void)
{
    // READ TOUCH
    if (screen == 0) {
        update_button_list(screen0);  //process all buttons
        if (led_btn.justPressed()) {
            screen = 1;
            draw_button_list(screen1);
        }
        if (RGB_btn.justPressed()) {
            screen = 2;
            draw_button_list(screen2);
        }
    }

    if (screen == 1) {
        update_button_list(screen1);  //process all buttons
        if (on_btn.justPressed()) {
            digitalWrite(LED, HIGH);
            flag = 0;
        }
        if (off_btn.justPressed()) {
            digitalWrite(LED, LOW);
            flag = 0;
        }
        if (flickeron_btn.justPressed()) {
            flag = 1;
        }
        if (flickeroff_btn.justPressed()) {
            flag = 0;
        }
        if (flag == 1) {
            digitalWrite(LED, HIGH);
            delay(500);
            digitalWrite(LED, LOW);
            delay(500);
        }
        if (back_btn.justPressed()) {
            screen = 0;
            draw_button_list(screen0);
            digitalWrite(LED, LOW);
        }
    }
    if (screen == 2) {
        update_button_list(screen2);  //process all buttons
        if (red_btn.justPressed()) {
            setColor(255, 0, 0);
        }
        if (green_btn.justPressed()) {
            setColor(0, 255, 0);
        }
        if (blue_btn.justPressed()) {
            setColor(0, 0, 255);
        }
        if (yellow_btn.justPressed()) {
            setColor(255, 255, 0);
        }
        if (purple_btn.justPressed()) {
            setColor(128, 0, 128);
        }
        if (aqua_btn.justPressed()) {
            setColor(0, 255, 255);
        }
        if (back_btn.justPressed()) {
            screen = 0;
            draw_button_list(screen0);
            setColor(0, 0, 0);
        }
    }
}

void setColor(int red, int green, int blue)
{
    analogWrite(redled, red);
    analogWrite(greenled, green);
    analogWrite(blueled, blue);
}

/* update the state of a button and redraw as reqd
 *
 * main program can use isPressed(), justPressed() etc
 */
bool update_button(Adafruit_GFX_Button *b, bool down)
{
    b->press(down && b->contains(pixel_x, pixel_y));
    if (b->justReleased())
        b->drawButton(false);
    if (b->justPressed())
        b->drawButton(true);
    return down;
}

/* most screens have different sets of buttons
 * life is easier if you process whole list in one go
 */
bool update_button_list(Adafruit_GFX_Button **pb)
{
    bool down = Touch_getXY();
    for (int i = 0 ; pb[i] != NULL; i++) {
        update_button(pb[i], down);
    }
    return down;
}

void draw_button_list(Adafruit_GFX_Button **pb)
{
    tft.fillScreen(BLACK);
    for (int i = 0 ; pb[i] != NULL; i++) {
        pb[i]->drawButton(false);
    }
}
#endif

do you recommend any software to draw a wiring schematic that have the Spi tft ili9341 display ? .

Hello David,
I bought a similar TFT_LCD, replicated all of your instructions to Ibrahim include resistances of 33R and 10k. However, the LCD just displayed only white colour.
Hope you can help me fix that.
Thanks

Please post a link to the actual display that you have bought. e.g. Ebay sale page.
You can just quote the official Arduino board by name e.g. "Uno"
If it is an unusual clone, post a link to the actual item on the shop's website.

Please quote the message number of text or wiring diagram that you want to discuss. e.g. #17 or #30

David.

Hi David,
The LCD marked as "2.8 TFT SPI 240*320 V1.1 I bought from Shoppee, which has appearance just as is the one Ibrahem got. Arduino UNO
Wiring scheme based on your post @ #30. Sketch is #26, uploaded seamlessly, but displayed white screen, no flicker.

Your Uno has 5V logic levels. You must use level shifters e.g. breadboard layout from #21
The scheme in #30 is for proper 3.3V Arduinos.

Please start with library examples. Never try custom sketches until the library examples are working 100%.
If you have a problem, quote library example by name. Only copy-paste your changes e.g. constructor statement.

David.

Thanks, Can the #30 diagram be applied to ESP32, which is 3.3V? I tried several schemes they posted of wiring same LCD module with ESP32, but it flickers or goes black, never got anything readable.

Yes, of course you can connect to an ESP32.

I suggest that you install Bodmer's TFT_eSPI library via the IDE Library Manager. Wire up according to one of his User_Setup configurations. And run his examples.

Take notes on paper. Report back if you have a problem.

Seriously. It takes a few minutes from you life to post links to your display and ESP32, quote example name, attach/paste your User Setup file, post photo of your wiring, ...

I tried several schemes they posted of wiring same LCD module with ESP32

Go on. Who is they ? What LCD module ? Which ESP32 board ?
Readers have to guess !

David.

Hi David,
The LCD was detected as ILI9341 using Adafruit ILI9341 detect example. On Serial monitor screen, at ID4, it says:
(0xD3): 41 00 93 41
Sorry I've just registered so I cannot upload the sketch.
Btw, I 've tested that TFT LCD with ESP32-CAM (AI Thinker version), The tested sketches were:
1/https://www.xtronical.com/esp32ili9341/
2/ESP32-CAM Auto-Selfie Camera with TFT – Robot Zero One
3/
The third link was removed by the policy to newly registered user

All three sketches gave flicker light grey or white wash.
I've tested some TFT LCD ID detector, all reflected as 9341.
I did search the net for several different drivers, i.e. from LCDWiki, Adafruit, MCUfriend, Bodmer's TFT_eSPI and TFT_ILI9341 test example sketch of each driver on ESP32 first and got no result. Then, I try Arduino UNO for another chance. I guessed the problem might not be on software side but on electronical aspect. Therefore, when I got your instruction to Ibrahem, I hope you got the answer.

Thanks for your patience.

Yes, (1) looks as if it is a good tutorial
I am not going to look at (2)
Please say what (3) was before the Forum removed it.

All the same. I suggest that you always start with the TFT_eSPI library examples. Not trust some random code on the Internet.

Use one of Bodmer's custom "User_Setups" and copy his pin wiring exactly. After all, Bodmer wrote it. Bodmer has tested it.
When the library examples are working, you can try the tutorial code.

David.

Thanks David,
The third sketch( link removed by forum) is from ThatProject's github. There are two sides: camera end to take picture(workgreat, can be seen via browser) and the display end (connect TFT LCD to an ESP32, in my test is the ESP32-CAM from AI Thinker).
I did test several examples from each library (MCUfriend, Bodmer, LCDWIKI, Adafruit and modified Adafruit) for one week, but got no positive result.
In my research, I found Bodmer UserSetup and try that, and thanks to him I found the way to get my Chip ID to be ILI9341. But no viewable picture or text.
The other possibility that I did not set the correct frequency, but there's no manual from the seller and he did not respond to my query. Hence, only trial and error and keep searching for the applicable guidance(s) that I can do.

Hi David,
After many searches and trials, I've found that 2.8" SPI TFT LCD is 3V3 can be used with standard Adafruit ILI9341 drive r. Bodme TFT_eSPI seems not fit due to misplaced pins: CD /RS were swapped in User_Setup.h and ReadUserSetup (Set pins in User Setup correctly, but in ReadUserSetup the pair has been swapped). I don't know why.
At least, now I can display some text on the lcd.
Thanks for your supports,

This topic was automatically closed 120 days after the last reply. New replies are no longer allowed.