PODPORA IMPLEMENTÁCIE ROZHRANÍ MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

3.1 ÚVOD DO GRAFICKÝCH SYSTÉMOV Programovacie nástroje pre interaktívne systémy poskytujú prostredky pre účinnú transformáciu abstraktného návrhu a princípov použiteľnosti do vykonávateľnej formy. Tieto nástroje poskytujú programátorovi rôzne úrovne služieb. Hlavným prúdom interakcie človek- počítač v súčasnosti sú grafické rozhrania - GUI (Graphical User Interface) a oknové systémy WIMP. Umožňujú, že jedna pracovná stanica (workstation - napríklad PC) podporuje oddelené používateľské a systémové vlákna akcií, ktoré pracujú súbežne (simultaneously). MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Interaktívne nástroje abstrahujú od fyzikálneho oddelenia vstupných a výstupných zariadení a dovoľujú programátorovi popísať chovanie objektov na podobnej úrovni ako ich vníma používateľ. Manažérske systémy pre používateľské rozhrania (niekedy sa používa výraz generátory rozhraní - interface generators) sú konečnou úrovňou nástrojov podporujúcich programovanie, dovoľujúc návrhárovi a programátorovi riadiť vzťah medzi prezentáciou objektov nástroja s ich funkcionálnou sémantikou v skutočnej aplikácii. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Grafické urýchľovače sú súčasťou grafických kariet - graphic a geometry engines alebo GPU (Geometry Processing Unit). To čo sa nazýva hardvérová podpora sú vlastne multiprocesorové komplikované systémy s rozsiahlym softvérom, ktorý ale môže využívať len pokročilý používateľ. Pred pár rokmi ešte drahé grafické stanice so základným softvérom, dnes grafická karta za pár tisíc korún s rovnakým výkonom. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Grafické rozhranie zariadení (Graphic Device Interface - GDI) Je vrstva, ktorá je rozhraním medzi API a hardvérom. Pôvodne boli GDI prostredníkom medzi elementárnymi funkciami grafického zariadenia, ktoré dokázalo niekoľko funkcií napríklad nakresliť čiaru a API kde sú funkcie ako lomená čiara s určitou hrúbkou a farbou. API využíva funkcie GDI. GDI na vstupe je univerzálne a na výstupe spolupracuje s riadiacim programom zariadenia. Ale s vývojom grafických kariet sa presunulo mnoho funkcií API na programové vybavenie grafickej karty. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad použitia GDI v jazyku C. // dátová štruktúra pre device context - smerník na pamäť obrazu HDC hdc; // získanie kontextu zariadenia hdc = GetDC(hWnd); // dátové štruktúry pre nový štetec a pôvodný štetec HBRUSH hBrush, hOldBrush; // vytvorenie nového štetca zelenej farby hBrush = CreateSolidBrush(RGB(0, 255, 0)); // použitie nového štetca, pôvodný si zapamätáme pre neskoršie obnovenie hOldBrush = (HBRUSH) SelectObject(hdc, hBrush); // zobrazí obdĺžnik 100 x 200, ľavý horný roh bude mať súradnice x=10, y=5 Rectangle(hdc, 10, 5, 100, 200); // obnovenie pôvodného štetca SelectObject(hdc, hOldBrush); // zrušenie nového štetca DeleteObject(hBrush); // uvoľníme device context ReleaseDC(hWnd, hdc); MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Obrázok vytvorený predchádzajúcim kódom MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

GDI+ je nová generácia rozhrania GDI prvýkrát použitá vo Windows XP. Vylepšenia v oblasti výkonu a kvality. Podporuje odstránenie rastrovania, farebný gradient, alfa kanál, miešanie 2D a 3D grafiky, animácií a videa ako aj tlač. Podporuje formáty JPEG a PNG a je na rozdiel od GDI úplne objektovo-orientované a naprogramované v jazyku C++. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

