Minimalistické GUI pro malé displeje

mhi

  • ***
  • 240
    • Zobrazit profil
Minimalistické GUI pro malé displeje
« kdy: 07. 06. 2020, 11:10:41 »
Zrejme budu resit otazku tvorby jednoducheho user interface pro embedded app, ktery:

1) bude fungovat na malych barevnych LCD displayich typu 1,8" 160x128 (na vysku i na sirku)

2) bude pouzitelny s rotary encoderem (tzn. jen "klavesy" up/down/enter), podobne jako to maji treba 3d tiskarny

3) bude pouzitelny s resistive touch displayi typu 2,8" a 3,5" (320x480)

4) bude rozumne vyuzivat moznosti LCD, tzn. nebude to vypadat jako ZX Spectrum :-); idealne bude v ramci moznosti vypadat "moderne"

5) bude VELMI MALY co se tyce naroku na MCU, tzn. veci typu https://lvgl.io/ nepripadaji v uvahu, potrebuju aby cela knihovna mela maximalne okolo 10-20kB MAX a minimalni pozadavky na RAM

6) by mel umet veci typu menu, messagebox, nejake vstupy, kreslit vlastni obrazovky, zakladni utvary (cara, obdelnik, ctverec, text, ...)

Mate nekdo nejaky tip, nebo alespon inspiraci (staci obrazky), zejmena k bodu 4) ve spojeni s bodem 1)-3) ? Zacal jsem uz totiz neco programovat a samozrejme z toho vznikl UI typu ZX Spectrum :). Nicmene chvili jsem se dival na cizi navrhy hlavne u tlacitkovych mobilu s podobnymi LCD a zjistil jsem, ze trivialni upravou se treba menu da upravit na temer Apple-like vzhled pouhym pridanim oddelovacu (Line), zmenou barev, velikosti fontu (8->10,12,14) a vytvorenim gradientnich mezer mezi polozkami (FillRect). Nejsem grafik, takze je to porad takove divne, hlavne asi diky extrapolaci fontu 8x5 ktery mam kvuli velikosti. Na velikost kodu a pracnost ale velmi zajimavy vysledek (syn prisel a rekl mi "je, ty jsi to udelal nejake hezke" :-)) ).
« Poslední změna: 07. 06. 2020, 21:39:25 od Petr Krčmář »


Re:Minimalisticke GUI pro male displaye
« Odpověď #1 kdy: 07. 06. 2020, 12:57:36 »
Hrál jsem si před pár lety s https://ugfx.io/ a STM32 na ChibiOS + touch TFT, dělalo se s tím v pohodě.

mhi

  • ***
  • 240
    • Zobrazit profil
Re:Minimalisticke GUI pro male displaye
« Odpověď #2 kdy: 07. 06. 2020, 13:14:20 »
Diky, jake byly naroky uGFX ? Podle webu mi to ale prijde jako kladivo na komara, tzn. prilis mnoho features na to co chci. Nicmene dekuji za tip!

Jen pro info, moje predstava je takoveto pouziti - priklad menu (recyklovany kod z jineho stareho projektu):

