Demonstrace možností využití knihovny Windows UI Library Lukáš Kobylík Bakalářská práce 2020 Prohlašuji, že • beru na vědomí, že odevzdáním diplomové/bakalářské práce souhlasím se zveřejněním své práce podle zákona č. 111/1998 Sb. o vysokých školách a o změně a doplnění dalších zákonů (zákon o vysokých školách), ve znění pozdějších právních předpisů, bez ohledu na výsledek obhajoby; • beru na vědomí, že diplomová/bakalářská práce bude uložena v elektronické podobě v univerzitním informačním systému dostupná k prezenčnímu nahlédnutí, že jeden výtisk diplomové/bakalářské práce bude uložen v příruční knihovně Fakulty aplikované informatiky Univerzity Tomáše Bati ve Zlíně a jeden výtisk bude uložen u vedoucího práce; • byl/a jsem seznámen/a s tím, že na moji diplomovou/bakalářskou práci se plně vztahuje zákon č. 121/2000 Sb. o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů (autorský zákon) ve znění pozdějších právních předpisů, zejm. § 35 odst. 3; • beru na vědomí, že podle § 60 odst. 1 autorského zákona má UTB ve Zlíně právo na uzavření licenční smlouvy o užití školního díla v rozsahu § 12 odst. 4 autorského zákona; • beru na vědomí, že podle § 60 odst. 2 a 3 autorského zákona mohu užít své dílo – diplomovou/bakalářskou práci nebo poskytnout licenci k jejímu využití jen připouští-li tak licenční smlouva uzavřená mezi mnou a Univerzitou Tomáše Bati ve Zlíně s tím, že vyrovnání případného přiměřeného příspěvku na úhradu nákladů, které byly Univerzitou Tomáše Bati ve Zlíně na vytvoření díla vynaloženy (až do jejich skutečné výše) bude rovněž předmětem této licenční smlouvy; • beru na vědomí, že pokud bylo k vypracování diplomové/bakalářské práce využito softwaru poskytnutého Univerzitou Tomáše Bati ve Zlíně nebo jinými subjekty pouze ke studijním a výzkumným účelům (tedy pouze k nekomerčnímu využití), nelze výsledky diplomové/bakalářské práce využít ke komerčním účelům; • beru na vědomí, že pokud je výstupem diplomové/bakalářské práce jakýkoliv softwarový produkt, považují se za součást práce rovněž i zdrojové kódy, popř. soubory, ze kterých se projekt skládá. Neodevzdání této součásti může být důvodem k neobhájení práce. Prohlašuji, ▪ že jsem na diplomové/bakalářské práci pracoval samostatně a použitou literaturu jsem citoval. V případě publikace výsledků budu uveden jako spoluautor. ▪ že odevzdaná verze diplomové práce a verze elektronická nahraná do IS/STAG jsou totožné. Ve Zlíně, dne 10. 8. 2020 Lukáš Kobylík, v. k. ABSTRAKT V teoretické části se práce zabývá rešerší současných technologií pro tvorbu desktopových aplikací a možnostmi tvorby uživatelského prostředí s moderními prvky a funkcemi. V praktické části se práce věnuje návrhu jednoduchých aplikací za využití různých technologií a programovacích jazyků, ve kterých bude využito moderních UWP elementů a knihovny WinUI. Klíčová slova: WinUI, C#, C++, UI, uživatelské prostředí ABSTRACT The theoretical part contains recherche about current technologies for creating desktop applications and the possibilities of creating a user interface with modern elements and functions. The practical part deals with the design of simple applications using various technologies and programming languages, which will use modern UWP elements and the WinUI library. Keywords: WinUI, C#, C++, UI, user interface Děkuji Ing. Eriku Královi, Ph.D. za cenné rady a čas, který mi věnoval při vedení mé bakalářské práce. Prohlašuji, že odevzdaná verze bakalářské/diplomové práce a verze elektronická nahraná do IS/STAG jsou totožné. OBSAH ÚVOD .................................................................................................................................... 9 I TEORETICKÁ ČÁST ................................................................................................ 10 1 TECHNOLOGIE VÝVOJE DESKTOPOVÝCH APLIKACÍ ............................ 11 1.1 TECHNOLOGIE VÝVOJE DESKTOPOVÝCH APLIKACÍ ............................................... 11 2 PRŮZKUM GRAFICKÉHO PROSTŘEDÍ .......................................................... 14 2.1 DEFINICE GRAFICKÉHO PROSTŘEDÍ ....................................................................... 14 2.1.1 Textové uživatelské rozhraní ....................................................................... 15 2.1.2 Grafické uživatelské rozhraní....................................................................... 16 2.1.3 Ovládání uživatelského prostředí ................................................................. 17 2.2 VÝVOJ MODERNÍHO PROSTŘEDÍ ............................................................................ 17 2.3 MICROSOFT FLUENT DESIGN SYSTEM .................................................................. 21 2.3.1 Nasazení Fluent Designu .............................................................................. 23 2.3.2 Nekonzistence UI ......................................................................................... 25 2.4 KNIHOVNA WINUI ............................................................................................... 28 2.4.1 Knihovna WinUI 2.0 .................................................................................... 29 2.4.2 Knihovna WinUI 2.1 .................................................................................... 32 2.4.3 Knihovna WinUI 2.2 .................................................................................... 33 2.4.4 Knihovna WinUI 2.3 .................................................................................... 36 2.4.5 Knihovna WinUI 3.0 .................................................................................... 37 2.4.6 Současné limitace knihovny WinUI 3.0 ....................................................... 38 2.5 XAML ISLANDS ................................................................................................... 39 2.6 XAML CONTROL GALLERY ................................................................................. 40 2.7 WINUI A STARŠÍ TECHNOLOGIE TVORBY DESKTOPOVÝCH APLIKACÍ A RŮZNÉ PROGRAMOVACÍ JAZYKY ...................................................................................... 42 II PRAKTICKÁ ČÁST ................................................................................................... 43 3 ÚVOD DO PRAKTICKÉ ČÁSTI ........................................................................... 44 4 PŘÍPRAVA KNIHOVNY WINUI 3.0 .................................................................... 45 4.1 WINUI 3.0 PRO DESKTOPOVÉ APLIKACE ............................................................... 45 5 PŘÍPRAVA ............................................................................................................... 46 6 APLIKACE UWP S WINUI 3.0 ............................................................................. 48 6.1 XAML UWP APLIKACE ....................................................................................... 49 6.2 C# KÓD UWP APLIKACE ...................................................................................... 57 6.3 POPIS VÝSLEDNÉ APLIKACE .................................................................................. 59 7 KLASICKÁ DESKTOPOVÁ APLIKACE V C# .................................................. 60 7.1 POPIS VÝSLEDNÉ APLIKACE .................................................................................. 61 8 KLASICKÁ DESKTOPOVÁ APLIKACE V C++ ............................................... 63 8.1 XAML DESKTOPOVÉ APLIKACE V C++ ................................................................ 65 8.2 C++ KÓD DESKTOPOVÉ APLIKACE ....................................................................... 65 8.3 POPIS VÝSLEDNÉ APLIKACE .................................................................................. 67 ZÁVĚR ............................................................................................................................... 69 SEZNAM POUŽITÉ LITERATURY .............................................................................. 70 SEZNAM POUŽITÝCH SYMBOLŮ A ZKRATEK ..................................................... 74 SEZNAM OBRÁZKŮ ....................................................................................................... 75 SEZNAM TABULEK ........................................................................................................ 77 SEZNAM PŘÍLOH ............................................................................................................ 78 UTB ve Zlíně, Fakulta aplikované informatiky 9 ÚVOD Již několik desítek let se staly počítače nedílnou našich životů. Za tu dobu prošlo také jejich ovládání značným vývojem. Od velkých sálových počítačů na děrné štítky, po počítače osobní. Ty zprvu nebyly zdaleka tak pohodlné na ovládání, jako je tomu dnes. Ovládání počítače skrze příkazový řádek bylo později nahrazeno grafickým uživatelským prostředím. Uživatelské prostředí je to, v čem se uživatel pohybuje. Skrze něj se ovládá počítač. A proto je velmi důležité, aby se v něm uživatel vyznal a orientoval. Aby pro něj bylo intuitivní. Každé uživatelské prostředí má své výhody a nevýhody a disponuje různými prvky a elementy, aby byl přívětivější pro uživatele. Přesto se najdou také určité nedostatky. Tato práce má sloužit k tomu, aby se v teoretické části porovnaly možnosti tvoření desktopových aplikací a možnosti knihovny WinUI. Také však proto, aby se ukázalo na nedostatky jednotlivých řešení. V praktické části bakalářské práce je tvorba ukázkových aplikací za použití WinUI 3.0, která je vytvořena pomoci IDE Microsoft Visual Studio. Jednotlivé návrhy