API - aplikačné programové rozhranie: Je to rozhranie medzi aplikáciou a grafickým systémom počítača. Grafické programy GKS (Graphical Kernel System) - norma ISO, PHIGS (Programmed Hierarchical graphics System) - ISO, ANSI norma - v súčasnosti sa už nepoužívajú. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

2D API Cairo – multi-platformová knižnica poskytujúca C rozhranie pre zobrazovanie2D objektov na rôzne výstupné média – okná rôznych oknových systémov, obrazové súbory, PDF, PostScript. OpenVG – API pre vektorovú grafiku v jazyku C od konzorcia Khronos. Podporuje použitie akcelerátorov. Prvé implementácie pre mobilné zariadenia ale aj PC. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

3D API OpenGL – priemyselný štandard pre 3D ale aj 2D grafiku. Pochádza z dielne Silicon Graphics Inc. Je implementované v každom rozšírenom operačnom systéme (Windows, X11, Mac OS X). Akcelerácia je podporovaná cez ovládače grafického hardvéru. O ich implementáciu sa starajú výrobcovia. Direct3D – štandardná 3D knižnica operačného systému Windows. Poskytuje akcelerované zobrazenie 3D objektov a správu grafického hardvéru. Ich výrobcovia dodávajú implementáciu vo svojich ovládačoch. Aj napriek platformovým obmedzeniam je Direct3D najpoužívanejším API pre vývojárov hier. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklady „2D“ grafických prvkov v OpenGl (tieto útvary môžu byť neplanárne, to je vrcholy sú v priestore a nemusia ležať v jednej rovine) MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Oknové API Xlib – obaluje X11 Window System protokol do C funkcií a typov. Zabezpečuje interakciu medzi X serverom a aplikáciou čím umožňuje programátorovi vytvárať okná a manipulovať s nimi. Je to rozhranie najnižšej úrovne, pre prácu s X-Windows sa používajú iné oknové knižnice, ktoré Xlib obalujú. Je dielom konzorcia univerzít a firiem originálne pre OS UNIX ale neskoršie aj pre DOS. Win32 – základná knižnica s C rozhraním operačného systému Windows. Jej časť zaoberajúca sa používateľským rozhraním poskytuje možnosti vytvárania okien, ich ovládanie a sprostredkúvanie interakcie medzi systémom a používateľom Qt – robustná multi-platformová oknová knižníca. Obaľuje natívne oknové systémy rôznych platforiem (Windows, X11, Mac OS X, embedded zariadenia) a poskytuje jednotné C++ a Java programové rozhranie MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Prácu s WIMPS podporujú aj značkovacie jazyky (HTML) a skriptovacie jazyky (JavaScript) ako aj autorské systémy pre tvorbu interaktívnych mulimediálnych aplikácií (Macromedia Director, Authorware a Flash). Opis GUI ako sú User Interface Markup Language (UIML) alebo XML User Interface Language (XUL). API - aplikačné programové rozhranie: MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

3.2 PARADIGMY PROGRAMOVANIA INTERAKCIE Interaktívne programy sú riadené používateľom (user driven), to znamená, že aplikácia sa určí keď používateľ urobí nejakú vstupnú akciu (napríklad pohne myšou). Poznáme dva spôsoby ich programovania - paradigma slučky čítania a vyhodnotenia (Read evaluation loop) - paradigma oznamovania (Notification based). MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Paradigma slučky čítania a vyhodnotenia (Read evaluation loop) Táto paradigma klient - server pracuje nasledovne. Server posiela vstupy používateľa ako štrukturované udalosti klientskej aplikácii. Čo sa týka servera, jediný dôraz udalosti je klient ktorému sa musí poslať. Klientská aplikácia je naprogramovaná aby čítala akúkoľvek udalosť ktorá jej dôjde a zistenie všetkých aplikáčne špecifických správaní sa ktoré, sú dôsledkom tejto udalosti. Pseudokód slučky načítania a vyhodnotenia je nasledovný: MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

