Arduino:Знакомство с Arduino/Знакомство с TFT-модулем Arduino - История изменений

EducationBot в 08:31, 8 июля 2023

2023-07-08T08:31:13Z

← Предыдущая версия		Версия от 12:31, 8 июля 2023
Строка 511:		Строка 511:

	<references />		<references />
			{{Навигационная таблица/Портал/Arduino}}

EducationBot в 07:18, 8 июля 2023

2023-07-08T07:18:26Z

← Предыдущая версия		Версия от 11:18, 8 июля 2023
Строка 1:		Строка 1:
	~~{{#setlogo:ArduinoCommunityLogo.png}}~~
	{{Arduino панель перехода}}		{{Arduino панель перехода}}
	{{Перевод от Сubewriter}}		{{Перевод от Сubewriter}}

EducationBot в 08:30, 20 мая 2023

2023-05-20T08:30:42Z

← Предыдущая версия		Версия от 12:30, 20 мая 2023
Строка 64:		Строка 64:
	Итак, начинаем скетч. Первым делом объявляем контакты, которые будем использовать, подключаем необходимые библиотеки и создаем экземпляр '''TFT'''-библиотеки:		Итак, начинаем скетч. Первым делом объявляем контакты, которые будем использовать, подключаем необходимые библиотеки и создаем экземпляр '''TFT'''-библиотеки:

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства		#include <TFT.h> // библиотека для используемого устройства
	#include <SPI.h>		#include <SPI.h>
Строка 82:		Строка 82:
	В блоке [[Arduino:Справочник языка Arduino/setup()‎\|setup()]] запускаем библиотеку при помощи функции begin() и '''«обнуляем»''' экран, заливая его черным цветом – это делается при помощи функции background().		В блоке [[Arduino:Справочник языка Arduino/setup()‎\|setup()]] запускаем библиотеку при помощи функции begin() и '''«обнуляем»''' экран, заливая его черным цветом – это делается при помощи функции background().

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	void setup(){		void setup(){
	myScreen.begin();		myScreen.begin();
Строка 92:		Строка 92:
	В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] рисуем линию – это делается функцией line(). Она принимает '''4''' аргумента: стартовые координаты '''X''' и '''Y''', а также конечные координаты '''X''' и '''Y'''. Чтобы нарисовать прямоугольник, воспользуемся функцией rect(). Она тоже принимает '''4''' аргумента: координаты X и Y для левого верхнего угла, а также ширину и высоту (оба – в пикселях). Работа с цветом осуществляется с помощью функций stroke() и fill() – они вызываются перед функциями создания прямоугольников. Функция stroke() меняет цвет линии прямоугольника, т.е. его контур. Функция fill() меняет цвет прямоугольника. Функция noStroke() отменяет рисование контура у всех прямоугольников, которые будут созданы после ее вызова. Если после этого снова вызвать функцию stroke(), то контуры снова начнут рисоваться.		В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] рисуем линию – это делается функцией line(). Она принимает '''4''' аргумента: стартовые координаты '''X''' и '''Y''', а также конечные координаты '''X''' и '''Y'''. Чтобы нарисовать прямоугольник, воспользуемся функцией rect(). Она тоже принимает '''4''' аргумента: координаты X и Y для левого верхнего угла, а также ширину и высоту (оба – в пикселях). Работа с цветом осуществляется с помощью функций stroke() и fill() – они вызываются перед функциями создания прямоугольников. Функция stroke() меняет цвет линии прямоугольника, т.е. его контур. Функция fill() меняет цвет прямоугольника. Функция noStroke() отменяет рисование контура у всех прямоугольников, которые будут созданы после ее вызова. Если после этого снова вызвать функцию stroke(), то контуры снова начнут рисоваться.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	void loop(){		void loop(){
	myScreen.stroke(255, 0, 0); // делаем цвет контура красным		myScreen.stroke(255, 0, 0); // делаем цвет контура красным
Строка 117:		Строка 117:
	Никаких контактов объявлять не нужно, а объект '''EsplloraTFT''' создается автоматически.		Никаких контактов объявлять не нужно, а объект '''EsplloraTFT''' создается автоматически.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства		#include <TFT.h> // библиотека для используемого устройства
	#include <SPI.h>		#include <SPI.h>
Строка 156:		Строка 156:
	В примере ниже будет точка, прыгающая по экрану. Сначала мы настроим скетч (так же, как в примере выше), добавим несколько переменных – для того, чтобы с их помощью отслеживать текущие и предыдущие координаты точки, а также следить за ее скоростью и направлением движения.		В примере ниже будет точка, прыгающая по экрану. Сначала мы настроим скетч (так же, как в примере выше), добавим несколько переменных – для того, чтобы с их помощью отслеживать текущие и предыдущие координаты точки, а также следить за ее скоростью и направлением движения.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства		#include <TFT.h> // библиотека для используемого устройства
	#include <SPI.h>		#include <SPI.h>
Строка 191:		Строка 191:
	В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] сначала обновляем позицию точки, добавляя к переменным для координат '''X''' и '''Y''' значения из переменных для направления. После этого проверяем, есть ли разница между текущими и предыдущими координатами точки. Если разница есть, стираем точку, окрашивая ее в фоновый цвет, а затем рисуем на новых координатах новую точку. Если точка убегает за пределы экрана, реверсируем ее направление.		В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] сначала обновляем позицию точки, добавляя к переменным для координат '''X''' и '''Y''' значения из переменных для направления. После этого проверяем, есть ли разница между текущими и предыдущими координатами точки. Если разница есть, стираем точку, окрашивая ее в фоновый цвет, а затем рисуем на новых координатах новую точку. Если точка убегает за пределы экрана, реверсируем ее направление.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	void loop(){		void loop(){
	// обновляем месторасположение точки:		// обновляем месторасположение точки:
Строка 227:		Строка 227:
	А вот версия для '''Esplora''':		А вот версия для '''Esplora''':

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)		#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
	#include <SPI.h>		#include <SPI.h>
Строка 290:		Строка 290:
	Далее переходим к [[Arduino:Справочник языка Arduino/setup()‎\|setup()]] и указываем здесь статический текст, т.е. текст, который меняться не будет. С помощью функции setTextSize() можно увеличить некоторые символы, тем самым выделив их на фоне другого текста. Динамический текст следует хранить в символьном массиве. Лучше всего для этого подойдет класс String – c его помощью легко обновлять находящийся в массиве текст.		Далее переходим к [[Arduino:Справочник языка Arduino/setup()‎\|setup()]] и указываем здесь статический текст, т.е. текст, который меняться не будет. С помощью функции setTextSize() можно увеличить некоторые символы, тем самым выделив их на фоне другого текста. Динамический текст следует хранить в символьном массиве. Лучше всего для этого подойдет класс String – c его помощью легко обновлять находящийся в массиве текст.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)		#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
	#include <SPI.h>		#include <SPI.h>
Строка 324:		Строка 324:
	В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] берем текущее время и сохраняем эту цифру в символьный массив. Перед завершением каждого цикла стираем текст, который был написан ранее, чтобы надписи не наслаивались друг на друга.		В блоке [[Arduino:Справочник языка Arduino/loop()\|loop()]] берем текущее время и сохраняем эту цифру в символьный массив. Перед завершением каждого цикла стираем текст, который был написан ранее, чтобы надписи не наслаивались друг на друга.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	void loop(){		void loop(){
	// берем истекшее время:		// берем истекшее время:
Строка 343:		Строка 343:
	Код для '''Esplora''':		Код для '''Esplora''':

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)		#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
	#include <SPI.h>		#include <SPI.h>
Строка 392:		Строка 392:
	Будучи прочитанным, изображение будет показано на указанных вами координатах. В данном случае оно начнет рисоваться с левого верхнего края экрана.		Будучи прочитанным, изображение будет показано на указанных вами координатах. В данном случае оно начнет рисоваться с левого верхнего края экрана.

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	// подключаем необходимые библиотеки:		// подключаем необходимые библиотеки:
	#include <SPI.h>		#include <SPI.h>
Строка 453:		Строка 453:
	Для '''Esplora''':		Для '''Esplora''':

	<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS~~" enclose="div~~">		<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS\|GESHI_FANCY_LINE_NUMBERS">
	// подключаем необходимые библиотеки:		// подключаем необходимые библиотеки:
	#include <SPI.h>		#include <SPI.h>

Myagkij: Замена текста — «» на «»

2016-12-13T21:44:05Z

Замена текста — «<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS">» на «<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">»

Новая страница

{{#setlogo:ArduinoCommunityLogo.png}}
{{Arduino панель перехода}}
{{Перевод от Сubewriter}}
{{Myagkij-редактор}}

=Знакомство с TFT-модулем Arduino<ref>[https://www.arduino.cc/en/Guide/TFT Getting Started with the Arduino TFT Screen // Retired]</ref>=

'''TFT-модуль Arduino''' – это '''TFT LCD''' дисплей с функцией подсветки и слотом для '''SD'''-карты (она расположен сзади). На этом дисплее можно рисовать текст, изображения и различные фигуры, и все это делается при помощи [https://www.arduino.cc/en/Reference/TFTLibrary библиотеки TFT].

[[File:ImageOnTFT_1.jpg|center]]

Распиновка '''TFT'''-модуля '''Arduino''' выполнена таким образом, чтобы соответствовать контактам на сокете '''Arduino Esplora''' и '''Arduino Robot'''. Впрочем, его можно использовать и с любой другой платой '''Arduino'''.

Библиотека '''TFT''' уже включена в '''IDE Arduino''' версии '''1.0.5''' и выше.

== Библиотека ==

'''Библиотека Arduino TFT''' – это расширенная версия библиотек [https://github.com/adafruit/Adafruit-GFX-Library Adafruit GFX] и [https://github.com/adafruit/Adafruit-ST7735-Library Adafruit STL7735]. Библиотека '''GFX''' отвечает за функции рисования, а '''STL7735''' – за функции, характерные для экрана, которым оснащен '''TFT'''-модуль '''Arduino'''. Сверх этого разработчиками '''Arduino''' были внесены специальные дополнения, чтобы библиотека '''TFT''' работала максимально похоже на '''Processing API'''.

'''Библиотека TFT''' обладает обратной совместимостью, благодаря чему вы по-прежнему можете пользоваться функциями '''Adafruit''', описанными [https://learn.adafruit.com/adafruit-gfx-graphics-library/overview здесь].

Кроме того, библиотека '''TFT''' полагается на [https://www.arduino.cc/en/Reference/SPI библиотеку SPI], поэтому ее нужно подключать ко всем скетчам, где используется '''TFT'''-модуль. Если вы собираетесь использовать '''SD'''-карту, то вам, к тому же, нужно будет подключить [https://www.arduino.cc/en/Reference/SD библиотеку SD].

== Особенности экрана ==

По умолчанию экран ориентирован так, что его ширина больше, чем высота. Верх экрана – это там, где находится надпись '''«SD CARD»'''. В таком положении ширина экрана составляет '''160 пикселей''', а высота – '''128 пикселей'''.

Чтобы понять, что такое координаты экрана, представьте решетку. Каждый квадратик в этой решетке – это пиксель, и координаты позволяют определить месторасположение этого пикселя, а также любого другого пикселя на экране. Точка в левом верхнем углу экрана имеет координаты '''«0, 0»'''. Если бы эта точка переместилась в правый верхний угол экрана, у нее были бы координаты '''«0, 159»'''. Если в левый нижний угол – '''«127, 0»'''. Если в правый нижний – '''«127, 159»'''.

Впрочем, экран можно использовать и в вертикальном (его также называют '''«портретным»''') режиме, и это делается вызовом функции setRotation(0). После того, как вы вызовете эту функцию, оси '''X''' и '''Y''' поменяются местами, а функции screen.width() и screen.height() – ролями.

== Цвета ==

Экран способен показывать '''16-битный цвет''': глубина цвета для синего и красного составляет '''5 бит (32 уровня)''', а для зеленого – '''6 бит (64 уровня)'''. Все вместе – как раз '''16 бит'''. Чтобы оставаться совместимой с другими приложениями, библиотека работает с '''8-битной глубиной цвета''' (для всех трех каналов – синего, красного и зеленого). Следовательно, цветовым диапазоном для всех трех цветов будет '''«0-255»''' (потому что '''8 бит''' – это '''256 уровней'''). Таким образом, библиотека как бы подтягивает '''5''' (для синего), '''5''' (для красного) и '''6''' (для зеленого) бит до необходимых '''8 бит'''.

== SPI-интерфейс – аппаратный и программный ==

Использование экрана можно настроить двумя способами. Первый – через аппаратный '''SPI'''-интерфейс '''Arduino'''. Второй – через ручное объявление всех необходимых контактов. Функциональной разницы между двумя этими методами нет, но если использовать аппаратный '''SPI'''-интерфейс, рисование происходит значительно быстрее.

Если вы планируете работать с '''SD'''-картой, то должны использовать именно аппаратный '''SPI'''-интерфейс.

Все примеры ниже написаны для аппаратного '''SPI'''-интерфейса.

== Подключение экрана ==

[[File:GLCD_pinUse_2.png|center]]

=== Подключение к Esplora ===

Сокет для '''TFT'''-модуля находится в самом центре '''Esplora'''. Вставьте модуль в сокет таким образом, чтобы синяя надпись '''«SD CARD»''' была рядом с '''USB'''-портом.

[[File:Esplora_GTFT_3.png|center]]

=== Подключение к другим Arduino ===

Чтобы подключить '''TFT'''-модуль к другой плате '''Arduino''', читайте [http://www.arduino.cc/en/Guide/TFTtoBoards это руководство].

== Пишем первый скетч ==

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

Сначала будут описаны инструкции для '''Uno''', '''Leonardo''' и других подобных плат. Инструкции для '''Esplora''' будут описаны чуть ниже.

Итак, начинаем скетч. Первым делом объявляем контакты, которые будем использовать, подключаем необходимые библиотеки и создаем экземпляр '''TFT'''-библиотеки:

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства
#include <SPI.h>

#define CS 10
#define DC 9
#define RESET 8

// объявляем контакты для Leonardo:
// #define CS 7
// #define DC 0
// #define RESET 1

TFT myScreen = TFT(CS, DC, RESET);
</syntaxhighlight>

В блоке [[Arduino:Справочник языка Arduino/setup()‎|setup()]] запускаем библиотеку при помощи функции begin() и '''«обнуляем»''' экран, заливая его черным цветом – это делается при помощи функции background().

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
void setup(){
myScreen.begin();
myScreen.background(0,0,0); // заливаем экран черным цветом
delay(1000); // пауза для драматического эффекта
}
</syntaxhighlight>

В блоке [[Arduino:Справочник языка Arduino/loop()|loop()]] рисуем линию – это делается функцией line(). Она принимает '''4''' аргумента: стартовые координаты '''X''' и '''Y''', а также конечные координаты '''X''' и '''Y'''. Чтобы нарисовать прямоугольник, воспользуемся функцией rect(). Она тоже принимает '''4''' аргумента: координаты X и Y для левого верхнего угла, а также ширину и высоту (оба – в пикселях). Работа с цветом осуществляется с помощью функций stroke() и fill() – они вызываются перед функциями создания прямоугольников. Функция stroke() меняет цвет линии прямоугольника, т.е. его контур. Функция fill() меняет цвет прямоугольника. Функция noStroke() отменяет рисование контура у всех прямоугольников, которые будут созданы после ее вызова. Если после этого снова вызвать функцию stroke(), то контуры снова начнут рисоваться.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
void loop(){
myScreen.stroke(255, 0, 0); // делаем цвет контура красным
myScreen.line(0, 10, myScreen.width(), 10); // рисуем на экране линию
delay(1000);

myScreen.noStroke(); // не рисуем контур для нижеследующих прямоугольников
myScreen.fill(0,255,0); // делаем цвет прямоугольника зеленым
myScreen.rect(0,20,myScreen.width(),10); // рисуем прямоугольник
delay(1000);

myScreen.fill(0,0,255); // делаем цвет прямоугольника синим
myScreen.stroke(255,255,255); // рисуем для прямоугольника белый контур
myScreen.rect(0,45,myScreen.width(),45); // рисуем более толстый прямоугольник
delay(1000);

myScreen.background(0,0,0); // перед тем, как начать снова, очищаем экран
delay(1000);
}
</syntaxhighlight>

Если вы используете '''Esplora''', структура скетча будет той же самой. Поскольку '''Esplora''' имеет сокет под '''TFT'''-модуль, контакты для дисплея – фиксированные. Кроме того, вы можете обращаться к дисплею, подключенному к '''Esplora''', через объект ''EsploraTFT''.

Никаких контактов объявлять не нужно, а объект '''EsplloraTFT''' создается автоматически.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства
#include <SPI.h>
#include <Esplora.h>

void setup(){
EsploraTFT.begin();
EsploraTFT.background(0,0,0); // заливаем экран черным цветом
delay(1000); // пауза для драматического эффекта
}

void loop(){
EsploraTFT.stroke(255, 0, 0); // делаем цвет линии красным
EsploraTFT.line(0, 10, EsploraLCD.width(), 10); // рисуем линию на экране
delay(1000);

EsploraTFT.noStroke(); // у следующего прямоугольника контур не рисуем
EsploraTFT.fill(0,255,0); // делаем цвет прямоугольника зеленым
EsploraTFT.rect(0,20,EsploraTFT.width(),20); // рисуем прямоугольник
delay(1000);

EsploraTFT.fill(0,0,255); // делаем следующий прямоугольник синим
EsploraTFT.stroke(255,255,255); // добавляем ему белый контур
EsploraTFT.rect(0,45,EsploraTFT.width(),50); // рисуем более толстый прямоугольник
delay(1000);

EsploraTFT.background(0,0,0); // очищаем экран перед тем, как начать заново
delay(1000);
}
</syntaxhighlight>

== Перемещение объектов по экрану ==

Чтобы создать иллюзию движения, объекты нужно рисовать и тут же стирать, а потом снова рисовать, но уже в другом месте. Если вы используете Processing на мощном компьютере, то можете рисовать объекты с помощью функции draw() и затем стирать их функцией background(), а после снова рисовать эти объекты функцией draw(), но уже на новых позициях. '''Arduino''', однако, работает не так быстро – ей нужно некоторое время, чтобы очистить экран вызовом функции background() из библиотеки '''TFT'''.

Таким образом, чтобы создать иллюзию движения, мы будем при каждом проходе через [[Arduino:Справочник языка Arduino/loop()|loop()]] проверять, двигается ли объект. Если двигается, то мы заливаем объект фоновым цветом, а затем перерисовываем его в новом месте. Таким образом, мы не обновляем все пиксели на экране, но иллюзия движения при этом все равно остается.

В примере ниже будет точка, прыгающая по экрану. Сначала мы настроим скетч (так же, как в примере выше), добавим несколько переменных – для того, чтобы с их помощью отслеживать текущие и предыдущие координаты точки, а также следить за ее скоростью и направлением движения.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства
#include <SPI.h>

#define CS 10
#define DC 9
#define RESET 8

// контакты для Leonardo
// #define CS 7
// #define DC 0
// #define RESET 1

TFT myScreen = TFT(CS, DC, RESET);

// начальная позиция точки в середине экрана:
int xPos = 80;
int yPos = 64;

// направление и скорость:
int xDir = 1;
int yDir = 1;

// переменные для отслеживания месторасположения точки:
int xPrev = xPos;
int yPrev = yPos;

void setup(){
myScreen.begin();
myScreen.background(0,0,0); // очищаем экран
}
</syntaxhighlight>

В блоке [[Arduino:Справочник языка Arduino/loop()|loop()]] сначала обновляем позицию точки, добавляя к переменным для координат '''X''' и '''Y''' значения из переменных для направления. После этого проверяем, есть ли разница между текущими и предыдущими координатами точки. Если разница есть, стираем точку, окрашивая ее в фоновый цвет, а затем рисуем на новых координатах новую точку. Если точка убегает за пределы экрана, реверсируем ее направление.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
void loop(){
// обновляем месторасположение точки:
xPos = xPos + xDir;
yPos = yPos + yDir;

// проверяем, отличается ли текущая локация от предыдущей:
if(xPos != xPrev || yPos != yPrev){
myScreen.stroke(0,0,0); // делаем цвет точки черным
myScreen.point(xPrev, yPrev); // закрашиваем точку, находящуюся на прежних координатах
}

// рисуем точку на текущих координатах:
myScreen.stroke(255,255,255);
myScreen.point(xPos, yPos);

// если координаты X или Y вышли за пределы экрана, реверсируем направление:
if(xPos >= 160 || xPos <= 0){
xDir = xDir*-1;
}
if(yPos >= 128 || yPos <= 0){
yDir = yDir*-1;
}

// обновляем предыдущее расположение точки:
xPrev=xPos;
yPrev=yPos;

// делаем задержку в 33 миллисекунды – это значит, что экран будет обновляться 30 раз в секунду:
delay(33);

}
</syntaxhighlight>

А вот версия для '''Esplora''':

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
#include <SPI.h>
#include <Esplora.h>

// начальная позиция точки (в середине экрана):
int xPos = 80;
int yPos = 64;

// направление движения и скорость:
int xDir = 1;
int yDir = 1;

// переменные для отслеживания месторасположения точки:
int xPrev, yPrev;

void setup(){
EsploraTFT.begin();
EsploraTFT.background(0,0,0);
}

void loop(){
// обновляем месторасположение точки:
xPos = xPos + xDir;
yPos = yPos + yDir;

// проверяем, отличается ли текущее месторасположение от предыдущего:
if(xPos != xPrev || yPos != yPrev){
EsploraTFT.stroke(0,0,0); // делаем цвет строки черным
EsploraTFT.point(xPrev, yPrev); // закрашиваем точку на предыдущих координатах
}

// рисуем точку на текущих координатах: EsploraTFT.stroke(255,255,255);
EsploraTFT.point(xPos, yPos);

// если координаты X или Y находятся за пределами экрана, реверсируем направление точки:
if(xPos >= 160 || xPos <= 0){
xDir = xDir*-1;
}
if(yPos >= 128 || yPos <= 0){
yDir = yDir*-1;
}

// обновляем предыдущее расположение точки:
xPrev=xPos;
yPrev=yPos;

// небольшая пауза:
delay(33);

}
</syntaxhighlight>

==Рисуем текст==

В библиотеку '''TFT''' уже встроен шрифт, с помощью которого на экране можно рисовать текст. По умолчанию ширина символов составляет '''5 пикселей''', а высота – '''8 пикселей'''. Впрочем, эти размеры можно поменять на '''10x16''', '''15x24''' и '''20х32'''.

Дополнительную информацию о возможностях шрифта читайте в [https://learn.adafruit.com/adafruit-gfx-graphics-library/graphics-primitives этой статье о графических примитивах на сайте Adafruit].

В скетче-примере ниже мы создадим простенький счетчик, меняющий цифры на экране каждые полсекунды. Как и в других примерах, в самом начале – т.е. перед тем, как приступать к блоку [[Arduino:Справочник языка Arduino/setup()‎|setup()]] – мы подключим к скетчу необходимые библиотеки и переменные.

Далее переходим к [[Arduino:Справочник языка Arduino/setup()‎|setup()]] и указываем здесь статический текст, т.е. текст, который меняться не будет. С помощью функции setTextSize() можно увеличить некоторые символы, тем самым выделив их на фоне другого текста. Динамический текст следует хранить в символьном массиве. Лучше всего для этого подойдет класс String – c его помощью легко обновлять находящийся в массиве текст.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
#include <SPI.h>

#define CS 10
#define DC 9
#define RESET 8

// контакты для Leonardo:
// #define CS 7
// #define DC 0
// #define RESET 1

TFT myScreen = TFT(CS, DC, RESET);

// переменная для отслеживания истекшего времени:
int counter = 0;
// символьный массив, из которого будут браться данные для отображения времени:
char printout[4];

void setup(){
myScreen.begin();
myScreen.background(0,0,0); // очищаем экран
myScreen.stroke(255,0,255);
// Статический текст:
myScreen.text("Running for",0,0);
myScreen.text("seconds",0,30);
// Увеличиваем размер экрана для текста в loop():
myScreen.setTextSize(3);
}
</syntaxhighlight>

В блоке [[Arduino:Справочник языка Arduino/loop()|loop()]] берем текущее время и сохраняем эту цифру в символьный массив. Перед завершением каждого цикла стираем текст, который был написан ранее, чтобы надписи не наслаивались друг на друга.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
void loop(){
// берем истекшее время:
counter = millis();
// конвертируем его в строку:
String elapsedTime = String(counter/1000);
// добавляем в массив:
elapsedTime.toCharArray(printout,4);
// показываем и стираем:
myScreen.stroke(255,255,255);
myScreen.text(printout,0,10);
delay(1000);
myScreen.stroke(0,0,0);
myScreen.text(printout,0,10);
}
</syntaxhighlight>

Код для '''Esplora''':

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
#include <SPI.h>
#include <Esplora.h>

// переменная для отслеживания истекшего времени:
long counter = 0;
// символьный массив, из которого будут браться данные для отображения времени:
char printout[4];

void setup(){
EsploraTFT.begin();
EsploraTFT.background(0,0,0); // очищаем экран
EsploraTFT.stroke(255,0,255);
// Статический текст:
EsploraTFT.text("Running for",0,0);
EsploraTFT.text("seconds",0,30);
// увеличиваем размер шрифта для текста в loop():
EsploraTFT.setTextSize(3);
}

void loop(){
// берем истекшее время:
counter = millis();
// конвертируем его в строку:
String elapsedTime = String(counter/1000);
// добавляем в массив:
elapsedTime.toCharArray(printout,4);
// показываем и стираем:
EsploraTFT.stroke(255,255,255);
EsploraTFT.text(printout,0,10);
delay(1000);
EsploraTFT.stroke(0,0,0);
EsploraTFT.text(printout,0,10);
}
</syntaxhighlight>

==Рисуем изображение с SD-карты==

В библиотеке '''TFT''' есть функционал для считывания с '''SD'''-карты '''BMP'''-файлов и их отображения на дисплее. Разрешение этих изображений может быть больше или меньше разрешения '''TFT'''-дисплея ('''160x128'''), однако в языке '''Arduino''' нет функции для того, чтобы подгонять показываемое изображение под экран. Таким образом, перед тем, как загружать на '''SD'''-карту какие-либо изображения, их нужно сначала вручную подогнать под нужное разрешение.

В примере ниже будет использован '''BMP'''-файл '''''«arduino.bmp»''''' c разрешением '''160х128''', хранящийся в корневой директории '''SD'''-карты. Соответственно, когда этот файл будет прочитан библиотекой и выведен на экран, он займет всю его площадь.

Вдобавок к библиотекам, которые вы указывали ранее (т.е. '''SPI''' и '''TFT'''), вам нужно будет также добавить библиотеку '''SD'''. Кроме того, для '''SD'''-слота нужно будет указать '''CS'''-контакт.

Для загрузки изображения используется класс '''PImage'''. Кроме того, с его помощью можно проверять, может ли файл быть прочитан библиотекой.

Будучи прочитанным, изображение будет показано на указанных вами координатах. В данном случае оно начнет рисоваться с левого верхнего края экрана.

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
// подключаем необходимые библиотеки:
#include <SPI.h>
#include <SD.h>
#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)

// Контакты для Uno:
#define SD_CS 11
#define LCD_CS 10
#define DC 9
#define RESET 8

// Контакты для Leonardo:
// #define SD_CS 8
// #define LCD_CS 7
// #define DC 0
// #define RESET 1

TFT myScreen = TFT(LCD_CS, DC, RESET);

// эта переменная будет представлять изображение, которое будет выведено на экран:
PImage image;

void setup() {
// Инициируем последовательный порт:
Serial.begin(9600);
while (!Serial) {
// ждем открытия порта (нужно для Leonardo)
}

// пытаемся получить доступ к SD-карте:
Serial.print("Initializing SD card..."); // "Инициализация SD-карты..."
if (!SD.begin(SD_CS)) {
Serial.println("failed!"); // "Неуспешно!"
return;
}
Serial.println("OK!");

// Инициализируем и очищаем LCD-экран:
myScreen.begin();
myScreen.background(255, 255, 255);

// загружаем изображение с SD-карты:
image = myScreen.loadImage("arduino.bmp");

// проверяем, правильно ли загрузилось изображение:
if (image.isValid() != true) {
Serial.println("error while loading arduino.bmp"); // "ошибка при загрузке arduino.bmp"
}

// рисуем изображение на экране:
myScreen.image(image, 0, 0);
}

void loop(){
// тут ничего не происходит
}
</syntaxhighlight>

Для '''Esplora''':

<syntaxhighlight lang="c" line="GESHI_NORMAL_LINE_NUMBERS|GESHI_FANCY_LINE_NUMBERS" enclose="div">
// подключаем необходимые библиотеки:
#include <SPI.h>
#include <SD.h>
#include <TFT.h> // библиотека для используемого устройства (т.е. для TFT-модуля)
#include <Esplora.h>

// CS-контакт (т.е. контакт для сигнала «выбор кристалла») для SD-карты:
#define SD_CS 8

// эта переменная для изображения, которое будет нарисовано:
PImage image;

void setup() {
// инициализируем последовательный порт:
Serial.begin(9600);
while (!Serial) {
// ждем открытия последовательного порта
}

// пытаемся получить доступ к SD-карте
Serial.print("Initializing SD card..."); // "Инициализация SD-карты..."
if (!SD.begin(SD_CS)) {
Serial.println("failed!"); // "Неуспешно!"
return;
}
Serial.println("OK!");

// инициализируем и очищаем LCD-экран:
EsploraTFT.begin();
EsploraTFT.background(255, 255, 255);

// загружаем изображение с SD-карты:
image = EsploraTFT.loadImage("arduino.bmp");

// проверяем, правильно ли загрузилось изображение:
if (image.isValid() != true) {
Serial.println("error while loading arduino.bmp"); // "ошибка при загрузке arduino.bmp"
}

// рисуем изображение на экране:
EsploraTFT.image(image, 0, 0);
}

void loop(){
// здесь ничего не происходит
}
</syntaxhighlight>

== Что дальше ==

Теперь, когда мы разобрались с базовым функционалом '''TFT'''-модуля, можно приступить к более углубленному изучению темы. [https://www.arduino.cc/en/Reference/TFTLibrary Здесь] можно почитать об '''API''' библиотеки '''TFT''' и найти другие скетчи-примеры. [http://arduino.cc/en/Main/GTFT Здесь] можно более подробно почитать о различных компонентах дисплея. [https://learn.adafruit.com/adafruit-gfx-graphics-library/overview Здесь] можно прочесть о функциях графической библиотеки '''Adafruit''', которые не были описаны в этом руководстве.

=См.также=

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

<references />