Kód: [Vybrat]
const struct MenuItem testmenu[] = {
  {"LOREM IPSUM :)", 0, MF_TITLE|MF_SCROLLBAR},
  {"<< Back", 0, 0},
  {"ligula id egestas ornare", 2, 0},
  {"Donec porta", 3, 0},
  {"Sed molestie massa", 4, MF_DISABLED},
  {"Sed in maximus ex", 5, 0},
  {"Etiam luctus enim ", 6, 0},

...

    i=-1;
    while(1) {
   i = RunMenu(testmenu, i);
     if (i==0) break;
     MessageBox(testmenu[i].label, "You have chosen",0);
    }


Re:Minimalisticke GUI pro male displaye
« Odpověď #3 kdy: 07. 06. 2020, 20:47:54 »
Nároky v jakém smyslu? Pokud to má fungovat i s dotykem, není to až tak jednoduché zadání. Navíc ovládací prvky potřebují callbacky, tedy samostatná vlákna. To právě elegantně a úsporně řeší ChibiOS.

Běželo mi to na blue pill za pár dolarů (STM32F103 na 72MHz), 8bitový paralelní interface na něco kolem 480x270 TFT s tou úplně nejzákladnější HW akcelerací (nejlevnější TFT s 8bit paralelním vstupem, co jsem sehnal). SPI bylo moc pomalé a na základní 40bit paralelní interface jsem neměl volné piny.  Stíhalo to refresh rate kolem 10 obrazovek za sekundu, což mi bohatě stačilo.

Re:Minimalistické GUI pro malé displeje
« Odpověď #4 kdy: 08. 06. 2020, 10:47:08 »
Pro inspiraci bych se podíval na guides a api J2ME. To je asi posledni případ, kdy se GUI pro opravdu malé displeje řešilo nějak vážně. V tom smyslu, že se sešel nějakej board a zkusil se zamyslet nad problémem.
« Poslední změna: 08. 06. 2020, 10:55:18 od KorporatniLopata »


mhi

  • ***
  • 240
    • Zobrazit profil
Re:Minimalistické GUI pro malé displeje
« Odpověď #5 kdy: 08. 06. 2020, 10:54:46 »
Naroky ve smyslu kolik FLASH a RAM to potrebuje. O rychlost mi ani nejde, pouzivam na ty male displaye SPI, clovek sice vidi jak se to refreshuje... Treba ten bluepill (STM32F103C8) na vyvoj pouzivam taky a chtel bych, aby z 64kB / 20kB to zabiralo co nejmene, aby byl prostor pro dalsi kod. A rozhodne nechci nutnost OS, hlavne z duvodu legacy kodu a 'quick hacku'. Potrebuju neco rychle zbastlit a LCD s menu je optimalni uz od okamziku kdy se tam nastavuje vic nez 2-3 parametry, nebo nestaci par LEDek na signalizaci (coz u mne nestaci nikdy).

mhi

  • ***
  • 240
    • Zobrazit profil
Re:Minimalistické GUI pro malé displeje
« Odpověď #6 kdy: 08. 06. 2020, 11:38:07 »
KorporatniLopata: dekuji za tip. J2ME mne vubec nenapadlo, ani nevim kdy jsem to pouzival jak je to davno.

V mezidobi jsem objevil kouzlo "menu s hodnotami" (vlevo polozka, vpravo nastavena hodnota, checkbox, atd.) ve stylu Androidu/iOS. https://www.bu.edu/tech/files/2019/10/iPhoneWiFi_1-435x636.png Tim se da velmi elegantne vyresit spousta veci i bez klavesnice/touchscreenu, budu to muset doimplementovat.

Stejne tak ruzne MessageBox() z Win32 API jsou na tyto veci pouzitelne a celkem univerzalni.

Hlavni problem je asi zadavani nejakych hodnot, bud ciselnych nebo ascii retezcu. Ta cisla potrebuju docela casto a jak to udelat prakticky nevim.

Asi jsou 2 moznosti: rotary encoder nahoru/dolu meni cislo (to je prakticke pro male hodnoty), pri zrychleni by to mohlo skakat pres rady. Nebo zvyraznit nejaky digit a ten menit up/down, jenze to nejde pouzit kdyz chci "doladovat" nejakou hodnotu za behu. Taky je neprakticke potvrzovani, vraceni zpet, atd (mame jen jedno tlacitko v rotenc). Vymena enkoderu za 4 tlacitka zase ztraci rychlost prace se zarizenim. A u maleho touch dispaye to taky neni zadna slava, tam asi nejde vymyslet nic lepsiho nez miniklavesnici.

Re:Minimalistické GUI pro malé displeje
« Odpověď #7 kdy: 08. 06. 2020, 12:43:59 »
Procházení menu a zadávání čísel v rozumném rozsahu je vcelku rozumně vyřešené na 3D tiskárnách (FW Marlin) - v zásadě tak, jak píšeš.
U zadávání textů a složitějších čísel se můžeš inspirovat u dálkových ovladačů některých TV - kliknutím na editaci prvního znaku, kolečkem výběr znaku (jeden ze znaků bude konec textu), kliknutím výběr potvrdit a přejít na následující znak (s výjimkou znaku konec textu, který ukončí editaci položky). 

Re:Minimalistické GUI pro malé displeje
« Odpověď #8 kdy: 08. 06. 2020, 14:26:48 »
Asi to není rada kterou hledáte, ale mě by se takového zařízení líbila implementace webového rozhraní přes wifi. Klidně ve stylu, že si v menu kliknu na položku wifi. Spustí se wifi hotspot s landing page, na které si pak můžu pohodlně všechny hodnoty nastavit přes mobil/pc. Zároveň to není IOT, protože to zařízení nemusí být připojené trvale v internetu, takže to nebude mít velký dopad na bezpečnost.

Re:Minimalistické GUI pro malé displeje
« Odpověď #9 kdy: 08. 06. 2020, 14:33:21 »
S wifi je pak problém, když se z hračky stane produkt. To pak certifikační náklady nejsou do 100 tisíc ale hravě k milionu Kč.

mhi

  • ***
  • 240
    • Zobrazit profil
Re:Minimalistické GUI pro malé displeje
« Odpověď #10 kdy: 08. 06. 2020, 15:50:32 »
Tomas-T: diky za tip, dobry napad. Nekdy si s tim pohraju. Budu ted' premyslet nahlas: do inputu dam "abecedu", ktera se bude zobrazovat +-2 znaky nad/pod tim vybranym. K tomu znak backspace a konec (sipky <-- --> ).

Druha moznost u cisel kdy znam rozsah (0-1000) je ze bude "kurzor" na cisle, kdyz budu tocit koleckem, bude to skakat po pozicich + OK + cancel (nebo tak neco). Stiskem tlacitka na cisle se mi ukaze zase "abeceda" (012...9, nebo 0123...A..F) a pak budu moci volit danou pozici.

No a posledni moznost je jen chytre udelany + - pro hodnotu (parametry min-max-step). To je prakticke kdyz treba chci zvolit rozsah 0..100, to se da vytocit docela rychle. Jenze treba pro frekvenci 0 ... 20 MHz bych se utocil. Mozna nejak zohlednit tu rychlost jak tocim, otazka je zda to bude dost intuitivni a vubec pouzitelne. Tato varianta je totalne nepouzitelna pro tlacitka misto rotenc.

Křišťan: naprosty souhlas, on je to problem i ve fazi "hracky" kdyz chci jen neco hloupeho do ruky co se prakticky ovlada, clovek se musi patlat s mobilem, pripojovat wifi, atd... mel jsem pres bluetooth serial udelane ovladani rizeni spalovaciho motoru u motorky, spis to bylo ciste na logovani toho co se deje (abych videl kdy mi to treba chcipne proc se tak stalo) a vzdy jsem si nadaval kdyz jsem musel resit co s tim logem apod., dalsi neprakticka vec do ruky (ale tam by to nezachranil ani velky display).
« Poslední změna: 08. 06. 2020, 15:54:16 od mhi »