read-event(MojaUdalost) case MojaUdalost.typ repeat read-event(MojaUdalost) case MojaUdalost.typ typ_1: do spracovanie typ_1 typ_2: do spracovanie typ_2 …………………………….. typ_n: do spracovanie typ_n end case end repeat MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Paradigma oznamovania (Notification based) Hlavná riadiaca slučka nie je súčasťou aplikácie. Namiesto toho prijíma udalosti od oknového systému centralizovaný oznamovateľ – notifier (listener, caller, event handler), ktoré filtruje aplikačnému programu, spôsobom ako to program deklaruje. Aplikačný program informuje oznamovateľa (registruje), o ktoré udalosti má záujem a pre ktoré deklaruje jednu vlastnú procedúru ako spätné volanie (callback) predtým ako dá riadenie oznamovateľovi. Callback funkcia je taká, ktorá sa posiela inému programu ako argument. Vďaka tomu môže program pracujúci na nižšej úrovni volať funkcie definovane vo vyšších úrovniach. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

read-event(MojaUdalost) case MojaUdalost.typ repeat read-event(MojaUdalost) case MojaUdalost.typ typ_1: do spracovanie typ_1 typ_2: ---- if (chybova_podmienka) then read-event(MojaUdalost2) case MojaUdalost2.typ typ_1: …….. typ_n: end case until (end-condition2) endif ……. typ_n: do spracovanie typ_n until (end-condition) MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad použitia funkcií callback v knižnici GLUT Cieľom GLUT(GL Utility Toolkit) je skrátiť čas pre začatie vývoja aplikácií v OpenGL a zároveň pomôcť pri jeho učení. Programátor je odbremenený od platformovo závislého kódovania, ktorý zahrňuje komunikáciu s operačným systémom a prípadne správcom okien. Kód pre vytvorenie okien, nastavenie zobrazovacieho kontextu a spracovanie udalostí je pre každý operačný systém iný. Nahrádza tieto volania sadou niekoľkých jednoduchých funkcií, ktoré vykonajú uvedené úlohy automaticky. Programátor sa tak sústredí priamo na špecifický kód OpenGL, čím sa podstatne zrýchľuje vývoj a testovanie aplikácií. Odpadá aj preprogramovania pre inú platformu - jednoduchá portabilita. Príklad registrácie spracovanie udalostí v knižnici GLUT GLUT umožňuje aj spracovanie udalostí z klávesnice a myši. Udalosti sú spracované pomocou callback mechanizmu – zaregistruje sa funkcia ktorá bude zavolaná keď nastane daná udalosť. Uvedený je jednoduchý príklad, ktorý si pri stlačení ľavého tlačidla myši zapamätá pozíciu a nastaví príznak stlačenia tlačidla. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklady registrácie spracovanie udalostí v knižnici GLUT. GLUT umožňuje aj spracovanie udalostí z klávesnice a myši. Udalosti sa spracujú pomocou mechanizmu spracovania udalosti (callback, event handler, listener) – zaregistruje sa funkcia ktorá bude zavolaná keď nastane daná udalosť. GLUT ďalej umožňuje narábať s časovačmi, vytvárať a organizovať pop-up menu. Príklady registrácie spracovanie udalostí v knižnici GLUT. 1. Príklad zobrazí trojuholník. 2. Pri stlačení ľavého tlačidla myši zapamätá pozíciu a nastaví príznak stlačenia tlačidla. 3. Spracováva stlačenie kláves W, S, A a D, a následne podľa nich sa posúva v smere osí X a Y. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

