Using the 1.44″ tft st7735 color display with arduino

Rotate the screen #

You can change the screen position and the origin of the with the node.

The node allows you to rotate the display screen to one of four positions: 0 degrees portrait, 90 degrees landscape, 180 degrees portrait, and 270 degrees landscape. A value at the pin sets the angle to rotate the screen and can be one of four values , , , . These values correspond to the particular display positions.

A type signal at the pin triggers a new screen rotation and the coordinate system change. The pulse at the output pin signals that the rotation is complete. The can be used in run-time and at any step of the program. It is possible to use several nodes.

Описание

WF18FTLAADNN0 – это 1.77” дюймовый TFT-LCD модуль с разрешением 128×160 пикселей. Модуль работает на базе драйвера IC ST7735S; поддерживает 8080 8/16-Бит параллельный и 3х жильный SPI interface. Размер модуля составляет 34.0 x 45.83 mm, с активной областью 28.03 x 35.04 mm. Диапазон напряжения питания VCI от 2.5V до 4.8V.

Индикация дисплея WF18FTLAADNN0 производится в портретном режиме. Для индикации в горизонтальном режиме, пожалуйста свяжитесь со службой технической поддержки Winstar Display. Яркость дисплея составляет 500 cd/m2. Рабочая температура дисплея: от -20 ° C до 70 ° С; Температура хранения: от -30 ° C до 80 ° C.

Quick start nodes #

ST7735 breakout boards can differ from each other and require different initialization methods. Therefore, the library contains 4 quickstart nodes at once — , , , and . Each of these nodes works with a display of a certain type conventionally named “B”, “G”, “RG”, and “RR”. To find out which type your specific display belongs to, try each of these nodes until it works.

Wire your display to the microcontroller via hardware SPI bus and fill in the , , pin values according to the microcontroller ports. The is the “Chip Select” microcontroller port of the SPI interface. is the “Data/Command” microcontroller port responsible for sending data and commands to the display driver.

The pin is the “Reset” microcontroller port the display is connected to. This port is responsible for the display reset which can be required during device initialization. Not all ST7735 breakout boards have this pin. If your ST7735 breakout board has this pin, be sure to link it with a microcontroller and set the appropriate port value at the pin. If your breakout board does not have an pin, then leave the default value untouched.

The input pin of the type specifies the graphics to render and display on the device screen. The awaits a branch of the tree of graphical elements created using the graphics library. The value at the pin is responsible for the display screen update due to change of the incoming graphics at the pin.

Графический ЖК (жидкокристаллический) дисплей 128х64

Данный дисплей отличается малым энергопотреблением и подходит для использования в устройствах, питание которых осуществляется от батареек. Он поддерживает диапазон питающих напряжений от 2.2v до 5.5v, 8/4-битный параллельный режим работы и поставляется вместе с микросхемой контроллера/драйвера ST7290. Кроме параллельного режима работы можно также использовать последовательный режим работы по шине PSB (processor side bus) (PIN 15). Этот графический ЖК дисплей имеет автоматическое управление мощностью и возможность программного сброса, что позволяет без проблем подключать его к большинству современных микропроцессорных платформ, например, 8051, AVR, ARM, Arduino и Raspberry Pi.

При необходимости более подробного изучения возможностей данного ЖК дисплея вы можете изучить даташит на него.

Назначение контактов графического ЖК дисплея ST7920 приведено в следующей таблице.

Connecting TFT display to Arduino.

This is the type of display am using but they come with various pin configurations. However all the displays will have the major pins stated below and should be connected to the Arduino board as follows:SCK to  Digital pin 13SDA to  Digital pin 11DC   to  Digital pin 9Reset to  Digital pin 8CS  to  Digital pin 10GND to Arduino GNDVCC  to Arduino 3.3V

This TFT display uses 3.3V but comes with an on board voltage regulator therefore the VCC can be connected to the Arduino 5V. However for best practice it’s better to use the 3.3V.

Most code Libraries for this TFT ST7735 display with Arduino are programmed with the SDA and SCL pins connected to Arduino pins 11 and 13 respectively. Make sure you don’t change that order otherwise the display may not work.

