1.8" TFT ST7735 LCD Tutorial - Arduino

 The resolution of the 1.8-inch display is 160x128 pixels and on the back of the module, we can find an SD card breakout! this tutorial is actually the first impression of the ST7735 to Arduino by using the Arduino software IDE and adafruit libraries we can program the display easily. 

<p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmSViu6uLfqN7oakaAQBgJVAfijSWuMPnAFEFJ1LqXAddL/collage.jpg" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmSViu6uLfqN7oakaAQBgJVAfijSWuMPnAFEFJ1LqXAddL/collage.jpg 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmSViu6uLfqN7oakaAQBgJVAfijSWuMPnAFEFJ1LqXAddL/collage.jpg 2x" /> <p dir="auto">  <h4>Requirements <p dir="auto">For this part, you will need the followingHARDWARE <ul> <li>Arduino UNO/NANO/MEGA microcontroller board <li>Male to Female jumper wires <li>Type B Usb cable for Data transfer between Arduino to your PC <p dir="auto">SOFTWARE & LIBRARIES <ul> <li><a href="https://www.arduino.cc/en/Main/Software" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Arduino Software IDE <li><a href="https://github.com/adafruit/Adafruit-ST7735-Library" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Adafruit-ST7735-Library <li><a href="https://github.com/adafruit/Adafruit-GFX-Library" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Adafruit-GFX-Library <h4>Difficulty <p dir="auto">Either choose between the following options: <ul> <li>Basic electronic tutorial <h4>Tutorial Contents <p dir="auto">Before we start, you need to download the Software IDE of arduino and Adafruit Libraries listed above. once Downloaded add the libraries to IDE by locating sketch options and include libaries. so we can make a sketch easily. in this tutorial we will the arduino UNO R3 board, this is a clone but it works fine for this project.It has 14 digital input/output pins (of which 6 can be used as PWM outputs), 6 analog inputs, a 16 MHz quartz crystal, a USB connection, a power jack, an ICSP header and a reset button. It contains everything needed to support the microcontroller; simply connect it to a computer with a USB cable or power it with a AC-to-DC adapter. <a href="https://store.arduino.cc/usa/arduino-uno-rev3" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">reference <ul> <li>Step 1: Experimental Procedures <p dir="auto">The LCD 1.8 TFT has 8 pins, 2 power pins, 1 pin for the boolen or backlight and 5 digital outputs. the VCC it refers to the power signal of the LCD typically connected to 5volts, and the GND or sometimes zero voltage, It is also the common connection of the LCD must connect to in one way or another path in order to complete the circuit.  <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmUrJ1c6cR7oqR3ERJRi6H5FqirwR3mWWbxspaFtcSYdDe/wwww.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmUrJ1c6cR7oqR3ERJRi6H5FqirwR3mWWbxspaFtcSYdDe/wwww.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmUrJ1c6cR7oqR3ERJRi6H5FqirwR3mWWbxspaFtcSYdDe/wwww.png 2x" /> <p dir="auto">  <ul> <li>Step 2: Connect the following pins of the LCD to Arduino R3 board <p dir="auto"><strong>1.8" TFT LCDARDUINO R3LED3.3VSCKD13SDAD11AOD8RESETD9CSD10GNDGNDVCC5V <ul> <li>Step 2: Programming <p dir="auto">Open the arduino IDE navigate Examples > ST7735 library. at this part we will be using then graph test to show some graphics, text, number and symbols to lcd, i am going to select one of example code with tutoring part on it , you can copy it below<strong>SOURCE CODE <pre><code>#include <Adafruit_GFX.h>    // include Core graphics library<br /> #include <Adafruit_ST7735.h> // include Hardware-specific library<br /> #include <SPI.h><br /> // For the breakout, you can use any 2 or 3 pins<br /> // These pins will also work for the 1.8" TFT shield<br /> #define TFT_CS     10<br /> #define TFT_RST    8  // you can also connect this to the Arduino reset                      <br /> #define TFT_DC     9  // in which case, set this #define pin to -1!<br /> // Option 1 (recommended): must use the hardware SPI pins<br /> // (for UNO thats sclk = 13 and sid = 11) and pin 10 must be<br /> // an output. This is much faster - also required if you want<br /> // to use the microSD card (see the image drawing example)<br /> Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS,  TFT_DC, TFT_RST);<br /> // Option 2: use any pins but a little slower!<br /> #define TFT_SCLK 13   // set these to be whatever pins you like!<br /> #define TFT_MOSI 11   // set these to be whatever pins you like!<br /> //Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS, TFT_DC, TFT_MOSI, TFT_SCLK, TFT_RST);<br /> float p = 3.1415926;<br /> void setup(void) {<br />  Serial.begin(9600);<br />  Serial.print("Hello! ST7735 TFT Test");<br />  // Use this initializer if you're using a 1.8" TFT<br />  tft.initR(INITR_BLACKTAB);   // initialize a ST7735S chip, black tab<br />  // Use this initializer (uncomment) if you're using a 1.44" TFT<br />  //tft.initR(INITR_144GREENTAB);   // initialize a ST7735S chip, black tab<br />  // Use this initializer (uncomment) if you're using a 0.96" 180x60 TFT<br />  //tft.initR(INITR_MINI160x80);   // initialize a ST7735S chip, mini display<br />  Serial.println("Initialized");<br />  uint16_t time = millis();<br />  tft.fillScreen(ST7735_BLACK);<br />  time = millis() - time;<br />  Serial.println(time, DEC);<br />  delay(500);<br />  // large block of text<br />  tft.fillScreen(ST7735_BLACK);<br />  testdrawtext("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur adipiscing ante sed nibh tincidunt feugiat. Maecenas enim massa, fringilla sed malesuada et, malesuada sit amet turpis. Sed porttitor neque ut ante pretium vitae malesuada nunc bibendum. Nullam aliquet ultrices massa eu hendrerit. Ut sed nisi lorem. In vestibulum purus a tortor imperdiet posuere. ", ST7735_WHITE);<br />  delay(1000);<br />  // tft print function!<br />  tftPrintTest();<br />  delay(4000);<br />  // a single pixel<br />  tft.drawPixel(tft.width()/2, tft.height()/2, ST7735_GREEN);<br />  delay(500);<br />  // line draw test<br />  testlines(ST7735_YELLOW);<br />  delay(500);<br />  // optimized lines<br />  testfastlines(ST7735_RED, ST7735_BLUE);<br />  delay(500);<br />  testdrawrects(ST7735_GREEN);<br />  delay(500);<br />  testfillrects(ST7735_YELLOW, ST7735_MAGENTA);<br />  delay(500);<br />  tft.fillScreen(ST7735_BLACK);<br />  testfillcircles(10, ST7735_BLUE);<br />  testdrawcircles(10, ST7735_WHITE);<br />  delay(500);<br />  testroundrects();<br />  delay(500);<br />  testtriangles();<br />  delay(500);<br />  mediabuttons();<br />  delay(500);<br />  Serial.println("done");<br />  delay(1000);<br /> }<br /> void loop() {<br />  tft.invertDisplay(true);<br />  delay(500);<br />  tft.invertDisplay(false);<br />  delay(500);<br /> }<br /> void testlines(uint16_t color) {<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=0; x < tft.width(); x+=6) {<br />    tft.drawLine(0, 0, x, tft.height()-1, color);<br />  }<br />  for (int16_t y=0; y < tft.height(); y+=6) {<br />    tft.drawLine(0, 0, tft.width()-1, y, color);<br />  }<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=0; x < tft.width(); x+=6) {<br />    tft.drawLine(tft.width()-1, 0, x, tft.height()-1, color);<br />  }<br />  for (int16_t y=0; y < tft.height(); y+=6) {<br />    tft.drawLine(tft.width()-1, 0, 0, y, color);<br />  }<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=0; x < tft.width(); x+=6) {<br />    tft.drawLine(0, tft.height()-1, x, 0, color);<br />  }<br />  for (int16_t y=0; y < tft.height(); y+=6) {<br />    tft.drawLine(0, tft.height()-1, tft.width()-1, y, color);<br />  }<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=0; x < tft.width(); x+=6) {<br />    tft.drawLine(tft.width()-1, tft.height()-1, x, 0, color);<br />  }<br />  for (int16_t y=0; y < tft.height(); y+=6) {<br />    tft.drawLine(tft.width()-1, tft.height()-1, 0, y, color);<br />  }<br /> }<br /> void testdrawtext(char *text, uint16_t color) {<br />  tft.setCursor(0, 0);<br />  tft.setTextColor(color);<br />  tft.setTextWrap(true);<br />  tft.print(text);<br /> }<br /> void testfastlines(uint16_t color1, uint16_t color2) {<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t y=0; y < tft.height(); y+=5) {<br />    tft.drawFastHLine(0, y, tft.width(), color1);<br />  }<br />  for (int16_t x=0; x < tft.width(); x+=5) {<br />    tft.drawFastVLine(x, 0, tft.height(), color2);<br />  }<br /> }<br /> void testdrawrects(uint16_t color) {<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=0; x < tft.width(); x+=6) {<br />    tft.drawRect(tft.width()/2 -x/2, tft.height()/2 -x/2 , x, x, color);<br />  }<br /> }<br /> void testfillrects(uint16_t color1, uint16_t color2) {<br />  tft.fillScreen(ST7735_BLACK);<br />  for (int16_t x=tft.width()-1; x > 6; x-=6) {<br />    tft.fillRect(tft.width()/2 -x/2, tft.height()/2 -x/2 , x, x, color1);<br />    tft.drawRect(tft.width()/2 -x/2, tft.height()/2 -x/2 , x, x, color2);<br />  }<br /> }<br /> void testfillcircles(uint8_t radius, uint16_t color) {<br />  for (int16_t x=radius; x < tft.width(); x+=radius*2) {<br />    for (int16_t y=radius; y < tft.height(); y+=radius*2) {<br />      tft.fillCircle(x, y, radius, color);<br />    }<br />  }<br /> }<br /> void testdrawcircles(uint8_t radius, uint16_t color) {<br />  for (int16_t x=0; x < tft.width()+radius; x+=radius*2) {<br />    for (int16_t y=0; y < tft.height()+radius; y+=radius*2) {<br />      tft.drawCircle(x, y, radius, color);<br />    }<br />  }<br /> }<br /> void testtriangles() {<br />  tft.fillScreen(ST7735_BLACK);<br />  int color = 0xF800;<br />  int t;<br />  int w = tft.width()/2;<br />  int x = tft.height()-1;<br />  int y = 0;<br />  int z = tft.width();<br />  for(t = 0 ; t <= 15; t++) {<br />    tft.drawTriangle(w, y, y, x, z, x, color);<br />    x-=4;<br />    y+=4;<br />    z-=4;<br />    color+=100;<br />  }<br /> }<br /> void testroundrects() {<br />  tft.fillScreen(ST7735_BLACK);<br />  int color = 100;<br />  int i;<br />  int t;<br />  for(t = 0 ; t <= 4; t+=1) {<br />    int x = 0;<br />    int y = 0;<br />    int w = tft.width()-2;<br />    int h = tft.height()-2;<br />    for(i = 0 ; i <= 16; i+=1) {<br />      tft.drawRoundRect(x, y, w, h, 5, color);<br />      x+=2;<br />      y+=3;<br />      w-=4;<br />      h-=6;<br />      color+=1100;<br />    }<br />    color+=100;<br />  }<br /> }<br /> void tftPrintTest() {<br />  tft.setTextWrap(false);<br />  tft.fillScreen(ST7735_BLACK);<br />  tft.setCursor(0, 30);<br />  tft.setTextColor(ST7735_RED);<br />  tft.setTextSize(1);<br />  tft.println("Hello World!");<br />  tft.setTextColor(ST7735_YELLOW);<br />  tft.setTextSize(2);<br />  tft.println("Hello World!");<br />  tft.setTextColor(ST7735_GREEN);<br />  tft.setTextSize(3);<br />  tft.println("Hello World!");<br />  tft.setTextColor(ST7735_BLUE);<br />  tft.setTextSize(4);<br />  tft.print(1234.567);<br />  delay(1500);<br />  tft.setCursor(0, 0);<br />  tft.fillScreen(ST7735_BLACK);<br />  tft.setTextColor(ST7735_WHITE);<br />  tft.setTextSize(0);<br />  tft.println("Hello World!");<br />  tft.setTextSize(1);<br />  tft.setTextColor(ST7735_GREEN);<br />  tft.print(p, 6);<br />  tft.println(" Want pi?");<br />  tft.println(" ");<br />  tft.print(8675309, HEX); // print 8,675,309 out in HEX!<br />  tft.println(" Print HEX!");<br />  tft.println(" ");<br />  tft.setTextColor(ST7735_WHITE);<br />  tft.println("Sketch has been");<br />  tft.println("running for: ");<br />  tft.setTextColor(ST7735_MAGENTA);<br />  tft.print(millis() / 1000);<br />  tft.setTextColor(ST7735_WHITE);<br />  tft.print(" seconds.");<br /> }<br /> void mediabuttons() {<br />  // play<br />  tft.fillScreen(ST7735_BLACK);<br />  tft.fillRoundRect(25, 10, 78, 60, 8, ST7735_WHITE);<br />  tft.fillTriangle(42, 20, 42, 60, 90, 40, ST7735_RED);<br />  delay(500);<br />  // pause<br />  tft.fillRoundRect(25, 90, 78, 60, 8, ST7735_WHITE);<br />  tft.fillRoundRect(39, 98, 20, 45, 5, ST7735_GREEN);<br />  tft.fillRoundRect(69, 98, 20, 45, 5, ST7735_GREEN);<br />  delay(500);<br />  // play color<br />  tft.fillTriangle(42, 20, 42, 60, 90, 40, ST7735_BLUE);<br />  delay(50);<br />  // pause color<br />  tft.fillRoundRect(39, 98, 20, 45, 5, ST7735_RED);<br />  tft.fillRoundRect(69, 98, 20, 45, 5, ST7735_RED);<br />  // play color<br />  tft.fillTriangle(42, 20, 42, 60, 90, 40, ST7735_GREEN);<br /> } <ul> <li>Step 4: Connect the Arduino board to your PC using Type B usb cable ( once plug verify the port and model of your board on IDE > TOOLS option) <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/p/TZjG7hXReeVthqpTJZmwvzsLcvMeG4TU4Gjdfy268vjnwMjeGg6B2hb2gtFc3265YLc6Ei7ShdeCHuBkhChLNwTBxBGomTHRq1xrMjZbGLySSiy2bMxM8R1iwdXMnWBhX9mSeRGBh4W7g2?format=match&mode=fit&width=640" srcset="https://images.hive.blog/768x0/https://steemitimages.com/p/TZjG7hXReeVthqpTJZmwvzsLcvMeG4TU4Gjdfy268vjnwMjeGg6B2hb2gtFc3265YLc6Ei7ShdeCHuBkhChLNwTBxBGomTHRq1xrMjZbGLySSiy2bMxM8R1iwdXMnWBhX9mSeRGBh4W7g2?format=match&mode=fit&width=640 1x, https://images.hive.blog/1536x0/https://steemitimages.com/p/TZjG7hXReeVthqpTJZmwvzsLcvMeG4TU4Gjdfy268vjnwMjeGg6B2hb2gtFc3265YLc6Ei7ShdeCHuBkhChLNwTBxBGomTHRq1xrMjZbGLySSiy2bMxM8R1iwdXMnWBhX9mSeRGBh4W7g2?format=match&mode=fit&width=640 2x" /> <p dir="auto">  <ul> <li>Step 5: Copy the source code above and Upload the code to arduino, ( you will see an arrow shape on the IDE stands for upload) go back to the components make sure you wire it up on the right specific pins before you upload. once uploaded HELLO WORLD! <p dir="auto"> This is the introduction tutorial of the ST7735 LCD we can Display different types of images, play games and play video using this LCD which I will make a tutorial soon. I hope this help, thank you for dropping by.