PODPORA IMPLEMENTÁCIE ROZHRANÍ

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).


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.


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.


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.


Príklad použitia GDI v jazyku C.

// dátová štruktúra pre device context - smerník na pamäť obrazuHDC hdc;// získanie kontextu zariadeniahdc = GetDC(hWnd);// dátové štruktúry pre nový štetec a pôvodný štetecHBRUSH hBrush, hOldBrush;// vytvorenie nového štetca zelenej farbyhBrush = CreateSolidBrush(RGB(0, 255, 0));// použitie nového štetca, pôvodný si zapamätáme pre neskoršie obnoveniehOldBrush = (HBRUSH) SelectObject(hdc, hBrush);// zobrazí obdĺžnik 100 x 200, ľavý horný roh bude mať súradnice x=10, y=5Rectangle(hdc, 10, 5, 100, 200);// obnovenie pôvodného štetcaSelectObject(hdc, hOldBrush);// zrušenie nového štetcaDeleteObject(hBrush);// uvoľníme device contextReleaseDC(hWnd, hdc);


Obrázok vytvorený predchádzajúcim kódom


GDI+

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++.


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ú.


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.


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.


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)


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


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:


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).


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ý:


repeat read-event(MojaUdalost) case MojaUdalost.typ

typ_1: do spracovanie typ_1typ_2: do spracovanie typ_2……………………………..typ_n: do spracovanie typ_n

end caseend repeat


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.



(prevzaté z knihy Dix,A., Finlay, J., Abowd, G., Beale, R.: Human – Computer Interaction. Prentice Hall Europe)


repeat read-event(MojaUdalost) case MojaUdalost.typ

typ_1: do spracovanie typ_1typ_2: ----

if (chybova_podmienka) thenrepeat

read-event(MojaUdalost2)case MojaUdalost2.typ

typ_1:typ_2:

……..typ_n:

end caseuntil (end-condition2)

endif …….

typ_n: do spracovanie typ_n end caseuntil (end-condition)

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.


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.


#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 blendingglutInitDisplayMode(GLUT_DEPTH | GLUT_RGBA);// nastaví umietnenie a veľkosť oknaglutInitWindowPosition(100,100);glutInitWindowSize(320,320);// vytvorí okno s titulkomglutCreateWindow("OpenGL pomocou GLUT");// registruje callback funkciu pre zobrazenie scényglutDisplayFunc(renderScene);

// zobrazí okno a spustí spracovanie udalostíglutMainLoop();

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

double mX, mY; int clicked;// funkcia pre spracovanie udalostí myšivoid 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ávesnicevoid keyFunc(unsigned char key, int x, int y) {

switch (key) { // key udáva ASCII hodnotu stlačeného znakucase 'W': oY = oY + 1; break;case 'S': oY = oY - 1; break;case 'A': oX = oX - 1; break;case 'D': oX = oX + 1; break;}

}… vo funkcií main … glutKeyboardFunc(keyFunc);


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

}


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


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

}});



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).


• 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.


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.

Architektúra klient - server



Systém X-Windows (X11)


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;

}}


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á.


Hierrarchia tried XView

(prevzanté z knihy Dix,A., Finlay, J., Abowd, G., Beale, R.: Human – Computer Interaction. Prentice Hall Europe)


Hierrarchia tried Java AWT


Hierrarchia kontainerov Java SWING


Príklad kontainera Jdialog v triede Java SWING


Hierarchia tried udalostí v Java AWR a SWING


Správca rozloženia komponentov v Java SWINGBorder, Flow, Grid, GridBag, Box Layout


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úborovProgramy 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.


Editovanie zdrojového kóduIDE 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 projektovNiektoré 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.


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ý.


Príklad GUI editora IDE Delphi 7


Príklad IDE - MS Visual Basic


Príklad IDE - Sun Netbeans


Príklad IDE - Sun NetbeansUmiestnenie nového komponentu (Label) s pomocou vodiacich čiar (modré

čiarkované)

Hlavné časti editorov IDE

Pracovná plochaNa 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ástrojovPaleta 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č objektovPrehľadávač objektov umožňuje navigovať medzi objektami, ktoré sú zoradené v hierarchickej stromovej štruktúre.


Iné vlastnosti IDE (niektoré)

Zjednodušená práca pri tvorbe formuláru s databázovými prvkamiAk potrebujeme vytvoriť formulár, ktorý má pracovať s dátami z databázy.

Automatická tvorba UML diagramov a dokumentácieUML 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álohyPri 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.



Jednoduchá aplikácia v jazyku Java s balíkom SWING

(Prevzaté z knihy Schneiderman, B., Plaisant, C.: Designing the User Interface.PearsonEducation, Inc.)


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.


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.


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.


Príklad aplikácie so skriptovacím jazykom Tcl a podporným nástrojom Tk.

(Prevzané z knihy Schneiderman, B., Plaisant, C.: Designing the User Interface.Pearson Education, Inc.)


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.


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.


Príklad aplikácie so skriptovacím jazykom JavaScript a HTML

(Prevzané z knihy Schneiderman, B., Plaisant, C.: Designing the User Interface.Pearson Education, Inc.)


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.


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.


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.


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.


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

https://developer.mozilla.org/en/DHTML

https://developer.mozilla.org/en/Gecko


Microsoft Windows Presentation Foundation (WPF)

definuje XAML deklaratívny jazyk pre rozhrania, ktorý beží na vrchu NET.Framework 2.0 a pripomína XUL.


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.


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.

http://www.meebo.com/

Ď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).


Okno systému MM Flash


(Prevzaté z knihy Schneiderman, B., Plaisant, C.: Designing the User Interface.Pearson Education, Inc. )


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 .

PODPORA IMPLEMENTÁCIE ROZHRANÍ

Documents

Transcript of PODPORA IMPLEMENTÁCIE ROZHRANÍ