Arduino TFT Touch Screen Calculator (MCUFRIEND) : Part 1

Abhishek Ghosh

By Abhishek Ghosh January 24, 2018 9:06 am Updated on May 23, 2018

Arduino TFT Touch Screen Calculator (MCUFRIEND) : Part 1

In our previously published article we talked about MCUFRIEND TFT Touch Screen. Arduino TFT Touch Screen Calculator is an Easy Example of Practical Deployment of Programmable Microcontroller From the Libraries. It is important to understand that this guide will only supply codes which may be buggy on different “models” of MCUFRIEND TFT Touch Screens. I named this article as “Part 1” for those bugs and no practical improvement of others codes. What code will work for me may not work for your same one (however you’ll not see a blank white screen) or you’ll see mirror image. Frankly, there is no question of circuit diagram for a shield with Arduino UNO. Simply snap on the shield on Arduino UNO.

Arduino TFT Touch Screen Calculator (MCUFRIEND)

Below code is for your understanding and matching with the examples from MCUFRIEND_KBV example libraries, it will only show the keys. This is how the keyboard is drawn, you can change the colors, tweak. void loop() is empty. The code actually not respond to touch, it is only for checking the keys :

#define LCD_CS A3 // Chip Select goes to Analog 3
#define LCD_CD A2 // Command/Data goes to Analog 2
#define LCD_WR A1 // LCD Write goes to Analog 1
#define LCD_RD A0 // LCD Read goes to Analog 0
#define LCD_RESET A4 // Can alternately just connect to Arduino's reset pin
#include <SPI.h>          // f.k. for Arduino-1.5.2
#include "TouchScreen_kbv.h"
#include "Adafruit_GFX.h"// Hardware-specific library
#include <MCUFRIEND_kbv.h>
MCUFRIEND_kbv tft;
//#include <Adafruit_TFTLCD.h>
//Adafruit_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);
// Assign human-readable names to some common 16-bit color values:
#define	BLACK   0x0000
#define	BLUE    0x001F
#define	RED     0xF800
#define	GREEN   0x07E0
#define CYAN    0x07FF
#define MAGENTA 0xF81F
#define YELLOW  0xFFE0
#define WHITE   0xFFFF

#ifndef min
#define min(a, b) (((a) < (b)) ? (a) : (b))
#endif
String Key[4][4] = {
  { "7", "8", "9", "/" },
  { "4", "5", "6", "*" },
  { "1", "2", "3", "-" },
  { "C", "0", "=", "+" }
};
String N1, N2, ShowSC, opt;
bool updata=false;
float answers=-1;
void setup() {
  Serial.begin(9600);
  tft.reset();
  tft.begin(0x9341); // SDFP5408
  tft.setRotation(0);
  tft.fillScreen(BLACK);
  tft.fillRect(0, 80, 240, 240, WHITE);
  tft.drawFastHLine(0, 80, 240, BLACK);
  tft.drawFastHLine(0, 140, 240, BLACK);
  tft.drawFastHLine(0, 200, 240, BLACK);
  tft.drawFastHLine(0, 260, 240, BLACK);
  tft.drawFastHLine(0, 320-1, 240, BLACK);
  tft.drawFastVLine(0, 80, 240, BLACK);
  tft.drawFastVLine(60, 80, 240, BLACK);
  tft.drawFastVLine(120, 80, 240, BLACK);
  tft.drawFastVLine(180, 80, 240, BLACK);
  tft.drawFastVLine(240-1, 80, 240, BLACK);
  for (int y=0;y<4;y++) {
    for (int x=0;x<4;x++) {
      tft.setCursor(22 + (60*x), 100 + (60*y));
      tft.setTextSize(3);
      tft.setTextColor(BLACK);
      tft.println(Key[y][x]);
    }
  }
}
void loop() {
}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

#define LCD_CS A3 // Chip Select goes to Analog 3

#define LCD_CD A2 // Command/Data goes to Analog 2

#define LCD_WR A1 // LCD Write goes to Analog 1

#define LCD_RD A0 // LCD Read goes to Analog 0

