Arduino с сензорен екран: 16 стъпки

2024 Автор: John Day | [email protected]. Последно модифициран: 2024-01-30 07:53

Искате ли да създадете по -персонализирани менюта и по -добри интерфейси човек/машина? За такива проекти можете да използвате Arduino и сензорен екран. Звучи ли тази идея примамливо? Ако е така, вижте видеото днес, където ще ви покажа монтаж с Mega Arduino и сензорен екран. Ще видите как да направите желаните дизайни на екрана, както и как да определите региона на екрана, който да докоснете и активирате конкретна команда. Подчертавам, че избрах да използвам Arduino Mega поради неговото количество щифтове.

Така че днес ще ви запозная с дисплея със сензорен екран, неговите графични функции и как да хванете точката на докосване на екрана. Нека също така създадем пример, съдържащ всички елементи, като позициониране, писане, проектиране на форми, цветове и докосване.

Стъпка 1: Arduino Mega 2560

Стъпка 2: TFT LCD щит 2.4"

Този дисплей, който използваме в нашия проект, има интересна функция: той има SD карта. Писането и четенето, свързани с това, обаче ще бъдат показани в друг видеоклип, който скоро ще продуцирам. Целта на днешния урок е да се обърне специално внимание на графичните и сензорните функции на този дисплей.

Характеристики:

Размери на екрана: 2,4 инча

Слот за MicroSD карта

Цветен LCD: 65K

Драйвер: ILI9325

Резолюция: 240 x 320

Сензорен екран: 4-жичен резистивен сензорен екран

Интерфейс: 8 битови данни, плюс 4 контролни линии

Работно напрежение: 3.3-5V

Размери: 71 x 52 x 7 мм

Стъпка 3: Библиотеки

Добавете библиотеките:

"Adafruit_GFX"

"SWTFT"

"Тъч скрийн"

Щракнете върху връзките и изтеглете библиотеките.

Разархивирайте файла и го поставете в папката библиотеки на Arduino IDE.

C: / Програмни файлове (x86) / Arduino / библиотеки

Забележка

Преди да стартираме нашата програма, трябва да се обърнем към нещо важно: калибрирането на TOUCH.

Използвайки проста програма за получаване на точките на допир на дисплея, съхранявайте стойността на точките (x, y) във всеки край (маркирано в жълто на фигурата по -долу). Тези стойности са важни за картографиране на докосването до графичните точки на екрана.

#include // Portas de leitura das coordenadas do touchvoid #define YP A1 // Y+ е на Analog1 #define XM A2 // X- е на Analog2 #define YM 7 // Y- е на Digital7 #define XP 6 // X+ е на Digital6 // обект за манипулиране на събития с ток на тела TouchScreen ts = TouchScreen (XP, YP, XM, YM); void setup () {Serial.begin (9600); } void loop () {TSPoint touchPoint = ts.getPoint (); // pega o touch (x, y, z = pressao) Serial.print ("X:"); Serial.println (touchPoint.x); Serial.print ("Y:"); Serial.println (touchPoint.y); забавяне (1000); }

Стъпка 4: Функции

Нека сега разгледаме някои графични функции, които библиотеките могат да ни предложат.

1. drawPixel

Функцията drawPixel отговаря за рисуването на една точка на екрана в дадената точка.

void drawPixel (int16_t x, int16_t и, uint16_t цвят);

2. drawLine

Функцията drawLine отговаря за начертаването на линия от две точки.

void drawLine (int16_t x0, int16_t y0, int16_t x1, int16_t y1, uint16_t цвят);

3. drawFastVLine

Функцията drawFastVLine отговаря за изчертаването на вертикална линия от точка и височина.

void drawFastVLine (int16_t x, int16_t y, int16_t h, uint16_t цвят);

4. drawFastHLine

Функцията drawFastHLine отговаря за изчертаване на хоризонтална линия от точка и ширина.

void drawFastHLine (int16_t x, int16_t y, int16_t w, uint16_t цвят);

5. drawRect

Функцията drawRect е отговорна за изчертаване на правоъгълник на екрана, преминаване на начална точка, нейната височина и ширина.

void drawRect (int16_t x, int16_t y, int16_t w, int16_t h, uint16_t цвят);

6. fillRect

Функцията fillRect е същата като drawRect, но правоъгълникът ще бъде запълнен с дадения цвят.

void fillRect (int16_t x, int16_t y, int16_t w, int16_t h, uint16_t цвят);

7. drawRoundRect

Функцията drawRoundRect е същата като drawRect, но правоъгълникът ще има заоблени ръбове.

void drawRoundRect (int16_t x0, int16_t y0, int16_t w, int16_t h, int16_t радиус, uint16_t цвят);

8. fillRoundRect

Функцията fillRoundRect е същата като drawRoundRect, но правоъгълникът ще бъде запълнен с дадения цвят.

void fillRoundRect (int16_t x0, int16_t y0, int16_t w, int16_t h, int16_t радиус, uint16_t цвят);

9. drawTriangle