Техническое описание

Функции контроллера контактного интерфейса

Основные характеристики

Абсолютные максимальные значения

Электронные характеристики

Render the scene #

The node is your main tool to display . The processes a single branch of the graphic tree created using the graphics library, renders it, and displays at the device.

A graphic tree branch to render links to the input pin. A pulse signal at the pin is a trigger to process the graphic scene and display it. If the scene is rendered, a pulse comes to the output pin.

Use multiple nodes simultaneously. Processing various branches of the graphic tree at a different time, you can show dynamic graphic scenes at the screen.

Here is the example of a three nodes use. The tree of graphic elements consists of a and two on it. The device node and three nodes are linked together in a daisy chain. All nodes have different triggering algorithms at their pins.

The first is on ; it fills the display screen with a specified only once — after powering the device. The second is responsible for on the canvas. Its trigger is set to . It means that any changes in the position are immediately shown on the screen. The third is responsible for displaying the and its trigger is linked to the . Here you can also change the position, but the changes are displayed only after the button click.

TFT LCD library

Code for running the ST7735 TFT Display.

There are a number of libraries that have been developed to run the TFT ST7735 color display using Arduino but I found the Adafruit-ST7735-Library the best to use. Make sure you have this library installed in your IDE.

Basic commands.

Most TFT libraries have been programmed to support the following commands:

• This function is for changing the color of the screen.
• For setting the cursor position using x and y coordinates of the screen.
• For setting the color of text.
• Setting the color of text and its background.
• For setting the size of text. This should be from 1 to 5.
• Rotating the screen. Can take values of 0 for 0 degrees, 1 for 90 degrees, 2 for 180 degrees and 3 for 270 degrees.
• For displaying a string.
• Displaying a string and moves the cursor to the next line.
• This function draws a vertical line that starts in x, y location, and its length is h pixel and its color is t.

• This function draws a horizontal line that starts in x, y location, and its length is w pixel and its color is t.
• This function draws a line that starts in xi and yi location ends is in xj and yj and the color is t.
• function draws a rectangle in x and y location with w width and h height and t color.
• function draws a filled rectangle in x and y location. w is width, h is height and t is color of the rectangle
• function draws a circle in x and y location and r radius and t color.
• function draws a filled circle in x and y location and r radius and t color.
• function draws a triangle with three corner location x, y and z, and t color.
• function draws a filled triangle with three corner location x, y and z, and t color.
• function draws a Rectangle with r radius round corners in x and y location and w width and h height and t color.
• function draws a filled Rectangle with r radius round corners in x and y location and w width and h height and t color.

There are many other functions and commands which you can use to program the TFT color display but the above are the commonest. You will meet many more with practice.

Before we can write our personal code we need to first test the display using the already made code examples from the installed library. This is done by going to File>Examples>Adafruit ST7735 and ST7789 Library. Then you can select any of the examples and upload it to the setup to see if the display works fine.In the diagram below I have shown how to access the graphics test code.

The example below shows the basic use of the above commands and functions for displaying simple colored shapes, lines and words on the TFT display.

#include <SPI.h>
#include <Adafruit_GFX.h>    // Core graphics library
#include <Adafruit_ST7735.h> // Hardware-specific library

#define TFT_CS        10
#define TFT_RST        7 // Or set to -1 and connect to Arduino RESET pin
#define TFT_DC         9

Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS, TFT_DC, TFT_RST);

void setup(void) {
  tft.initR(INITR_144GREENTAB); // Init ST7735R chip, green tab
  //tft.fillScreen(ST77XX_BLACK);
  tft.setRotation(0); // set display orientation 
}

void loop() {
  tft.fillScreen(ST77XX_CYAN);
  print_text(25,30,"HELLO",3,ST77XX_ORANGE);
  print_text(20,70,"WORLD!",3,ST77XX_BLUE);
  delay(5000);
  
  tft.fillScreen(ST77XX_BLACK);
  tft.fillRoundRect(25, 10, 78, 60, 8, ST77XX_WHITE);
  tft.fillTriangle(42, 20, 42, 60, 90, 40, ST77XX_RED);
  delay(5000);
  
  tft.fillScreen(ST77XX_CYAN);
  tft.drawRect(5,5,120,120,ST77XX_RED);
  tft.drawFastHLine(5,60,120,ST77XX_RED);
  tft.drawFastVLine(60,5,120,ST77XX_RED);
  delay(5000);
}

