Kreator projektowania GUI dla ESP32 i Arduino
Jeśli kiedykolwiek próbowałeś zrobić przyzwoicie wyglądający interfejs na małym wyświetlaczu z ESP32 lub Arduino, znasz ten ból: matematyka pikseli, toporne biblioteki, układanie metodą prób i błędów. To wysysa radość z projektu. Właśnie dlatego zbudowaliśmy Lopaka.app — kreator GUI dla ESP32 i Arduino, który naprawdę wydaje się nowoczesny.
W tym wpisie przeprowadzę cię przez najszybszy sposób przejścia od pustego ekranu do idealnego co do piksela interfejsu na prawdziwym sprzęcie przy użyciu Lopaka. Działa z popularnymi bibliotekami graficznymi, takimi jak Adafruit_GFX, TFT_eSPI, U8g2, a nawet ESPHome.
Krok 1: Uruchom Lopaka w przeglądarce
Bez instalacji, bez konfiguracji. Po prostu przejdź do Lopaka, kliknij „Nowy projekt” i nazwij go, jak chcesz. Wybierz docelowy rozmiar wyświetlacza (OLED 128x64? TFT 320x240? Całkowicie zależy od ciebie) i wybierz bibliotekę graficzną, której użyjesz w swoim firmware.
Obsługiwane biblioteki:
- Adafruit_GFX
- TFT_eSPI
- U8g2 (dla tych ostrych monochromatycznych OLED-ów)
- ESPHome
- Micropython
- Flipper Zero, ESPHome, Inkplate itd.
Krok 2: Projektuj swój interfejs, jakby był rok 2025
Otrzymujesz edytor przeciągania i upuszczania, który przypomina Figmę, ale dla systemów wbudowanych. Wrzucaj kształty, tekst, ikony i bitmapy. Dostosowuj czcionki, wyrównuj elementy za pomocą linijek i siatek, powiększaj aż do piksela. Edytor daje ci prawdziwy widok 1:1 tego, co pojawi się na twoim urządzeniu.
Wszystko jest przechowywane w chmurze, więc możesz wrócić później lub udostępnić to współpracownikom. Interfejs aktualizuje się natychmiast, a panel kodu pokazuje dokładnie to, co zostanie wyeksportowane.
Krok 3: Eksportuj gotowy do produkcji kod C/C++
Gdy układ jest gotowy, przełącz się na panel kodu. Lopaka generuje czysty, zoptymalizowany kod dla twojego sterownika wyświetlacza i biblioteki. Czcionki, bitmapy, układ — wszystko załatwione. Po prostu kopiuj i wklej do Arduino IDE, PlatformIO lub YAML ESPHome.
Bez zgadywania przesunięć. Bez dziwnych błędów wyrównania. Wyeksportowany kod to dokładnie te dane wyjściowe, które widziałeś w podglądzie.
Krok 4: Podłącz i wgraj na urządzenie
Podłącz wyświetlacz zgodnie z dokumentacją biblioteki. Jeśli używasz Adafruit_GFX lub U8g2, prawdopodobnie znasz już tę procedurę. Wklej wygenerowany kod do swojego szkicu, skompiluj i wgraj.
Bum. Twoje GUI pojawia się dokładnie tak, jak je zaprojektowałeś. Bez potrzeby kalibracji.
Prawdziwy przykład: pulpit pogodowy na ESP32
Załóżmy, że chcesz zbudować kompaktowy wyświetlacz pogodowy przy użyciu ESP32 + ekranu TFT 2,4”.
- Wybierz w Lopaka rozmiar wyświetlacza 320x240
- Wrzuć ikony stanów pogody (słońce, chmura, deszcz)
- Dodaj bloki tekstowe dla temperatury, wilgotności i nazwy miasta
- Wyeksportuj kod dla TFT_eSPI
- Użyj API OpenWeatherMap w swoim szkicu
- Wgraj i podziwiaj swój ostry pulpit pogodowy
Wygląda jak produkt komercyjny, ale zrobiłeś go w mniej niż godzinę.
Dlaczego inżynierowie przechodzą na Lopaka
To nie jest tylko zabawka. Lopaka to poważne oprogramowanie do projektowania wbudowanych GUI, zbudowane przez kogoś, kto przeszedł ból ręcznego dostrajania układów pikseli.
Co otrzymujesz:
- Edytor WYSIWYG w czasie rzeczywistym dla wbudowanych interfejsów
- Kreator GUI bez kodu dla ESP32, Arduino i nie tylko
- Dane wyjściowe, które działają na prawdziwym sprzęcie, a nie tylko makiety
- Jest open source, z opcjonalnymi planami subskrypcji dla aplikacji chmurowej
Jeśli budujesz ekrany z Arduino, ESP32 lub Raspberry Pi — zaoszczędzi ci to godziny.
Spróbuj teraz
Przejdź na lopaka.app i uruchom swój pierwszy projekt. Logowanie nie jest wymagane.
Masz opinie lub prośby o funkcje? Zajrzyj do repozytorium GitHub lub napisz do nas na Twitterze.
Miłego hakowania 🚀