[5] JAVA i STM32 – ekspresowy kurs programowania z MicroEJ – stacja pogodowa

 

Uwaga! Wszystkie opublikowane odcinki kursu są dostępne pod adresem. 

W ostatnim artykule serii poświęconej środowisku MicroEJ (JAVA dla mikrokontrolerów, w artykułach skupiamy się na wersji tego języka dla STM32) zostanie przedstawiony sposób na tworzenie własnych widgetów i wykorzystanie ich w interfejsie graficznym. Jako przykład posłuży odczytywanie w czasie rzeczywistym danych z czterech czujników: temperatury (MCP9801), ciśnienia (LPS25HB), wilgotności (HTS221) i natężenia światła (TSL2561) oraz prezentacja wyników na wykresach. Wszystkie czujniki zostały podłączone do zestawu STM32F429I-DISCO za pośrednictwem wspólnej magistrali I2C. Pokazany przykład może zostać wykorzystany jako prosta stacja pogodowa.

Interfejs graficzny

Pierwszym krokiem jest jak zwykle przygotowanie platformy (JPF). Tak samo jak w poprzednim przykładzie, można wykorzystać przygotowaną wcześniej platformę Full. Przechodząc do tworzenia projektu należy pamiętać, aby wybrać odpowiednią listę dołączanych modułów:

  • EDC
  • EJ.MOTION
  • MICROUI
  • MWT
  • SNI

Ostatnim krokiem konfiguracji projektu jest dodanie biblioteki Widgets. Sposób dołączania tej biblioteki wraz z dokumentacją do projektu zostało przedstawione w przykładzie ilustrującym wykonanie zegara z budzikiem z obsługą za pomocą touch-panela.

Interfejs graficzny obejmuje cztery przyciski klasy com.is2t.mwt.widgets.button.Button oraz cztery wykresy klasy ChartWidget, która zostanie opisana w kolejnym rozdziale. Z uwagi na mały rozmiar wyświetlacza, w danej chwili będzie wyświetlany tylko jeden wykres, a do przełączania wykresów posłużą wspomniane przyciski. Opisy przycisków zostały wykorzystane również do prezentacji ostatniej wartości odczytanej z czujnika. Wymienione obiekty zostały rozmieszczone na ekranie za pomocą widgetu typu BorderComposite. Umieszcza on obiekty na ekranie w pięciu lokalizacjach: NORTH, SOUTH, EAST, WEST i CENTER. Centralna część została wykorzystana do wyświetlenia wykresu, przyciski zaś umieszczono w części NORTH w siatce o rozmiarze 2×2 utworzonej za pomocą trzech obiektów typu GridComposite.

List. 1. Kod klasy MyLook

Do projektu należy także dodać obiekty odpowiedzialne za wygląd aplikacji. W przykładzie wykorzystano klasy MyLook i MyTheme z poprzedniego projektu. Zmianie uległy jednak użyte czcionki: większa o rozmiarze 30 px do opisu przycisków oraz mniejsza o rozmiarze 10 px do opisu osi wykresów. Obie czcionki, tak jak poprzednio, należy dodać do projektu nie zapominając o pliku z ich listą i lokalizacją. Przed uruchomieniem symulacji należy jeszcze dodać z projektu zegara klasę DesktopRenderer pozwalającą na dowolną zmianę koloru tła. Podczas konfiguracji symulacji należy pamiętać o dodaniu pliku z listą czcionek w zakładce Configuration?MicroUI?Font.

Kod źródłowy klas MyLook oraz MyTheme przedstawiono na listingach 1 i 2, natomiast kod klasy Main – na listingu 3.

List. 2. Kod klasy MyTheme

List. 3. Kod klasy Main

Tworzenie nowego widgetu

Aby móc przedstawić dane na wykresach należy przygotować dwie klasy: ChartWidget oraz ChartRenderer. Pierwsza z nich przechowuje wszystkie potrzebne dane, w tym listę punktów do wyświetlenia. Druga z klas wykorzystuje te dane aby narysować wykres na przydzielonym obszarze ekranu.

List. 4. Kod klasy ChartWidget

Do pobrania

O autorze