#define LCD_RESET A4 // Can alternately just connect to Arduino's reset pin

#include <SPI.h> // f.k. for Arduino-1.5.2

#include "TouchScreen_kbv.h"

#include "Adafruit_GFX.h"// Hardware-specific library

#include <MCUFRIEND_kbv.h>

MCUFRIEND_kbv tft;

//#include <Adafruit_TFTLCD.h>

//Adafruit_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);

// Assign human-readable names to some common 16-bit color values:

#define BLACK 0x0000

#define BLUE 0x001F

#define RED 0xF800

#define GREEN 0x07E0

#define CYAN 0x07FF

#define MAGENTA 0xF81F

#define YELLOW 0xFFE0

#define WHITE 0xFFFF

#ifndef min

#define min(a, b) (((a) < (b)) ? (a) : (b))

#endif

String Key[4][4] = {

{ "7", "8", "9", "/" },

{ "4", "5", "6", "*" },

{ "1", "2", "3", "-" },

{ "C", "0", "=", "+" }

};

String N1, N2, ShowSC, opt;

bool updata=false;

float answers=-1;

void setup() {

Serial.begin(9600);

tft.reset();

tft.begin(0x9341); // SDFP5408

tft.setRotation(0);

tft.fillScreen(BLACK);

tft.fillRect(0, 80, 240, 240, WHITE);

tft.drawFastHLine(0, 80, 240, BLACK);

tft.drawFastHLine(0, 140, 240, BLACK);

tft.drawFastHLine(0, 200, 240, BLACK);

tft.drawFastHLine(0, 260, 240, BLACK);

tft.drawFastHLine(0, 320-1, 240, BLACK);

tft.drawFastVLine(0, 80, 240, BLACK);

tft.drawFastVLine(60, 80, 240, BLACK);

tft.drawFastVLine(120, 80, 240, BLACK);

tft.drawFastVLine(180, 80, 240, BLACK);

tft.drawFastVLine(240-1, 80, 240, BLACK);

for (int y=0;y<4;y++) {

for (int x=0;x<4;x++) {

tft.setCursor(22 + (60*x), 100 + (60*y));

tft.setTextSize(3);

tft.setTextColor(BLACK);

tft.println(Key[y][x]);

}

void loop() {

}

If with the above code you see everything fine but digits mirrored, then possibly you have some slightly different hardware, you probably need to tweak the like tft.setRotation. You can perform Google search to fix it. It is not big matter.

---

Arduino TFT Touch Screen Calculator MCUFRIEND

What others did so far, they used this library :

https://github.com/JoaoLopesF/SPFD5408

1	https://github.com/JoaoLopesF/SPFD5408

And used the below code from maxpromer (on GitHub) :

#include <SPFD5408_Adafruit_GFX.h>    // Core graphics library

#include <SPFD5408_Adafruit_TFTLCD.h> // Hardware-specific library

#include <SPFD5408_TouchScreen.h>



#define YP A1  // must be an analog pin, use "An" notation!

#define XM A2  // must be an analog pin, use "An" notation!

#define YM 7   // can be a digital pin

#define XP 6   // can be a digital pin



// Calibrate values

#define TS_MINX 125

#define TS_MINY 85

#define TS_MAXX 965

#define TS_MAXY 905



TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);



#define LCD_CS A3

#define LCD_CD A2

#define LCD_WR A1

#define LCD_RD A0

// optional

#define LCD_RESET A4



// Assign human-readable names to some common 16-bit color values:

#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 MINPRESSURE 10

#define MAXPRESSURE 1000



Adafruit_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);



String Key[4][4] = {

  { "7", "8", "9", "/" },

  { "4", "5", "6", "*" },

  { "1", "2", "3", "-" },

  { "C", "0", "=", "+" }

};



String N1, N2, ShowSC, opt;

bool updata=false;

float answers=-1;