Функцията drawTriangle отговаря за изчертаването на триъгълник на екрана, преминавайки през точката на трите върха.

void drawTriangle (int16_t x0, int16_t y0, int16_t x1, int16_t y1, int16_t x2, int16_t y2, uint16_t цвят);

10. fillTriangle

Функцията fillTriangle е същата като drawTriangle, но триъгълникът ще бъде изпълнен с дадения цвят.

void fillTriangle (int16_t x0, int16_t y0, int16_t x1, int16_t y1, int16_t x2, int16_t y2, uint16_t цвят);

11. drawCircle

Функцията drawCircle е отговорна за изчертаване на окръжност от изходна точка и радиус.

void drawCircle (int16_t x0, int16_t y0, int16_t r, uint16_t цвят);

12. fillCircle

Функцията fillCircle е същата като drawCircle, но кръгът ще бъде запълнен с дадения цвят.

void fillCircle (int16_t x0, int16_t y0, int16_t r, uint16_t цвят);

13. fillScreen

Функцията fillScreen отговаря за запълването на екрана с един цвят.

void fillScreen (цвят uint16_t);

14. setCursor

Функцията setCursor отговаря за позиционирането на курсора за запис до дадена точка.

void setCursor (int16_t x, int16_t y);

15. setTextColor

Функцията setTextColor отговаря за присвояването на цвят на текста, който ще бъде написан. Имаме два начина да го използваме:

void setTextColor (uint16_t c); // задава цвета само на писанеvoid setTextColor (uint16_t c, uint16_t bg); // задаваме цвета на писане и цвета на фона

16. setTextSize

Функцията setTextSize отговаря за присвояването на размер на текста, който ще бъде написан.

void setTextSize (uint8_t s);

17. setTextWrap

Функцията setTextWrap е отговорна за прекъсване на линията, ако тя достигне границата на екрана.

void setTextWrap (логическо w);

18. setRotation

Функцията setRotation отговаря за завъртането на екрана (хоризонтално, портретно).

void setRotation (uint8_t r); // 0 (стандартно), 1, 2, 3

Стъпка 5: Пример

Ще създадем програма, в която ще използваме по -голямата част от ресурсите, които дисплеят ни предоставя.

Нека напишем някои низове в различни размери, да създадем три геометрични фигури и да вземем събитието за докосване върху тях, всеки път, когато докоснем една от фигурите, ще имаме обратна връзка за името на фигурата точно под тях.

Стъпка 6: Библиотеки

Първо нека определим библиотеките, които ще използваме.

#include // responsável pela parte gráfica

#include // responseável por pegar os toques na tela

#include // comunicação com o дисплей

#include // comunicação com o дисплей

#include "math.h" // изчислителна потенция

Стъпка 7: Определя

Ще определим някои макроси за щифтовете, както и важните стойности, които ще използваме.

// Portas de leitura das coordenadas do touch #define YP A1 // Y+ #define XM A2 // X- #define YM 7 // Y- #define XP 6 // X+ // valores encontrados através da calibração do touch // faça um código simples para imprimir os valores (x, y) a cada toque // então encontre os valores nas extremidades max/min (x, y) #define TS_MINX 130 #define TS_MINY 80 #define TS_MAXX 900 #define TS_MAXY 900 // tamanho dos textos #дефиниране TEXT_SIZE_L 3 #определи TEXT_SIZE_S 1 10 #дефинирайте MAXPRESSURE 1000

Продължаваме с дефиницията на някои макроси.

// Associa o nome das cores aos valores korespondentes #define BLACK 0x0000 #deteine RED 0xF800 #define GREEN 0x07E0 #define CYAN 0x07FF #deteine YELLOW 0xFFE0 #deteine WHITE 0xFFFF // dados de criaçusoo do circulodo 30; const int кръг_x = 240; const int кръг_у = 125; // обект за манипулиране на събития с токове на тела TouchScreen ts = TouchScreen (XP, YP, XM, YM); // обект за манипулиране на парте графика SWTFT tft;

Стъпка 8: Настройка

В настройката ще инициализираме нашия графичен обект за управление и ще направим първите конфигурации.

