Własny Stream Deck z Arduino UNO R4 i wyświetlaczem dotykowym

[H1M4W4R1]

Panele z programowalnymi przyciskami są przydatne nie tylko podczas transmisji internetowych. Mogą przyspieszyć codzienną pracę, uruchamiać skróty klawiaturowe, sterować programami graficznymi, obsługiwać funkcje w grach i symulatorach, a nawet wpisywać przygotowane wcześniej polecenia tekstowe.

Gotowe urządzenia tego typu są wygodne, ale ich cena może być stosunkowo wysoka, szczególnie jeżeli potrzebujemy tylko kilku lub kilkunastu prostych funkcji, a mamy kilka komponentów w szufladzie. Z tego powodu postanowiłem zbudować własny panel dotykowy działający podobnie do popularnych urządzeń Stream Deck. Projekt powstał we współpracy z firmą Botland, a Cały kod źródłowy projektu został udostępniony w repozytorium GitHub.

Podstawą projektu jest Arduino UNO R4 oraz 4-calowy ekran dotykowy WaveShare w formie nakładki zgodnej ze standardowym układem złączy Arduino. Po podłączeniu do komputera urządzenie jest wykrywane jako standardowa klawiatura i mysz USB HID. Nie wymaga instalowania sterowników, parowania ani uruchamiania dodatkowego programu w tle. Naciśnięcie kafelka na ekranie powoduje bezpośrednie wysłanie zdefiniowanej kombinacji klawiszy.

Budowa urządzenia

W projekcie wykorzystałem Arduino UNO R4 WiFi, jednak do docelowej wersji nie jest potrzebna komunikacja bezprzewodowa. Z tego względu możliwe jest również zastosowanie tańszego Arduino UNO R4 Minima, które korzysta z tego samego mikrokontrolera i ma zgodny układ mechaniczny wyprowadzeń. Przy kompilowaniu programu dla wersji Minima należy jedynie wybrać odpowiednie środowisko płytki.

Za wyświetlanie interfejsu odpowiada 4-calowy ekran TFT WaveShare wyposażony w kontroler obrazu ILI9486 oraz rezystancyjny panel dotykowy obsługiwany przez kontroler XPT2046. Sterownik ekranu został dołączony bezpośrednio do projektu i uzupełniony o poprawki umożliwiające współpracę z Arduino. Urządzenie jest zasilane i komunikuje się z komputerem za pomocą jednego przewodu USB. Po uruchomieniu wyświetla siatkę kafelków. Każdy kafelek składa się z ikony, krótkiego podpisu oraz kolorowego akcentu ułatwiającego szybkie rozpoznanie funkcji.

Domyślna konfiguracja zawiera między innymi funkcje kopiowania, wklejania, wycinania, cofania i ponawiania operacji. Dostępny jest również przykładowy kafelek wpisujący tekst oraz kafelek otwierający osobną stronę ustawień. Nieaktywne pozycje mogą zostać wyświetlone jako wyszarzone miejsca przeznaczone na przyszłe funkcje.

Interfejs może wyświetlać do 12 kafelków. W orientacji pionowej układ tworzy trzy kolumny i maksymalnie cztery rzędy, natomiast w poziomej – cztery kolumny i maksymalnie trzy rzędy. Liczba i rozmieszczenie pól są obliczane automatycznie na podstawie przygotowanej konfiguracji.

Obudowa.zip

Elektronikę zamknąłem w obudowie wydrukowanej z czarnego filamentu PETG. Materiał ten dobrze nadaje się do podobnych projektów, ponieważ jest bardziej odporny mechanicznie i temperaturowo niż typowy PLA, a jednocześnie można go drukować na większości popularnych drukarek 3D.