#include <GL/glut.h> void renderScene(void) { glClear(GL_COLOR_BUFFER_BIT); glBegin(GL_TRIANGLES); glVertex3f(-0.5,-0.5,0.0); glVertex3f(0.5,0.0,0.0); glVertex3f(0.0,0.5,0.0); glEnd(); glFlush(); } void main(int argc, char **argv) { glutInit(&argc, argv); // režim zobrazenia – výpočet hĺbky, pravé farby a alfa blending glutInitDisplayMode(GLUT_DEPTH | GLUT_RGBA); // nastaví umietnenie a veľkosť okna glutInitWindowPosition(100,100); glutInitWindowSize(320,320); // vytvorí okno s titulkom glutCreateWindow("OpenGL pomocou GLUT"); // registruje callback funkciu pre zobrazenie scény glutDisplayFunc(renderScene); // zobrazí okno a spustí spracovanie udalostí glutMainLoop(); MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

double mX, mY; int clicked; // funkcia pre spracovanie udalostí myši void mouseFunc(int button, int state, int x, int y) { if (button == GLUT_LEFT_BUTTON) { mX = x; mY = y; clicked = 1; } … vo funkcií main … glutMouseFunc(mouseFunc); double oX, oY; // funkcia pre spracovaní udalostí z klávesnice void keyFunc(unsigned char key, int x, int y) { switch (key) { // key udáva ASCII hodnotu stlačeného znaku case 'W': oY = oY + 1; break; case 'S': oY = oY - 1; break; case 'A': oX = oX - 1; break; case 'D': oX = oX + 1; break; glutKeyboardFunc(keyFunc); MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