void setup() {

  Serial.begin(9600);

  tft.reset();

  tft.begin(0x9341); // SDFP5408

  tft.setRotation(2);

  tft.fillScreen(BLACK);

  

  tft.fillRect(0, 80, 240, 240, WHITE);

  tft.drawFastHLine(0, 80, 240, BLACK);

  tft.drawFastHLine(0, 140, 240, BLACK);

  tft.drawFastHLine(0, 200, 240, BLACK);

  tft.drawFastHLine(0, 260, 240, BLACK);

  tft.drawFastHLine(0, 320-1, 240, BLACK);



  tft.drawFastVLine(0, 80, 240, BLACK);

  tft.drawFastVLine(60, 80, 240, BLACK);

  tft.drawFastVLine(120, 80, 240, BLACK);

  tft.drawFastVLine(180, 80, 240, BLACK);

  tft.drawFastVLine(240-1, 80, 240, BLACK);



  for (int y=0;y<4;y++) {

    for (int x=0;x<4;x++) {

      tft.setCursor(22 + (60*x), 100 + (60*y));

      tft.setTextSize(3);

      tft.setTextColor(BLACK);

      tft.println(Key[y][x]);

    }

  }

}



void loop() {

  TSPoint p = waitTouch();

  Serial.println(p.x);

  updata = false;

  for (int i1=0;i1<4;i1++) {

    for (int i2=0;i2<4;i2++) {

      if ((p.x>=240-((i1+1)*60)+1&&p.x<=240-(i1*60)-1)&&(p.y>=(i2*60)+1&&p.y<=((i2+1)*60)-1)) {

        if ((i1<=2&&i2<=2)||(i1==3&&i2==1)) {

          if (opt==0) {

            if (answers!=-1) answers = -1;

            N1 = N1 + Key[i1][i2];

            ShowSC = N1;

          } else {

            N2 = N2 + Key[i1][i2];

            ShowSC = opt + N2;

          }

        } else {

          if (Key[i1][i2]=="C") {

            N1 = N2 = "";

            opt = "";

            answers = 0;

            ShowSC = N1;

          } else if (i2==3) {

            if (N1=="") N1 = String(answers);

            opt = Key[i1][i2];

            ShowSC = Key[i1][i2];

          } else if (Key[i1][i2]=="=") {

            if (opt=="+") answers = N1.toInt() + N2.toInt();

            else if (opt=="-") answers = N1.toInt() - N2.toInt();

            else if (opt=="*") answers = N1.toInt() * N2.toInt();

            else if (opt=="/") answers = N1.toInt() / N2.toInt();

            N1 = N2 = opt = "";

            ShowSC = answers;

          }

        }

        updata = true;

      }

    }

  }

  

  if (updata) {

    tft.fillRect(0, 0, 240, 80, BLACK);

  

    tft.setCursor(10, 10);

    tft.setTextSize(3);

    tft.setTextColor(WHITE);

    tft.println(ShowSC);

  }

  delay(300);

}



TSPoint waitTouch() {

  TSPoint p;

  do {

    p = ts.getPoint(); 

    pinMode(XM, OUTPUT);

    pinMode(YP, OUTPUT);

  } while((p.z < MINPRESSURE )|| (p.z > MAXPRESSURE));

  p.x = map(p.x, TS_MINX, TS_MAXX, 0, 320);

  p.y = map(p.y, TS_MINY, TS_MAXY, 0, 240);;

  return p;

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

#include <SPFD5408_Adafruit_GFX.h> // Core graphics library

#include <SPFD5408_Adafruit_TFTLCD.h> // Hardware-specific library

#include <SPFD5408_TouchScreen.h>

#define YP A1 // must be an analog pin, use "An" notation!

#define XM A2 // must be an analog pin, use "An" notation!

#define YM 7 // can be a digital pin

#define XP 6 // can be a digital pin

// Calibrate values

#define TS_MINX 125

#define TS_MINY 85

#define TS_MAXX 965

#define TS_MAXY 905

TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);

#define LCD_CS A3

#define LCD_CD A2

#define LCD_WR A1

#define LCD_RD A0

// optional

#define LCD_RESET A4

// Assign human-readable names to some common 16-bit color values:

#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 MINPRESSURE 10

#define MAXPRESSURE 1000

Adafruit_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);

