Posledních pár měsíců jsem s přestávkami pracoval na modernizaci UI a UX našeho programu. Cílem bylo popotáhnout vzhled UI aplikace (doufám) do současnosti a z hlediska UX odstranit několik historických nešvarů jako např. většinu modálních dialogů.
Zkusím naznačit některé věci, které jsem použil a doufám, že to někomu pomůže, nebo aspoň pobaví.
Velké zobrazení
Úplně na začátku se s obchodníky dohodlo, že se vykopnou staré ikony (tak z doby XP, některé homemade, každý pes jiná ves) a koupí se profesionální moderní flat ikony. Po nasazení do staré verze jsem ani nevěřil jak to okamžitě změnilo vizáž aplikace.
Už při úplném začátku práce na programu před x lety jsem definoval, že ikony budou v jednom imagelistu v datamodulu a za všechny roky jsem se jí držel a teď přišel okamžik, kdy se mi to vrátilo. Ta slast :-).
Po dlouhém boji se rozhodlo, že se vykopne původní toolbar s ikonami 32x32 za něco modernějšího. Ribbon. Velký boj, nikdo si nebyl jist, zda je správná cesta.
Rozhodl jsem, že se nepoužije Ribbon z Delphi, ale od TMS - AdvToolbar. Důvodem je větší variabilita (cca 10 různých stylů dle verzí Windows), možnost si to upravit a vůbec. TMS vždy dokáže vizuálně nadchnout, uvnitř to někdy bývá lehce horší, ale vždy to nějak šlo dohackovat (v tomto případě to ani moc nebylo třeba, nebýt toho, že jsem měl speciální požadavky na práci s ikonami).
Z možných variant vzhledu TMS Ribbonu jsem vybral ten (lehce upravený) dle Windows 8, kromě jiného perfektně sekne k flat ikonám a je hned vidět, že je to moderní - dle Windows.
Už několikrát jsem zde zmiňoval to, že Virtual TreeView je prostě geniálně flexibilní a vzhledově velmi dobrý. V CRMPLUS je použit všude kde je to možné.
Díky jeho koncepci na bázi MVC se velmi jednoduše reaguje na různé situace. Všimněte si např. vybraného filtru, kdy pro vybraný záznam se vrací jiný font, jiná ikona a jiná barva a hned tu máme efektní možnost jak naznačit obsluze, že je možné začít vyhledávat psaním.
V kombinaci s filtrováním Virtual TreeView, které jsem tu už popisoval (na obrázku je vidět editační box pro vyhledávání) je to velmi silná zbraň. Použil jsem ji všude možně.
TMS komponenty jsem použil i pro celkem efektní možnosti. Ty jejich komponenty jsou fakt neuvěřitelné - to co je na obrázku je naprosté minimum z toho co to umí.
Jak jsem řekl, jedním z cílů bylo odstranit co nejvíce modálních dialogů. Nahradil jsem modální dialogy za zobrazení do záložek. Pro zobrazení záložek jsem použil TJvTabBar z JVCL s malou úpravou kreslení.
Hodně používám dokování (tak jak jsem ho popisoval dříve), tj. vytvořím instanci formuláře a docknu ho na správné místo (např. záložka), případně jeho část do navigátoru. Např. na uvedeném screenshotu je VirtualTreeView (související data), který je z formuláře přemístěn do navigátoru, tj. formulář vytvoří strom a ten se v hlavní aplikaci jen zobrazí někam jinam. Strom je vytvářen dynamicky podle TPageControl, který má záložky. Co záložka, to řádek. Při výběru řádku ve stromě se zobrazí záložka a ostatní se schovají. Záložka je částečně schována pod mým našeptávačem.
Efektní věc. Postaveno na bázi opensource komponent pro Metro styl s GDI+. Při pohybu myši se to lehce zvětšuje - viz ten fialový box firmy. Moc pěkné.
Z databázového hlediska jsem už dávno přešel z ADO na FireDAC (UniDac by byl stejně dobrý). Výsledkem bylo zrychlení a hlavně mi to dovolilo dělat kouzla, o kterých se mi ani náhodou nezdálo (jako manipulaci s řádky datasetu na klientu, nahrazení řádku při refresh atd). Ale to jsem tu již dříve popisoval.
Balíky komponent:
- Virtual Tree View
- různé věci od TMS (AdvToolbar, Planner …)
- FastReport
- FastCube
- něco z JVCL
RSS