void renderScene(void) { … GLUT zobrazí scénu len keď dostane od správcu okien operačného systému pokyn pre zobrazenie. Pre trvalé opakovanie zobrazenia napríklad pri animácii alebo v systémoch virtuálnej reality je potrebné vždy po dokončení zobrazovania scény požiadať o opakovanie. void renderScene(void) { … glutPostRedisplay(); // pošle požiadavku na opätovné zobrazenie } MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Ošetrovanie udalostí v jazyku Java Ak chceme reagovať na vzniknutú udalosť, musíme implementovať rozhranie vhodného prijímača udalostí. 1. Môže to byť samostatná trieda, ktorá bude implementovať dané rozhranie. public class myKeyDemo extends JFrame implements KeyListener { public void keyPressed( KeyEvent e ) { //akcia, ktorá sa vykoná pri stlačení klávesy } public void keyReleased( KeyEvent e ) { //akcia, ktorá sa vykoná po uvoľnení stlačenej klávesy public void keyTyped( KeyEvent e ) { //akcia, ktorá sa vykoná po stlačení klávesy MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

2. Ale môže to byť aj vnorená trieda (inner class) JButton Button1=new JButton(“Button1”); Button1.addActionListener(new ActionListener(){ actionPerformed(ActionEvent e){ //reakcia na udalosť, ktorá sa vykoná po stlačení tlačidla }}); MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

NÁSTROJE PODPORUJÚCE TVORBU WIMPS WIMPS - Windows Icons, Menu, Pointing deviceS Úloha oknových systémov je poskytnúť nezávislosť od špecifík programovania rôznych hardvérových zariadení a manažment viacerých, nezávislých ale súčasne bežiacich aktívnych aplikácií. Vlastnosťou a cieľom programových knižníc pre tvorbu rozhraní je: Nezávislosť používateľského rozhrania (oddeľuje návrh rozhrania od návrhu aplikácie, umožňuje viac stratégií návrh UI, podporuje viacplatformové aplikácie, vytvára pozíciu architekta UI, vynucuje si používanie noriem). Metodológia a notácia (vývoj návrhárskych procedúr, nájdenie spôsobu ako hovoriť o dizajne, vytvorenie riadenia projektu). MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Rýchle prototypovanie - rapid prototyping (rýchle overenie nápadov, iterovanie - cyklus testovanie a úprava návrhu, zaangažovanie konečných používateľov, manažérov a zákazníkov). Softvérová podpora (zvyšuje produktivitu, poskytuje testy obmedzení interakcie a jej konzistencie, uľahčuje tímovú prácu, uľahčuje údržbu softvéru a tým sa zvyšuje celková kvalita GUI). Programové knižnice pre tvorbu rozhraní s oknovými systémami môžme deliť napríklad deliť na štyri softvérové vrstvy: Oknové systémy, Nástroje pre GUI, Aplikačné rámce a špecializované jazyky a Aplikácie. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

1. Oknové systémy (Windowing systems). Príkladom sú Xwindows (X11 Windowing system), Microsoft Win32/GDI+, Apple Quarz. Táto vrstva je vhodná pre prezentáciu a interakciu s aplikáciou, veľmi dobre komunikuje s inými subsystémami, čas vytvorenia rozhrania aplikácie je dlhý a je veľmi náročná na naučenie sa. Možnosti rozširovania a modularita sú zlé. Tu sa používa programovanie s čítacou a vyhodnocovacou slučkou. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Architektúra klient - server MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Systém X-Windows (X11) MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

DisplayInitializeGraphics(); while(true) { Programovanie na tejto úrovni je trochu náročné, napríklad to čo sa dá urobiť na pár riadkoch špecializovaného jazyka Tcl /Tk sa musí popísať 237 riadkami na úrovni Xlib (XWindows). main() { InitializeSystem(); SetinitialState(); DisplayInitializeGraphics(); while(true) { Event event = readNextEvent(); Switch(event.type) { Case UDALOST1: udalost1(); break; Case UDALOST2: udalost2(); break; …………………………………… deafult: doDefault(event); break; } MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

2. Nástroje pre GUI (GUI Toolkits) Nástroje uľahčujúce programovanie pomocou preddefinovaných objektov (widgets, gadgets) a ich chovania sa. Tieto objekty sú usporiadané do tried s možnosťami tvorby inštancií objektov a ich hierarchického dedenia vlastností. Trieda má preddefinované (defaultné) vlastnosti (attributes) ale niektoré sa dajú meniť. Príkladom sú OSF Motif, Microsoft Visual Studio a .NET (Basic, C++, C#), Eclipse, Borland JBuilder , Sun NetBeans (Java s balíkmi AWT (Abstract Windowing Tool) a SWING). Táto vrstva je vhodná pre prezentáciu, dobre komunikuje s inými subsystémami, čas vytvorenia rozhrania je dlhý a je náročná na naučenie sa. Možnosť rozširovania a modularita je vcelku dobrá. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Hierrarchia tried XView MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Hierrarchia tried Java AWT MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Hierrarchia kontainerov Java SWING MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad kontainera Jdialog v triede Java SWING MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Hierarchia tried udalostí v Java AWR a SWING MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Správca rozloženia komponentov v Java SWING Border, Flow, Grid, GridBag, Box Layout MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

IDE (Integrated Design Environment) - HLAVNÉ ČRTY Vytváranie programov je spojené s rôznymi činnosťami - editovanie a preklad zdrojového kódu, tvorba používateľského rozhrania, testovanie programu. IDE poskytuje automatizáciu týchto činností. Mejú nasle´dovné vlastnosti: Manažment projektov a súborov Programy pozostávajú z viacerých súborov, ktoré sú uložené v hierarchickej adresárovej štruktúre. Na evidovanie týchto súborov IDE poskytuje vytvoranie projektu. Šablóny aplikácií Niektoré aplikácie musia mať istú štruktúru (napr. MFC aplikácie, DLL knižnice). IDE poskytuje niekoľko takých šablónov. Pomocou dialógových okien sa dá veľmi rýchlo vytvoriť kostru programu a programátor sa môže hneď sústrediť iba na samotný problém. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Editovanie zdrojového kódu IDE obsahuje textový editor pre prácu s viac súbormi s=ubežne, ktorý zvýrazňuje kľúčové slová, označí dvojice zátvoriek, zobrazí v ktorej funcii alebo triede je práve kurzor. Pokročilejšie IDE ponúkajú aj automatické doplnenie kódu s alternatívami a so správnou syntaxou. Preklad, ladenie a test programov IDE ponúka vykonanie rôznych krokov prekladu pomocou klávesových skratiek alebo položky menu. Umožňuje navigáciu pri hľadaní chybových hlásení. Integrovaný ladiaci prostriedok umožňuje krokovanie programu (debugging). Podpora tímových projektov Niektoré IDE podporujú súčasnú prácu viacerých členov tímu. Komunikujú so systémami pre manažment verzií. Vytvárajú vlastne jednoduché rozhranie medzi programátorom a systémom. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Tvorba používateľských rozhraní Je už súčasťou skoro každého IDE - GUI builder, GUI editor. Ponúka WYSIWYG editor. Rozhranie sa tvorí vložením jednotlivých komponentov metódou pretiahni a pusti. Editor eviduje mená, pozície a rôzne iné parametre komponentov. Výsledok - tvary, farba a umiestnenie komponent je okamžite viditeľný a tým slúži ku komunikácii medzi programátorom a používateľom - aj keďhoci softvér je v tejto etape nefunkčný. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad GUI editora IDE Delphi 7 MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad IDE - MS Visual Basic MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad IDE - Sun Netbeans MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad IDE - Sun Netbeans Umiestnenie nového komponentu (Label) s pomocou vodiacich čiar (modré čiarkované) MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Hlavné časti editorov IDE Pracovná plocha Na pracovnej ploche sa vytvoria a zrušia dialógové okná a komponenty v dialógových oknách. Editor umožňuje posúvanie komponentov a zmenu ich rozmerov. Paleta nástrojov Paleta nástrojov ponúka sadu komponentov, ktoré programátor môže umiestniťv okne ako aj nástroje na rozloženie komponentov (layout manager). Okno vlastností Každé dialógové okno a každý komponent má svoje charakteristické atribúty. Tlačidlo má rozmery, pozíciu, farbu a obsahuje text. V okne vlastností sa prezerajú a menia vlastnosti zvoleného objektu. Prehľadávač objektov Prehľadávač objektov umožňuje navigovať medzi objektami, ktoré sú zoradené v hierarchickej stromovej štruktúre. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Iné vlastnosti IDE (niektoré) Zjednodušená práca pri tvorbe formuláru s databázovými prvkami Ak potrebujeme vytvoriť formulár, ktorý má pracovať s dátami z databázy. Automatická tvorba UML diagramov a dokumentácie UML diagramy a dokumentácia sa generuje zo zdrojových kódov každej triedy. Dokumentáciu je možné prezerať priamo v prostredí. Tvorba zálohy Pri tvorbe rozhraní sa vytvárajú automaticky zálohy súboru, s ktorým pracujeme - možnosť vrátiť sa k predchádzajúcim verzii súboru. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Jednoduchá aplikácia v jazyku Java s balíkom SWING MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Qt Qt je multi-platformová vývojový systém široko používaný pre vývoj GUI. Qt používa C++ spoločne s niekoľkými neštandardnými rozšíreniami, pridanými cez pre-procesor, ktorý generuje štandardný C++ pred kompiláciou. Súčasná verzia Qt využíva pre zobrazenie prvkov Qt natívne API na rozdielnych platformách. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

3. Aplikačné rámce a špecializované jazyky (Application Framework/Specialized Language). Vrstva reprezentovaná nástrojmi pre konceptuáknu tvorbu. Táto vrstva je vhodná pre prezentáciu a interakciu, komunikácia s inými subsystémami závisí od nástroja (Flash komplikované, MFC dobré), čas vytvorenia rozhrania je krátky a je nenáročná na naučenie sa. Rozširovanie a modularita v prípade jazykov je obtiažne ale pre rámce je dobré. Aplikačné rámce sú založené na objektovom programovaní. Prvým bol Apple MacApp. Hlavným znakom je že všetky používateľské rozhrania programov majú podobnú štruktúru. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Iný prístup sú skriptovacie jazyky ako Tcl/Tk. Zobraním tejto štruktúry a preložením do tried, objektov a metód veľmi urýchli vývoj aplikácie, lebo používateľ nemusí tvoriť všetko od začiatku. Príkladom sú NextStep a jeho následník Cocoa a Microsoft MFC (MS Foundations Classes). Na druhej strane programátor musí pochopiť veľa abstraktných konceptov. Iný prístup sú skriptovacie jazyky ako Tcl/Tk. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad aplikácie so skriptovacím jazykom Tcl a podporným nástrojom Tk. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

PRINCÍPY TVORBY WIMP V SIEŤOVÝCH APLIKÁCIÁCH WIMP pre statické internetové dokumenty sa dajú tvoriť aj v jazyku HTML a CSS. Hyperlinky sa dajú zoskupovať do menu. Obrázky v linkách predstavujú ikony. A konečne „okná“ sa dajú dosiahnuť pomocou rámov (frames) alebo CSS. PHP Pri aplikáciách pomocou HTML sa používa jazyk PHP. Mení bezstavové HTML na plnohodnotný programovací jazyk. Tento jazyk beží na serveri, a používateľovi predkladá len čisté HTML, teda jeho vyjadrovacie prostriedky sú rovnaké ako HTML, ale užívateľské vstupy sa lepšie premietnu do výstupov (vďaka stavom). Vyvinul sa malé systémy, ale úspešne sa osvedčil aj vo veľkých. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

JavaScript a AJAX Iný jazyk používaný spolu s HTML je JavaScript, ale tento na rozdiel od PHP sa vykonáva na strane klienta. Dokáže tiež spolupracovať s HTML a DOM modelom stránky. Príklady jednoduchého využitia sú otváranie nových okien a zmena vzhľadu objektov po prechode ukazovateľom myši (ale to sa dnes dá aj pomocou statického CSS). JavaScript sa považuje za málo bezpečný jazyk a nevhodný pre veľké systémy. V takomto prípade sa používa kombinácia JavaScriptu a XML - Ajax, ktorý odstraňuje isté nedostatky čistého JavaScriptu. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Príklad aplikácie so skriptovacím jazykom JavaScript a HTML MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Microsoft Windows Presentation Foundation (WPF) definuje XAML ASP.NET Je to balík technológií ale samotnými jazykmi sú VisualBasic a JScript. Ponúka široké možnosti na vytváranie ovládacích prvkov, a navyše umožňuje vytvárať „design-time user interface“, teda dočasný (pracovný, šablónovitý) vzhľad stránky, ktorý môžu iní ľudia ďalej dotvárať v integrovaných vývojových prostrediach ako napríklad MS Visual Studio. Microsoft Windows Presentation Foundation (WPF) definuje XAML deklaratívny jazyk pre rozhrania, ktorý beží na vrchu NET.Framework 2.0 a pripomína XUL. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

ColdFusion je balík technológií od spoločnosti Adobe Systems. Používa vlastný jazyk CFML, a jeho prednosťou je vytváranie formulárov (rich forms), export do filmov jazyka Flash a konverzia na formát PDF. Výhodou je generovanie kódu na strane používateľa. Samotný ColdFusion je napísaný v platforme J2EE a tak umožňuje kvalitnú integráciu s jazykom Java. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Java Server Pages Integráciu s jazykom Java umožnuje technológia Java Server Pages, pomocu ktorej možno do statického kontextu zasadiť kód jazyka Java s nadefinovanými aktivitami, a generovať HTML a XML kód podľa želaní používateľa. Ruby on Rails Výhodou Ruby on Rails oproti predchádzajúcim dvom balíkom je otvorený zdrojový kód. Na mnohé aspekty webových aplikácií ponúka hotové konvenčné riešenia, ktoré stačí len minimálne upravovať. Pod „aspektami“ rozumiem oblasti ako napojenie na databázu, ale tiež (z hľadiska HCI dôležité) bohatstvo ovládacích prvkov. Základom tejto technológie je jazyk objektovo-orientovaný interpretovaný jazyk Ruby. Všetky spomínané technologické platformy viac či menej striktne dodržiavajú návrhový vzor Model-View-Controller. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

XUL - XML User Interface Language. Je to jazyk na špecifikáciu používateľského rozhrania na báze XML. Tvorí premostenie medzi bežnými aplikáciami a webovými aplikáciami, pretože v prehliadači Mozilla Firefox sa používa aj na zobrazenie WWW stránok, ako aj na samotné ovládacie panely a iné prvky daného prehliadača. Jazyk XUL sa mimoriadne hodí na užívateľské rozhranie, pretože priamo poskytuje veľké množstvo komponentov, napríklad výber farby, výber dátumu, posuvníky, merače vývoja (progress meters) rozbaľovacie zoznamy s možnosťou výberu viacerých položiek a tak podobne. Je platformovo nezávislý a striktne oddeľuje zobrazovaciu časť od aplikačnej logiky. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Web developers already familiar with Dynamic HTML (DHTML) will learn XUL quickly and can start building applications right away Firefox or another Gecko-based browser MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Microsoft Windows Presentation Foundation (WPF) definuje XAML deklaratívny jazyk pre rozhrania, ktorý beží na vrchu NET.Framework 2.0 a pripomína XUL. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Je to multiparadigmový skriptovací jazyk. Python Je to multiparadigmový skriptovací jazyk. Dokáže vytvárať dynamické web stránky s bohatými ovládacími prvkami (CGI), a zároveň pomocou viazaní na grafické knižnice GTK, Qt a iné tvoriť rozhrania a skripty pre štandardné aplikácie. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

SYSTÉMY RIADENIA OBSAHU Content Management Systems (CMS), sú istými „meta-aplikáciami“. Koncový používateľ má istotu, že modulárnosť, napojenie na databázy ale najmä používateľské rozhranie bolo navrhnuté skúsenými odborníkmi, a on sám potrebuje len naplniť tento systém údajmi, prípadne vykonať menšie modifikácie. Medzi typické CMS patrí napríklad MediaWiki či Joomla. Zaujímavým príkladom je reBOX, čo je v podstate API na tvorbu webových aplikácii s presne rovnakými ovládacími prvkami ako klasické desktop aplikácie. Jeden z vrcholných prejavov možností webových technológií je portál Meebo (http://www.meebo.com). Táto stránka ponúka možnosť prihlásiť sa na rôzne IM siete cez webový prehliadač, a aj sa ako štandardný IM klient správa. Na stránke sa vyskytujú okná (dokonca posúvateľné a s nastaviteľnou veľkosťou) s ikonami aj menu. MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Ďaľším prístupom je spojenie vizuálnych editorov so skriptovacími jazykami. Príkladom sú produkty Macromedia Director (Lingo) a Flash (Action Script) - oba používajú metaforu filmových scenárov, kde je časová os vo forme technického scenára a vrstvami, kde sú paralelne bežiace deje ako aj Authorware, kde vizuálne programovanie pripomína tvorbu grafov toku dát (data flow). MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Okno systému MM Flash MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ

Vrstva reprezentovaná nástrojmi pre budovanie modelov. 4. Aplikácie Vrstva reprezentovaná nástrojmi pre budovanie modelov. Príkladom sú Microsoft Access, Sybase PowerDesigner. Táto vrstva je vhodná pre všetky špecifické domény (aplikácia, interakcia, prezentácia), komunikácia dobre s inými subsystémami špecifickej domény, čas vytvorenia rozhrania aplikácie je krátky a je náročná na naučenie sa, dobrá rozšíritľnosť a modularita . MARTIN ŠPERKA: INTERAKCIA ČLOVEK – POČÍTAČ