Arduino:Примеры/TFTGraph

Материал из Онлайн справочника
Перейти к навигации Перейти к поиску

Перевод: Максим Кузьмин (Cubewriter) Контакты:</br>* Skype: cubewriter</br>* E-mail: cubewriter@gmail.com</br>* Максим Кузьмин на freelance.ru
Проверка/Оформление/Редактирование: Мякишев Е.А.


Построение графика на TFT-экране [1]

GLCD GraphDemosm.png

Этот пример для TFT-экрана Arduino считывает данные с потенциометра, а затем в графическом виде отображает их на экране. То есть он аналогичен «График» из раздела «Связь».

Необходимое оборудование

  • Плата Arduino Uno;
  • TFT-экран Arduino;
  • Макетная плата Breadboard;
  • Провода-перемычки;
  • Потенциометр на 10 кОм;

Цепь

Подключите контакты с питанием и «землей» к макетной плате.

GLCD text1.png

Подключите к макетной плате потенциометр: боковые контакты к «земле» и питанию, а центральный – к 0-ому аналоговому контакту.

GLCD text2.png

Подключите TFT-экран к макетной плате. Подключить его нужно той стороной, где находятся стрелочка и маленькая голубая полоска. Также обратите внимание на ориентацию экрана. На этих рисунках он подсоединен вверх тормашками.

GLCD text3.png

Контакты BL и +5V подключите к питанию, а GND – к «земле». CS-LD подключите к 10-ому контакту, DC – к 9-ому, RESET – к 8-ому, MOSI – к 11-ому, а SCK – к 13-ому. В случае с Leonardo вам надо будет использовать другие контакты, читайте об этом на странице о TFT-экране или в коде ниже.

GTFT text large.png

Код

Чтобы использовать экран, сначала подключаем библиотеки SPI и TFT.

1 #include <SPI.h>
2 #include <TFT.h>

Определяем контакты, с помощью которых будем управлять экраном, а также создаем экземпляр класса TFT под названием TFTscreen. Будем обращаться к нему всякий раз, когда возникнет необходимость работать с экраном.

1 #define cs   10
2 #define dc   9
3 #define rst  8  
4 
5 TFT TFTscreen = TFT(cs, dc, rst);

Создаем переменную, которой будет храниться позиция X-оси графика. Мы будем увеличивать ее значение при каждом проходе через loop(). В блоке setup() инициализируем экран и заливаем экран каким-нибудь приятным цветом.

1 int xPos = 0;
2 
3 void setup(){
4   TFTscreen.begin();
5   TFTscreen.background(250,16,200); 
6 }

В секции loop() считываем данные от потенциометра, а затем подгоняем полученные значения к высоте экрана.

1 void loop(){
2   int sensor = analogRead(A0);
3   int graphHeight = map(sensor,0,1023,0,LCDscreen.height());

Цвет строки задаем таким, чтобы он контрастировал с фоновым цветом. Далее рисуем линию – она будет начинаться в нижней части экрана, а ее длина будет зависеть от значения, полученного от потенциометра.

1 TFTscreen.stroke(250,180,10);
2   TFTscreen.line(xPos, TFTscreen.height() - graphHeight, xPos, TFTscreen.height());

Перед закрытием блока loop() проверяем, не убежала ли линия графика за пределы экрана. Если убежала, стираем все и начинаем с «0» на оси X.

1 if (xPos >= 160) {
2     xPos = 0;
3     TFTscreen.background(250,16,200); 
4   } 
5   else {
6     xPos++;
7   }
8   delay(16);
9 }

Весь код полностью – ниже:

 1 /*
 2 Построение графика на TFT-экране
 3 
 4 Этот пример для TFT-экрана Arduino считывает данные с датчика,
 5 подключенного к 0-ому аналоговому контакту, а затем в графическом 
 6 виде выводит их на экране.
 7 
 8 Этот код не защищен авторским правом.
 9 
10 Создан 15 апреля 2013 Скоттом Фитцджеральдом (Scott Fitzgerald).
11 
12 http://www.arduino.cc/en/Tutorial/TFTGraph
13 */
14 
15 #include <TFT.h>  // библиотека TFT-экрана Arduino
16 #include <SPI.h>
17 
18 // Определяем контакты для Arduino Uno:
19 #define cs   10
20 #define dc   9
21 #define rst  8
22 
23 // Определяем контакты для Arduino Leonardo (раскомментируйте, чтобы использовать):
24 // #define cs   7
25 // #define dc   0
26 // #define rst  1
27 
28 TFT TFTscreen = TFT(cs, dc, rst);
29 
30 // Позиция линии на экране по оси X:
31 int xPos = 0;
32 
33 void setup() {
34   // Инициализируем последовательный порт:
35   Serial.begin(9600);
36 
37   // Инициализируем дисплей:
38   TFTscreen.begin();
39 
40   // Очищаем экран, заливая его приятным цветом:
41   TFTscreen.background(250, 16, 200);
42 }
43 
44 void loop() {
45   // Считываем данные от датчика и подгоняем их к высоте экрана:
46   int sensor = analogRead(A0);
47   int drawHeight = map(sensor, 0, 1023, 0, TFTscreen.height());
48 
49   // Показываем данные о высоте на Serial Monitor:
50   Serial.println(drawHeight);
51 
52   // Рисуем линию и тоже закрашиваем ее в приятный цвет:
53   TFTscreen.stroke(250, 180, 10);
54   TFTscreen.line(xPos, TFTscreen.height() - drawHeight, xPos, TFTscreen.height());
55 
56   // Если линия достигает края экрана, стираем экран и начинаем сначала:
57   if (xPos >= 160) {
58     xPos = 0;
59     TFTscreen.background(250, 16, 200);
60   } else {
61     // Увеличиваем горизонтальную позицию:
62     xPos++;
63   }
64 
65   delay(16);
66 }

См.также

Внешние ссылки