Посмотрите на график Базовое управление графикой На последовательном экране STONE вы можете рисовать линии, треугольники, многоугольники, прямоугольники, квадраты, круги, дуги, цвета заливки, вырезать и вставлять и так далее.
Проектирование машины для раннего обучения с использованием последовательного сенсорного экрана STVI056WT-01 для определения форм по картинкам, распознавания слов по цветам и разработки развлекательного формата для определения правильных ошибок, оценки или прохождения уровня, чтобы дети могли научиться распознавать цвета, понимать основные формы и выучивать соответствующие слова в непринужденной и игровой форме.
Официальная видеопрезентация не дает реального эффекта от базового графического элемента управления, поэтому данная демонстрация дополнит его. Инструкции по рисованию передаются через связь между плата управления arduino и КАМЕННАЯ серийная осыпьn.
Кроме того, это примечание не включает в себя полное функциональное содержание основного графического элемента управления, только функции, используемые при использовании разработки, записанные тестируются на машине ОК, вы можете напрямую загрузить демонстрационный прогон.
Аппаратная среда для демонстрации показана на Рисунке 1, Рисунке 2 и Рисунке 3.
STONE официально поставляется с 2 платами, из которых квадратная - это плата загрузки USB, а длинная - плата USB для последовательной связи (и источник питания DC12V для последовательного экрана).
(Рисунок 1: Связь и подключение питания последовательного экрана STONE) (Рисунок 2: Схема подключения для загрузки файлов управления базовой графикой с экрана STONE)
(Рисунок 3: соединение TX, RX, GND между платой последовательного экрана STONE и платой разработки Arduino)
(Рисунок 4: Область рисования основного графического элемента управления, адрес переменной и другие настройки параметров)
После выбора элемента управления Basicgraphics в меню STONE TOOLBox (программное обеспечение для проектирования графического интерфейса пользователя) Конфигурация переменной (D) и настройки области рисования и параметров адреса переменной, инструкция 0x82 используется для записи в заданный адрес переменной памяти (здесь устанавливается 0x1000) После установки параметров области рисования и адреса переменной инструкция 0x82 используется для записи CMD + Data_pack_Num_Max + Data в установленный адрес памяти переменных (в данном случае 0x1000) для завершения реализации функций рисования. Конкретный код функции показан на рисунке 6, где есть инструкция рисования линии 0x0002, используя следующий пример.
(Рисунок 5: Базовый формат команды данных управления графикой)
(Рисунок 6: Иллюстрация команд рисования линии и прямоугольника для базового графического управления)
Инструкция рисования линии 0x0002, пример использования.
Чтобы соединить черную линию из координат (340, 200) с координатами (585, 200), инструкция
А5 5А 11 82 10 00 00 02 00 01 00 00 01 54 00 С8 02 49 00 С8
Нарисуйте три черные линии, замкнутые в треугольник с тремя вершинами в координатах (200, 200), (300, 200), (250, 100), и инструкция
A5 5A 19 82 10 00 00 02 00 03 00 00 00 00 C8 00 C8 01 2C 00 C8 00 FA 00 64 00 C8 00 C8
Вышеупомянутый 0x1000 - это адрес переменной базового графического элемента управления, 0x0002 - это код инструкции, 0x0001 и 0x0003 - это 1 строка и 3 строки соответственно, 0x0000 - это цветовой код, значение 0000 - черный, а значение ffff - ярко-белый. Другие мгновенные координаты XY каждой точки.
Пример рисования прямоугольника.
Координаты верхней левой вершины прямоугольника (340, 237), координаты правой нижней вершины (585, 340) цвет черный, команда
А5 5А 11 82 10 00 00 03 00 01 01 54 00 ЭД 02 49 01 54 00 00
Одновременно нарисуйте два прямоугольника (340, 237) - (585, 340), (324, 221) - (601, 356), команда
А5 5А 1Б 82 10 00 00 03 00 02 01 54 00 ЭД 02 49 01 54 00 00 01 44 00 ДД 02 59 01 64 FF FF
Вышеупомянутый 0x1000 - это адрес переменной основного графического элемента управления, 0x0003 - это код команды прямоугольника, 0x0001, 0x0002 - 1 прямоугольник, 2 прямоугольника, 0x0000, 0xffff - это цветовой код, значение 0000 - черный, значение fffff - яркое белый. Остальные - это координаты XY верхней левой вершины и нижней правой вершины каждого прямоугольника.
(Рисунок 7: Команды заливки прямоугольника и рисования круга для основного графического элемента управления)
Пример заливки прямоугольника.
Команда заливки черного прямоугольника (470, 200) ~ (550, 255)
A5 5A 11 82 10 00 00 04 00 01 01 D6 00 C8 02 26 00 FF 00 00 00
Пример рисования круга.
Центр круга (470, 200), R = 50 черный, инструкция
A5 5A 0F 82 10 00 00 05 00 01 01 D6 00 C8 00 32 00 00
Чтобы нарисовать два круга одновременно, центр A (470, 200) R = 50 и центр B (256, 200) R = 80, оба черных цвета, команда
A5 5A 17 82 10 00 00 05 00 02 01 D6 00 C8 00 32 00 00 01 00 00 C8 00 50 00 00
(Рисунок 8: Команда Arc для базового управления графикой)
Разрешение дуги составляет 0.5 градуса, 360 градусов соответствует 720, а 0 градусов соответствует вертикальному направлению вверх.
Пример дуги.
Верхняя дуга 315 градусов до начала - 45 градусов до конца, центр круга (300, 200) R = 80, черный, команда
A5 5A 13 82 10 00 00 0B 00 01 00 00 01 2C 00 C8 00 50 02 76 00 5A
По поводу цветов.
0x0000 - черный 0xffff - белый 0x00ff - синий 0xf000 - красный 0xfd60 - оранжевый
0xff60 - желтый 0x2f60 - зеленый
(Рисунок 9: Параметры и адреса чертежной доски интерфейса формы основного графического элемента управления)
(Рисунок 10: Параметры чертежной доски и адреса цветного интерфейса основного графического элемента управления)
Согласно адресу переменной, команда заливки зеленым цветом для (10, 80) ~ (630, 400) будет
А5 5А 11 82 60 00 00 04 00 01 00 0А 00 50 02 76 01 90 2f 60
Другие сходства, подробности см. В программном коде.
Код, продемонстрированный на видео, выглядит следующим образом.
/*
frank10
STONE и arduino COMM, основная графика воспроизводится в программе ..
Включает светодиод на одну секунду, затем выключается на одну секунду несколько раз. Светодиод сообщает нам, что плавный ход в порядке!
В образце две страницы: page1 - форма, page2 - corlor!
Этот пример кода находится в файле frank. 20210625
*/
// К выводу 13 подключен светодиод на большинстве плат Arduino.
// даем ему имя:
инт светодиод = 13;
int iYePian = 0; // 0x0020 для числа YePian!
// int iGongLu = 0; // 0x0180 для GongLu!
// int iLiuLiang = 0; // 0x0160 для The now LiuLiang!
int iJiao = 0; // 0x0260 для JieJuJiao!
int iGongLuWater = 0; // 0x0280 для The Water GongLu! значение 0-50000!
int iLed = 1; // время задержки num.
int iLed2 = 1; // время задержки num. 50 мс делают точку.
int iLed3 = 0; // время задержки num. 50 мс делают точку.
int iLed4 = 0; // время задержки num. 50 мс делают точку.
int iCurve0 = 0; // Значение кривой0. 50 мс делают точку.
int iCurve1 = 0; // Значение curve1 ,. 50 мс делают точку.
int iFlag0 = 1; // Флаг кривой 0 + или -; .1 - вверх, 0 - вниз.
int iFlag1 = 1; // Флаг кривой 1 + или -; .1 - вверх, 0 - вниз.
int iNum = 0; // читать в char num.
int iNum2 = 0; // читать в char num2 для ShuiDianZhan!
// int iPower = 2; // статуя ключа 0x0009
// int iMode = 2; // статуя ключа 0x000A
int iPowerWater = 2; // статуя ключа 0x0039
// процедура установки запускается один раз при нажатии кнопки сброса:
void setup () {
// инициализируем цифровой вывод как выход.
pinMode (светодиод, ВЫХОД);
Serial.begin (115200); // Открываем функцию последовательной связи и ждем, пока откроется последовательный порт
while (! Serial) {
; // ждем подключения последовательного порта. Требуется только для Леонардо
}
}
// процедура цикла запускается снова и снова бесконечно:
void loop () {
интервал inChar;
/ * —-----
if (iLed == 800) {
// ——- читать значение 0x0039 ———-
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x04); //длина
Serial.write (0x83); // читать!
Serial.write (0x00); // адрес ключа ShuiDianZhan Power!
Serial.write (0x39); // адрес клавиши включения ShuiDianZhan!
Serial.write (0x01); // 0x0039 (клавиша включения)
// ——— Возвращаемое значение STONE будет «A5 5A 06 83 00 39 01 00 01» ——
}
// Считываем информацию, отправляемую через последовательный порт:
если (Serial.available ()> 0) {inChar = Serial.read (); }
/*
сохранить бак.
потому что может иметь ключ чтения и работать с ключом.
программа представляет собой человеко-машинный интерфейс, в котором клавиша ввода выполняет определенную работу.
*/
// —-----
// —————————- Начало чтения ключа 0x0039 ———————————–
если (inChar == 0x39) {iNum2 = 1; }
если ((inChar == 0x01) && (iNum2 == 1)) {iNum2 = 2; }
если ((inChar == 0x00) && (iNum2 == 2)) {iNum2 = 3; }
если ((inChar == 0x01) && (iNum2 == 3)) {
iNum2 = 0;
if (iPowerWater! = 1) {
iPowerWater = 1; //включить!
iJiao = 0;
iGongLuWater = 0;
}
}
если ((inChar == 0x02) && (iNum2 == 3)) {
iNum2 = 0;
iPowerWater = 2; //выключить!
}
// —————— 0x0039 ключ прочитан нормально! iPowerWater в порядке! —————————-
// —-----
Задержка (1);
iLed + = 1;
iLed2 + = 1; // 50 мсек.
// —-----
// ——————————— 50 мс до начала точки ————————————–
if (iLed2 == 50) {
iLed2 = 1;
iLed4 + = 1; // 50 мсек.
if (iFlag0 == 1) {
iCurve0 + = 1; // 50 мсек.
if (iCurve0> = 150) {
iFlag0 = 0; // Отклонение iCurve0 вниз !.
}
}
if (iFlag0 == 0) {
iCurve0 - = 1; // 50 мсек.
if (iCurve0 <= 1) {
iFlag0 = 1; // Поднимается iCurve0 !.
}
}
if (iFlag1 == 1) {
if (iLed4> = 3) {
iCurve1 + = 1; // 50 мсек.
iLed4 = 0;
}
if (iCurve1> = 50) {
iFlag1 = 0; // Отклонение iCurve1 вниз !.
}
}
if (iFlag1 == 0) {
if (iLed4> = 3) {
iLed4 = 0;
iCurve1 - = 1; // 50 мсек.
}
if (iCurve1 <= 1) {
iFlag1 = 1; // Поднимается iCurve1 !.
}
}
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x06);
Serial.write (0x84); // записываем в кривую!
Serial.write (0x03); // Путь кривой,
Serial.write (iCurve0); // N = 1,
Serial.write (0x00);
Serial.write (iCurve1);
Serial.write (0x00);
}
// ——————————- 50 мс до конца точки —————————————
// —-----
if (iLed == 500) {
digitalWrite (светодиод, ВЫСОКИЙ); // включаем светодиод (HIGH - уровень напряжения)
// задержка (500); // ждем секунду, диапазон: 200-2000
}
if (iLed> = 1000) {
digitalWrite (светодиод, НИЗКИЙ); // выключаем светодиод, понижая напряжение
// задержка (500); // ждем секунду, диапазон: 200-2000
iLED = 1;
если (iNum <= 6) iNum + = 1; // поворот формы!
если (iNum == 6) iNum = 0; // поворот формы!
// ————————————– Красный - начало —————————————–
if (iNum == 1) {// треугольник! и красный!
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x19);
Serial.write (0x82);
Serial.write (0x10); // адресH базовой графики
Serial.write (0x00); // адресL базовой графики
Serial.write (0x00); // Делаем строку CMD
Serial.write (0x02); // Делаем строку CMD
Serial.write (0x00); // номер строки
Serial.write (0x03); // Номер строки.
Serial.write (0x00); // colorH черный
Serial.write (0x00); // цветL
Serial.write (0x00); // pointX1H
Serial.write (0xc8); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0xc8); // pointY1L
Serial.write (0x01); // pointX2H
Serial.write (0x2C); // pointX2L.
Serial.write (0x00); // pointY2H
Serial.write (0xC8); // pointY2L
Serial.write (0x00); // pointX3H
Serial.write (0xFA); // pointX3L
Serial.write (0x00); // pointY3H
Serial.write (0x64); // pointY3L
Serial.write (0x00); // pointX1H
Serial.write (0xc8); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0xc8); // pointY1L
//наполнять--
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x60); // адресH базовой графики page2
Serial.write (0x00); // адресL базовой графики pabe2
Serial.write (0x00); // Заливаем прямоугольник CMD
Serial.write (0x04); // Заливаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x00); // pointX1H
Serial.write (0x0A); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x50); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x76); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x90); // pointY2L
Serial.write (0xF0); // Красный цветH
Serial.write (0x00); // Красный цветL
}
// ————————————– Красный конец —————————————–
// ————————————– Желтый и дуга - начало —————————————–
if (iNum == 2) {// дуга! и желтый!
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x13);
Serial.write (0x82);
Serial.write (0x10); // адресH базовой графики page1
Serial.write (0x00); // адресL базовой графики pabe1
Serial.write (0x00); // Делаем дугу CMD
Serial.write (0x0B); // Делаем дугу CMD
Serial.write (0x00); // номер дуги
Serial.write (0x01); // Номер дуги.
Serial.write (0x00); // colorH черный
Serial.write (0x00); // colorL пусто
Serial.write (0x01); // центр окружности XH
Serial.write (0x2c); // центр круга XL
Serial.write (0x00); // центр круга YH
Serial.write (0xc8); // центр круга YL
Serial.write (0x00); // RH
Serial.write (0x50); // RL.
Serial.write (0x02); // Angle1H
Serial.write (0x76); // Угол1L
Serial.write (0x00); // Angle2H
Serial.write (0x5A); // Angle2L
//наполнять--
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x60); // адресH базовой графики page2
Serial.write (0x00); // адресL базовой графики pabe2
Serial.write (0x00); // Заливаем прямоугольник CMD
Serial.write (0x04); // Заливаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x00); // pointX1H
Serial.write (0x0A); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x50); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x76); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x90); // pointY2L
Serial.write (0xFF); // Желтый цветH
Serial.write (0x60); // Желтый цветL
}
// ————————————– Желтый и дуга - конец —————————————–
// ————————————– Зеленый и прямоугольник начало —————————————–
if (iNum == 3) {// прямоугольник! и зеленый!
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x10); // адресH базовой графики page1
Serial.write (0x00); // адресL базовой графики pabe1
Serial.write (0x00); // Делаем прямоугольник CMD
Serial.write (0x03); // Делаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x01); // pointX1H
Serial.write (0x54); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0xED); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x49); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x54); // pointY2L
Serial.write (0x00); // colorH черный
Serial.write (0x00); // colorL пусто
//наполнять--
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x60); // адресH базовой графики page2
Serial.write (0x00); // адресL базовой графики pabe2
Serial.write (0x00); // Заливаем прямоугольник CMD
Serial.write (0x04); // Заливаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x00); // pointX1H
Serial.write (0x0A); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x50); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x76); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x90); // pointY2L
Serial.write (0x2F); // Зеленый цветH
Serial.write (0x60); // Зеленый цветL
}
// ————————————– Зеленый и прямоугольник конец —————————————–
// ————————————– Оранжевый и квадрат - начало —————————————–
if (iNum == 4) {// квадрат! и оранжевый!
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x10); // адресH базовой графики page1
Serial.write (0x00); // адресL базовой графики pabe1
Serial.write (0x00); // Делаем прямоугольник CMD
Serial.write (0x03); // Делаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x01); // pointX1H
Serial.write (0x54); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x91); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x49); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x86); // pointY2L
Serial.write (0x00); // colorH черный
Serial.write (0x00); // colorL пусто
//наполнять--
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x60); // адресH базовой графики page2
Serial.write (0x00); // адресL базовой графики pabe2
Serial.write (0x00); // Заливаем прямоугольник CMD
Serial.write (0x04); // Заливаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x00); // pointX1H
Serial.write (0x0A); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x50); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x76); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x90); // pointY2L
Serial.write (0xFD); // оранжевый цветH
Serial.write (0x60); // оранжевый цветL
}
// ————————————– Апельсин и квадрат конец —————————————–
// ————————————– Синий и круг - начало —————————————–
if (iNum == 5) {// круг! и синий!
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x0F);
Serial.write (0x82);
Serial.write (0x10); // адресH базовой графики page1
Serial.write (0x00); // адресL базовой графики pabe1
Serial.write (0x00); // Делаем круг CMD
Serial.write (0x05); // Делаем круг CMD
Serial.write (0x00); // номер круга
Serial.write (0x01); // Номер круга
Serial.write (0x01); // центр окружности XH
Serial.write (0xD6); // центр круга XL
Serial.write (0x00); // центр круга YH
Serial.write (0xc8); // центр круга YL
Serial.write (0x00); // RH
Serial.write (0x32); // RL.
Serial.write (0x00); // colorH черный
Serial.write (0x00); // colorL пусто
//наполнять--
Serial.write (0xA5); // ”A5 ″ равно 165
Serial.write (0x5A); // «5A» равно 90
Serial.write (0x11);
Serial.write (0x82);
Serial.write (0x60); // адресH базовой графики page2
Serial.write (0x00); // адресL базовой графики pabe2
Serial.write (0x00); // Заливаем прямоугольник CMD
Serial.write (0x04); // Заливаем прямоугольник CMD
Serial.write (0x00); // номер прямоугольника
Serial.write (0x01); // Номер прямоугольника
Serial.write (0x00); // pointX1H
Serial.write (0x0A); // pointX1L
Serial.write (0x00); // pointY1H
Serial.write (0x50); // pointY1L
Serial.write (0x02); // pointX2H
Serial.write (0x76); // pointX2L.
Serial.write (0x01); // pointY2H
Serial.write (0x90); // pointY2L
Serial.write (0x00); // синий цветH
Serial.write (0xFF); // синий цветL
}
// —————————————– Синий и круг - конец —————————————–
Наконец, онлайн-отладка.
STONE TOOLBox (программное обеспечение для проектирования графического интерфейса пользователя) отредактирует загрузку файла экрана, загрузку файла кода Arduino, подключит источник питания, связь, включит питание, чтобы наблюдать за рисунком изображения и изменением цвета для достижения желаемого эффекта.
Код, продемонстрированный на видео, выглядит следующим образом.
(попытки настройки онлайн)
Источник: Plato Data Intelligence.