void setup () {Serial.begin (9600); // reseta o objeto da lib grafica tft.reset (); // inicializa objeto controlador da lib grafica tft.begin (); забавяне (500); // ротация на тела за пейзаж tft.setRotation (1); // pinta a tela toda de preto tft.fillScreen (BLACK); // chama a função para iniciar nossas configurações initialSettings (); }

Стъпка 9: Цикъл

В цикъла ще вземем точката, в която докосваме екрана, и ще видим дали докосването е станало на някоя от фигурите.

void loop () {TSPoint touchPoint = ts.getPoint (); // pega o touch (x, y, z = pressao) pinMode (XM, OUTPUT); pinMode (YP, OUTPUT); // mapeia o ponto de touch para o (x, y) grafico // o fato de termos rotacionado a tela para пейзаж implica no X receber o mapeamento de Y TSPoint p; p.x = карта (touchPoint.y, TS_MINY, TS_MAXY, 0, 320); p.y = карта (touchPoint.x, TS_MINX, TS_MAXX, 240, 0); // проверява се, че няма toque foi suficiente if (touchPoint.z> MINPRESSURE && touchPoint.z <MAXPRESSURE) {// проверява се, че няма да се повтаря if (pointInRect (p)) {writeShape ("Rect"); } // проверява се, че няма триъгълник, ако if (pointInsideTriangle (TSPoint (110, 150, 0), TSPoint (150, 100, 0), TSPoint (190, 150, 0), p)) {writeShape ("Triangle"); } // проверява се, че не се използва circolo if if (pointInCircle (p)) {writeShape ("Circle"); }}}

Стъпка 10: Проверете дали докосваме кръга

В тази стъпка се занимаваме с инициализация на екрана и определяме цветовете на текстовете, които да се показват.

/ *Desenha na tela os elementos */ void initialSettings () {tft.setTextColor (БЯЛ); tft.setTextSize (TEXT_SIZE_S); tft.println ("ДОСТЪП"); tft.setTextColor (ЖЪЛТ); tft.setTextSize (TEXT_SIZE_M); tft.println ("MEU BLOG"); tft.setTextColor (ЗЕЛЕН); tft.setTextSize (TEXT_SIZE_L); tft.println ("FERNANDOK. COM"); createRect (); createTriangle (); createCircle (); tft.setCursor (FEEDBACK_LABEL_X, FEEDBACK_LABEL_Y); tft.setTextColor (CYAN); tft.setTextSize (TEXT_SIZE_L); tft.println ("SHAPE:"); }

Стъпка 11: Функции за създаване на геометрични фигури

Създаваме правоъгълник, триъгълник и кръг с произхода, който определяме.

// cria um retangulo com origem (x, y) = (10, 100) // ширина = 80 e височина = 50 void createRect () {tft.fillRect (10, 100, 80, 50, RED); tft.drawRect (10, 100, 80, 50, БЯЛ); } // cria um triangulo com os vertices: // A = (110, 150); В = (150, 100); C = (190, 150) void createTriangle () {tft.fillTriangle (110, 150, 150, 100, 190, 150, ЖЪЛТО); tft.drawTriangle (110, 150, 150, 100, 190, 150, БЯЛ); } // cria um circulo com origem no ponto (x, y) = (240, 125) e raio = 30 void createCircle () {tft.fillCircle (240, 125, 30, GREEN); tft.drawCircle (240, 125, 30, БЯЛ); }

Стъпка 12: Проверете дали докосваме правоъгълника

Тази функция проверява дали точката е вътре в правоъгълника.

// Função que verifica se o ponto está dentro do retângulobool pointInRect (TSPoint p) {// max/min X do retangulo if (px> = 10 && px <= 90) {// max/min Y do retangulo if (py = 100) {return true; }} return false; }

Стъпка 13: Проверете дали докосваме кръга

Това е същото като с кръга.

// distancia entre pontos D = raiz ((xb-xa)^2 + (yb-ya)^2) // vefifica se o ponto está dentro do circulo // se a distancia do ponto pra origem do circulo for menor ou igual ao raio, ele está dentro bool pointInCircle (TSPoint p) {float distance = sqrt (pow (px - кръг_x, 2) + pow (py - кръг_y, 2)); if (разстояние <= кръг_радиус) {връщане true; } return false; }

Стъпка 14: Проверете дали докосваме триъгълника

Същата проверка на тази на точката се извършва и в триъгълника.

// Função que verifica se o ponto p esta dentro do triangulo ABC // Se estiver dentro retorna TRUE senão retorna FALSE bool pointInsideTriangle (TSPoint a, TSPoint b, TSPoint c, TSPoint p) {float ABC = триъгълникArea (a, b, c); поплавък ACP = триъгълникArea (a, c, p); поплавък ABP = триъгълникArea (a, b, p); поплавък CPB = триъгълникArea (c, p, b); if (ABC == ACP+ABP+CPB) {връщане true; } return false; } // Função que изчислява площ de um triangulo com base nos pontos x, y плаващ триъгълникArea (TSPoint a, TSPoint b, TSPoint c) {return fabs (((bx - ax)*(cy - ay) - (cx - брадва) * (по - ay))/2); }

Стъпка 15: Функция за отпечатване на името на докоснатия обект

Тук изписваме на екрана името на използваната геометрична фигура.

// escreve na tela o nome da figura geométrica que foi tocadavoid writeShape (Форма на низ) {tft.fillRect (FEEDBACK_TOUCH_X, FEEDBACK_TOUCH_Y, 170, 30, BLACK); tft.setCursor (FEEDBACK_TOUCH_X, FEEDBACK_TOUCH_Y); tft.setTextSize (TEXT_SIZE_G); tft.setTextColor (БЯЛ); tft.println (форма); }

Стъпка 16: Файлове

Изтеглете файловете:

АЗ НЕ

PDF