String Key[4][4] = {

{ "7", "8", "9", "/" },

{ "4", "5", "6", "*" },

{ "1", "2", "3", "-" },

{ "C", "0", "=", "+" }

};

String N1, N2, ShowSC, opt;

bool updata=false;

float answers=-1;

void setup() {

Serial.begin(9600);

tft.reset();

tft.begin(0x9341); // SDFP5408

tft.setRotation(2);

tft.fillScreen(BLACK);

tft.fillRect(0, 80, 240, 240, WHITE);

tft.drawFastHLine(0, 80, 240, BLACK);

tft.drawFastHLine(0, 140, 240, BLACK);

tft.drawFastHLine(0, 200, 240, BLACK);

tft.drawFastHLine(0, 260, 240, BLACK);

tft.drawFastHLine(0, 320-1, 240, BLACK);

tft.drawFastVLine(0, 80, 240, BLACK);

tft.drawFastVLine(60, 80, 240, BLACK);

tft.drawFastVLine(120, 80, 240, BLACK);

tft.drawFastVLine(180, 80, 240, BLACK);

tft.drawFastVLine(240-1, 80, 240, BLACK);

for (int y=0;y<4;y++) {

for (int x=0;x<4;x++) {

tft.setCursor(22 + (60*x), 100 + (60*y));

tft.setTextSize(3);

tft.setTextColor(BLACK);

tft.println(Key[y][x]);

}

void loop() {

TSPoint p = waitTouch();

Serial.println(p.x);

updata = false;

for (int i1=0;i1<4;i1++) {

for (int i2=0;i2<4;i2++) {

if ((p.x>=240-((i1+1)*60)+1&&p.x<=240-(i1*60)-1)&&(p.y>=(i2*60)+1&&p.y<=((i2+1)*60)-1)) {

if ((i1<=2&&i2<=2)||(i1==3&&i2==1)) {

if (opt==0) {

if (answers!=-1) answers = -1;

N1 = N1 + Key[i1][i2];

ShowSC = N1;

} else {

N2 = N2 + Key[i1][i2];

ShowSC = opt + N2;

}

} else {

if (Key[i1][i2]=="C") {

N1 = N2 = "";

opt = "";

answers = 0;

ShowSC = N1;

} else if (i2==3) {

if (N1=="") N1 = String(answers);

opt = Key[i1][i2];

ShowSC = Key[i1][i2];

} else if (Key[i1][i2]=="=") {

if (opt=="+") answers = N1.toInt() + N2.toInt();

else if (opt=="-") answers = N1.toInt() - N2.toInt();

else if (opt=="*") answers = N1.toInt() * N2.toInt();

else if (opt=="/") answers = N1.toInt() / N2.toInt();

N1 = N2 = opt = "";

ShowSC = answers;

}

updata = true;

}

if (updata) {

tft.fillRect(0, 0, 240, 80, BLACK);

tft.setCursor(10, 10);

tft.setTextSize(3);

tft.setTextColor(WHITE);

tft.println(ShowSC);

}

delay(300);

}

TSPoint waitTouch() {

TSPoint p;

do {

p = ts.getPoint();

pinMode(XM, OUTPUT);

pinMode(YP, OUTPUT);

} while((p.z < MINPRESSURE )|| (p.z > MAXPRESSURE));

p.x = map(p.x, TS_MINX, TS_MAXX, 0, 320);

p.y = map(p.y, TS_MINY, TS_MAXY, 0, 240);;

return p;

}

It is kind of beta version of progress and a self-reminder. You can proceed to read Part 2 of this effort.

Tagged With MCUfriend

Arduino TFT Touch Screen Calculator (MCUFRIEND) : Part 1

Arduino TFT Touch Screen Calculator (MCUFRIEND)

About Abhishek Ghosh

Here’s what we’ve got for you which might like :

Take The Conversation Further ...

Arduino TFT Touch Screen Calculator (MCUFRIEND)

About Abhishek Ghosh

Here’s what we’ve got for you which might like :

Articles Related to Arduino TFT Touch Screen Calculator (MCUFRIEND) : Part 1

Take The Conversation Further ...