Obudowa ukrywa płytkę i połączenie ekranu z Arduino. Dzięki pochyleniu panelu ekran jest czytelny podczas pracy przy biurku, a całe urządzenie może stać obok klawiatury bez zajmowania dużej ilości miejsca. Górna pokrywa obudowy oraz przewód USB powinny być wklejone z wykorzystaniem kleju na gorąco (w innym wypadku przewód może wypychać pokrywę, która jest mocowana na "wcisk".

Napotkane problemy

Pierwsza wersja projektu miała działać bezprzewodowo. Plan zakładał wykorzystanie komunikacji Bluetooth Low Energy oraz dodanie akumulatora, dzięki czemu panel można byłoby ustawić w dowolnym miejscu bez prowadzenia przewodu do komputera.

W praktyce największym problemem okazała się współpraca Arduino z systemem Windows w roli urządzenia BLE HID. Pomimo kolejnych prób konfiguracji komputer nie chciał poprawnie połączyć się z Arduino udającym bezprzewodową klawiaturę.

Problem nie wynikał z samej idei interfejsu ani obsługi ekranu, lecz z warstwy komunikacji BLE oraz sposobu, w jaki Windows wykrywał i obsługiwał przygotowane urządzenie HID. Po kilku próbach naprawienia i obejścia problemu uznałem, że dalsze komplikowanie projektu nie ma większego sensu.

Ostatecznie komunikacja Bluetooth została zastąpiona zwykłym USB HID. Rozwiązanie przewodowe okazało się znacznie prostsze i bardziej niezawodne. Po podłączeniu panel jest widoczny jako standardowa klawiatura oraz mysz, a naciśnięcia kafelków są przesyłane bez zauważalnych opóźnień. Nie trzeba również pamiętać o ładowaniu akumulatora ani ponownym parowaniu urządzenia.

Pozostała jednak jedna niedogodność związana z programowaniem Arduino UNO R4. Ponieważ firmware uruchamia interfejs HID już podczas startu, zwykłe wgrywanie nowego programu nie zawsze rozpoczyna się prawidłowo. W takim przypadku trzeba dwukrotnie szybko nacisnąć przycisk reset. Arduino przechodzi wtedy do bootloadera i ponownie udostępnia port potrzebny do wgrania firmware.

Podczas tworzenia własnych makr należy również zachować ostrożność. Błąd w konfiguracji może spowodować automatyczne wysyłanie niepożądanych znaków lub skrótów klawiaturowych. W czasie testów warto mieć łatwy dostęp do przewodu USB, aby w razie potrzeby szybko odłączyć urządzenie.

Jak dodawać i usuwać kafelki?

Konfiguracja kafelków znajduje się w pliku: src/main.cpp

Każda strona interfejsu korzysta z dwóch odpowiadających sobie tablic. Pierwsza określa wygląd kafelków, a druga definiuje wykonywane przez nie czynności. Elementy w obu tablicach muszą występować w tej samej kolejności. Pierwszy kafelek jest więc obsługiwany przez pierwszą akcję, drugi przez drugą i tak dalej.

Aby dodać kafelek zapisujący dokument za pomocą skrótu Ctrl+S, należy najpierw przygotować sekwencję klawiszy:

const sys_usb_hid_keyboard_stroke_t shortcut_save[] = { { KEY_LEFT_CTRL, 's', 0u } };

Każdy wpis zawiera klawisz modyfikujący, właściwy klawisz oraz czas jego przytrzymania w milisekundach. Wartość 0u powoduje użycie bezpiecznego, domyślnego czasu wynoszącego 20 ms. Jedna sekwencja może obecnie zawierać maksymalnie 16 kroków.

Następnie trzeba dodać widoczny kafelek do tablicy interfejsu:

{ &ui_icon_save, "Save", color_blue, true }

Poszczególne parametry oznaczają kolejno ikonę, podpis, kolor górnego paska oraz informację, czy kafelek jest aktywny.

W odpowiadającym mu miejscu tablicy akcji należy dodać:

{ app_key_action_sequence, shortcut_save, 1u }

Ostatnia wartość określa liczbę kroków zapisanych w sekwencji. W tym przypadku jest to jeden skrót – Ctrl+S.

Kafelek może też wpisywać dłuższy tekst. Poniższa sekwencja wpisze słowo build, a następnie zatwierdzi je klawiszem Enter:

const sys_usb_hid_keyboard_stroke_t shortcut_build[] = { { 0u, 'b', 0u }, { 0u, 'u', 0u }, { 0u, 'i', 0u }, { 0u, 'l', 0u }, { 0u, 'd', 0u }, { 0u, KEY_RETURN, 0u } };

Można w ten sposób tworzyć przyciski wpisujące często używane polecenia terminala, fragmenty tekstu, adresy lub krótkie odpowiedzi.

Nieaktywny kafelek przeznaczony na przyszłą funkcję można zdefiniować następująco:

{ &ui_icon_placeholder, "Future", 0u, false }

W tablicy akcji musi mu odpowiadać wpis:

{ app_key_action_none, nullptr, 0u }

Taki kafelek jest wyszarzony i nie reaguje na dotyk.

Aby całkowicie usunąć kafelek, należy skasować jego wpis zarówno z tablicy interfejsu, jak i z tablicy akcji. Nie wolno pozostawić samej akcji ani zmieniać kolejności tylko w jednej tablicy, ponieważ następne kafelki zaczęłyby wykonywać niewłaściwe funkcje. Po zmianie liczby elementów układ siatki zostanie dopasowany automatycznie.

Po dokonaniu zmian program można skompilować i wgrać z poziomu PlatformIO:

pio run pio run --target upload

Jak modyfikować ikony?

Ikony kafelków znajdują się w pliku: src/ui/ui_icons.cpp, zaś ich deklaracje są natomiast umieszczone w: include/ui/ui_icons.h

Każda ikona jest monochromatyczną bitmapą o rozdzielczości 32 × 32 piksele. Obraz jest zapisany w formacie jednobitowym, dlatego pojedyncza ikona zajmuje tylko 128 bajtów: 32 × 32 ÷ 8 = 128 bajtów

Takie rozwiązanie ogranicza zużycie pamięci mikrokontrolera i nie wymaga tworzenia dużego bufora obrazu. Ikony dołączone do projektu bazują na grafikach Font Awesome Free przygotowanych w formacie zgodnym z biblioteką Adafruit GFX.

Nową ikonę można przygotować w dowolnym edytorze graficznym. Najlepiej rozpocząć od obrazu 32 × 32 piksele, używać wyłącznie koloru czarnego i białego, a następnie przekonwertować grafikę do tablicy bajtów przeznaczonej dla Arduino.

Po wygenerowaniu bitmapy należy umieścić ją w ui_icons.cpp, na przykład:

static const uint8_t icon_save_bitmap[] PROGMEM = { // 128 bajtów danych bitmapy };

Następnie trzeba utworzyć deskryptor ikony zgodny ze strukturą używaną przez pozostałe grafiki:

const ui_icon_t ui_icon_save = { icon_save_bitmap, 32u, 32u };

W pliku nagłówkowym ui_icons.h należy dodać deklarację:

extern const ui_icon_t ui_icon_save;

Od tej chwili ikonę można przypisać do wybranego kafelka:

{ &ui_icon_save, "Save", color_blue, true }

Podczas korzystania z gotowych zestawów ikon trzeba pamiętać o sprawdzeniu ich licencji. Dotyczy to również grafik znalezionych w Internecie, nawet jeżeli są udostępniane bezpłatnie.

Oprócz samych ikon można zmieniać kolory akcentów. Są one zapisane w formacie RGB565, na przykład:

constexpr uint16_t color_teal = 0x0410u;

Kolor przypisuje się bezpośrednio do kafelka:

{ &ui_icon_save, "Save", color_teal, true }

Projekt obsługuje również jasny i ciemny motyw interfejsu. Wyboru dokonuje się podczas kompilacji za pomocą flag w pliku platformio.ini.

Potencjalna modyfikacja z USB-CDC i dedykowaną aplikacją

Obecna wersja działa całkowicie samodzielnie. Wszystkie kafelki, podpisy, ikony oraz skróty są zapisane bezpośrednio w firmware. Zaletą takiego podejścia jest brak zależności od dodatkowego oprogramowania – panel działa natychmiast po podłączeniu do niemal dowolnego komputera obsługującego klawiatury USB. Ma to jednak również ograniczenie. Każda zmiana układu wymaga edycji kodu, ponownej kompilacji oraz wgrania programu do Arduino.

Ciekawym kierunkiem rozwoju byłoby dodanie komunikacji USB-CDC, czyli wirtualnego portu szeregowego, oraz przygotowanie dedykowanej aplikacji na komputer. Program mógłby umożliwiać graficzne tworzenie stron, przeciąganie kafelków, wybór ikon, zmianę kolorów i przypisywanie akcji bez ingerowania w kod źródłowy.

Po zapisaniu konfiguracji aplikacja przesyłałaby ją do Arduino za pomocą prostego protokołu tekstowego lub binarnego. Urządzenie mogłoby przechowywać ustawienia w pamięci nieulotnej i odtwarzać je po każdym uruchomieniu.

USB-CDC pozwoliłoby również na komunikację w przeciwnym kierunku. Komputer mógłby przekazywać do panelu bieżące informacje, na przykład:

• stan mikrofonu,
• aktywność wybranej aplikacji,
• głośność systemową,
• status odtwarzania muzyki,
• temperaturę procesora,
• liczbę nieprzeczytanych wiadomości,
• aktualnie aktywny profil.

Dzięki temu kafelki nie musiałyby być jedynie statycznymi przyciskami. Mogłyby zmieniać podpis, kolor lub ikonę zależnie od stanu programu.

Dedykowana aplikacja mogłaby również wykonywać bardziej złożone działania niż standardowe skróty klawiaturowe. Przykładowy kafelek mógłby uruchomić wskazany program, wykonać skrypt, sterować OBS Studio, wysłać polecenie do systemu automatyki domowej albo przełączyć profil całego panelu.

Podsumowanie

Projekt pokazuje, że prosty odpowiednik urządzenia Stream Deck można zbudować bez projektowania własnej elektroniki. Arduino UNO R4, ekran dotykowy w formie shielda, przewód USB oraz drukowana obudowa wystarczą do stworzenia funkcjonalnego panelu skrótów.

Przejście z pierwotnie planowanego Bluetooth Low Energy na USB HID uprościło konstrukcję i wyeliminowało problemy z parowaniem urządzenia w systemie Windows. Panel działa przewodowo, ale w zamian oferuje niezawodne połączenie, brak zauważalnych opóźnień oraz pełną niezależność od dodatkowej aplikacji.