void print_text(byte x_pos, byte y_pos, char *text, byte text_size, uint16_t color) {
  tft.setCursor(x_pos, y_pos);
  tft.setTextSize(text_size);
  tft.setTextColor(color);
  tft.setTextWrap(true);
  tft.print(text);
}

Please also check out these other projects to better understand how the ST7735 TFT display is used with Arduino;

Displaying Images from Micro SD card on ST7735 Display using Arduino.
Simple Ultrasonic Radar.

Weather Station using BME280 Temperature and humidity sensor and Arduino.

report this ad

Конвертирование изображения в шестнадцатеричный код

Для того, чтобы иметь возможность отображения изображения на графическом ЖК дисплее необходимо знать шестнадцатеричный код (HEX code) данного изображения. Далее мы рассмотрим несколько шагов чтобы выполнить подобное конвертирование. Но перед этим удостоверьтесь в том, что размер вашего изображения не превышает 128х64.

Шаг 1. Уменьшите размер вашего изображения до 128х64 или менее. Это можно сделать в любом графическом редакторе, например, MS paint.

Шаг 2. Сохраните изображение в формате bmp (“image_name.bmp”).

Шаг 3. Конвертирование полученного изображения в шестнадцатеричный код. Для этого можно использовать, к примеру, редактор GIMP 2. На следующем рисунке показан пример открытия изображения в данном редакторе.

Шаг 4. После открытия изображения (в формате bmp) в редакторе GIMP 2 сохраните его в формате “.xbm” (X BitMap) (см. рисунок ниже). После этого откройте полученный файл в любом текстовом редакторе, например, Notepad, и вы получите шестнадцатеричный код изображения.

Сначала выберите опцию «Export as» в редакторе.

Затем выберите формат, показанный на следующем рисунке, и нажмите кнопку Export.

После этого экспортирования вы получите файл в формате “.xbm”. Откройте его с помощью Notepad (или любого другого аналогичного редактора) и вы получите шестнадцатеричный код изображения как показано на следующем рисунке.

Downloads

Quick start example #

Here is a simple example of using quickstart nodes. For example, We use an ST7735 128×160 SPI display of a “G” type. Connect it to a microcontroller according to the wiring scheme.

Use the hardware SPI bus. Connect the display’s pin to the controller port, and the pin to the port. The breakout board of the display used in this example has an pin, so it should be wired. The pin is connected to the port.

Let’s display a pink filled circle in the center of the screen.

Put the quickstart node onto the patch and fill in ports values , , and according to the wiring scheme. Using the XOD graphics library, create a new with the size of a display screen. The width of the is and the height is . The background color is set to black () and the foreground color to pink ().

To add the filled circle to the scene, place the node onto the patch. To make this node be a part of the graphic tree, link its pin with the pin of the . Set the circle coordinates for the center of the screen, for , and for . The radius can be random, for example, .

The scene is ready. Connect the output pin of the node to the pin of the quickstart node. Take a look at what the patch should be.

Upload this patch and see what is displayed on the screen of the device.

You can change all parameters of the graphic nodes in a real-time. For example, you can change the position of the circle or the background color of the canvas using tweaks. Add two nodes for the and circle coordinates. Add the node for the pin. Flash the patch in debug mode and manage colors and coordinates.

The parameters of graphic nodes can be changed using other nodes. For example, you can change the color of the circle and its size using a potentiometer. Remove tweak nodes from the patch. Place new nodes , , and node from the library. Connect the potentiometer to the Arduino port.

With the combination of and , the radius of the circle changes from to pixels. With the combination of and , the hue of the foreground color of the canvas changes from to . Upload the patch and manage the graphics changes.

Похожие записи:

Как выставить зажигание с помощью стробоскопа? Сигнализация действия защиты и автоматики Подключение потолочного светильника со светодиодами Книги по ардуино Правильная пайка проводов паяльником Птф солярис