Programare vizual (suport de curs), A.Pereteatcu, S.

Pereteatcu

1. Noiunea de Interfa Grafic a Utilizatorului (GUI). Elemente principale

Interfaa Grafic a Utilizatorului (engl. Graphical User Interface, GUI) n tehnic de calcul
un sistem de mijloace de interacionare a utilizatorului cu calculator, care se bazeaz pe
reprezentarea a tuturor obiectelor i a funciilor disponibile utilizatorului, n form de
componente grafice pe ecran (ferestre, iconie (pictograme), meniuri, butoane, liste etc.).
Totodat, spre deosebire de interfa de tip irul de comand, utilizatorul are acces arbitrar
(prin intermediul tastaturii sau mouse-lui) la toate obiectele vizibile pe ecran.
Elemente ale interfeei grafice principale sunt:

Cursor (engl. Mouse cursor) o mic imagine grafic pe ecran al monitorului (de
obicei n form de sgeat) care indic poziia unitii pointate de intrare (cum ar fi
mouse, trackball, panel sensibil, peni, tablet digital sensibil sau plana grafic);

Fereastr (engl. window) regiunea pe ecran care reprezint (reflect) informaii i a

crei coninut se afieaz independent de la celelalte pri ale ecranului;

Meniu (engl. menu) elementul de interfa care asigur posibilitatea de a alege una
din cteva opiune enumerate;

Pictogram sau iconi (engl. icon) o imagine mic ce reprezint unul din obiecte
cum sunt: aplicaie, fiier, map, fereastr, elementul (componentul) sistemului de
operare, unitate etc.;

Bara de instrumente, sau bara de unelte (engl. toolbar) elementul interfeei grafice
ce reprezint un set de pictograme, alegerea fiecrei iniializeaz o aciune careva a
utilizatorului. n plus la pictograme, bara de instrumente poate s conin meniu,
cmpuri de text, liste derulante;

Bar de derulare sau bar de scrolling (engl. scroll bar) elementul grafic care
permite deplasarea coninutului ferestrei n direcia vertical sau orizontal;

Bara de stare (engl. status bar) elementul grafic cu funcia principal de a reflecta
informaii despre starea curent a ferestrei;

Elemente de control (engl. controls sau widgets) elemente ale interfeei grafice a
utilizatorului care reflect informaii sistematizate cu posibilitate de a fi modificate de
ctre utilizator. Cele mai importante elemente de control sunt: etichete (labels),
butoane de comand (buttons), radio-butoane sau butoane de opiune (radio buttons),

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

check-box sau casete de validare (check box), liste (list box), liste derulante (combo
box), zone de text (casete de editare) (text box), spinnere (spinners), i altele.
2. Bibliotecile utilizate pentru crearea GUI
Fiecare sistem cu ferestre conine un set propriu de elemente, cu interfaa care asigur lucrul
cu aceste elemente la un nivel jos. Unele din biblioteci de elemente de control reprezint
nveliuri de niveluri mari la elemente de control standard. Aa biblioteci simplific lucrul cu
elemente de control i extind funcionalitatea lor. Altele reprezint posibilitile crossplatformice: interfaa soft unic pentru a programa interfaa utilizatorului n mai multe platforme
sau sisteme cu ferestre. Acum exist un ir ntreg de biblioteci GUI. Cele mai importante din ele
sunt:
1. Bibliotecile pentru elaborarea GUI sub sistemul de operare:

Windows API (Application Programming Interfaces) un set de funcii de baz de

interfee pentru programarea aplicaiilor sub sisteme de operare din familiile
Windows i Windows NT. Lucrul prin Windows API este cea mai apropiat de
sistemul de operare metod de interaciona cu ea din programele aplicate.

MFC (Microsoft Foundation Classes). MFC d posibilitatea de a elabora GUIaplicaii pentru Microsoft Windows n limbajul C++ cu utilizarea unui set bogat de
clase din bibliotec. O mare parte din MFC reprezint un nivel orientat pe obiecte
asupra funciilor i structurilor Windows API. MFC ntr n chitul de instalare pentru
Visual C++ i Microsoft Visual Studio.

WTL (Windows Template Library) biblioteca gratuit de clase template n C++.

WTL reprezint un nivel asupra interfeei Windows API sistemelui de operare
Windows. A fost elaborat n primul rnd ca o alternativ mai uoar a bibliotecii
MFC. Oficial nu este susinut.

OWL (Object Windows Library) biblioteca de clase, elaborat de firma Borland

pentru crearea aplicaiilor cu ferestre n Delphi, Borland C++ Builder i altele.

VCL (Visual Component Library) biblioteca orientat pe obiecte pentru elaborarea

GUI. VCL ntr n kitul de instalare Delphi, C++ Builder i Borland Developer
Studio.

Windows Forms este un set de clase din .Net Framework, care rspund pentru
interfaa grafic a utilizatorului. Important c clasele ce realizeaz GUI pentru
Windows Forms nu depend de limbajul de progfamare.

2. De cross-platform, n baza C/C++, cu posibilitatea de a fi utilizate n alte limbaje:

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

GTK+ (GIMP Toolkit) unul din dou, cele mai populare n ziua de azi, seturi de
elemente de interfa pentru X Window System, fiind baza lor. X Window
System este sistemul cu ferestre, care asigur instrumente standard i protocoale
pentru crearea interfeelor grafice de utilizator. Aproape toate sisteme de operare
moderne susin X Window System, ns mai mult el se folosete sisteme de tip
UNIX.

Qt este instrumentariu de tip cross-platform. El include n sine toate clase

principale care pot fi necesare la elaborarea softului aplicativ, ncepnd cu
elementele interfeei grafice i terminnd cu clase pentru lucrul cu reea, baze de
date i XML. Qt este complet orientat pe obiecte, uor se extinde, susine
tehnologia de programare pe componente. Sunt patru versiuni ale bibliotecii:
Qt/Windows, Qt/X11, Qt/Mac, Qt/WinCE.

FOX Toolkit este unul din cele mai rapide pachete. El conine un numr mare
de elemente de GUI i susine OpenGL.

wxWidgets este un framework folosit pentru dezvoltarea de aplicaii grafice

portabile pe mai multe sisteme de operare: Windows, Mac OS X, Linux, diverse
versiuni de UNIX, etc. El este un wrapper peste funciile native ale sistemului de
operare respectiv. De exemplu, pe Windows, este un wrapper peste Winapi. O
aplicaie wxWidgets nu "deseneaz" controalele folosite (cum face QT, de
exemplu), ci folosete chiar controalele native. Pe UNIX/Linux, cea mai stabil
versiune este un wrapper peste GTK 2.x.

3. De cross-platform n baza limbajului Java:

Swing biblioteca pentru crearea interfeelor grafice n limbajul Java. Swing a

fost elaborat de compania Sun Microsystems i se refer la biblioteca de clase
JFC. JFC reprezint un set de biblioteci pentru elaborarea nveliurilor grafice. n
setul acesta ntr bibliotecile Java 2D, Accessibility-API, Drag & Drop-API i
AWT.

SWT (Standard Widget Toolkit) biblioteca pentru crearea interfeelor grafice n

limbajul Java. Este elaborat de fondul Eclipse. SWT nu este o bibliotec grafic
independent ci reprezint un nveli de tip cross-platform pentru bibliotecile
grafice din diferite platforme. De exemplu sub GNU/Linux SWT folosete
biblioteca Gtk+. Utilizarea SWT face aplicaia Java mai efectiv, ns micoreaz
independena de SO i de echipament, cernd eliberarea manual a resurselor,
ceia ce ntr-o anumit msur ncalc conceptul Sun de platforma Java.

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

3. Biblioteca Windows Forms

Windows Forms este un set de clase (biblioteca de clase) .Net Framework pentru crearea
aplicaiilor GUI n Microsoft .NET.
Aplicaiile ce utilizeaz Windows Forms folosesc clase System.Windows.Forms. Aceast
seciune include aa clase ca Form modeleaz comportarea ferestrelor sau formelor; Menu
reprezint meniuri; Clipboard asigur aplicaiilor Windows Forms posibilitatea de a utiliza
buferul de interschimbare (clipboard).
Windows Forms conine un set larg de elemente de control, care pot fi puse pe forme:
elemente pentru afiarea inscripiilor, butoane, liste derulante, casete de validare i chiar
paginile-web.
n baza aproape fiecrei aplicaii scrise cu utilizarea Windows Forms st clasa derivat de la
System.Windows.Forms.Form. O instan a acestei clase reprezint fereastra principal a
aplicaiei.
Un alt aspect important al modelului de programare Windows Forms este mecanismul de
prelucrare a evenimentelor. Evenimente n Windows Forms sunt membrii clasei egale cu
metode, cmpuri i proprieti. Practic toate clasele de dirijare (control classes) Windows Forms
(precum i multele din celelalte clase, nu de dirijare) creeaz evenimente. De exemplu, buton
(exemplarul System.Windows.Forms.Button) dup apsarea creeaz (genereaz) evenimentul
Click.
Windows Forms are i multe alte posibiliti, care fac simpl i uoar executarea sarcinilor
obinuite, de exemplu susinerea crerii dialogurilor, imprimarea, adugarea informaiilor (help)
i documentaiilor, rspndirea aplicaiei la mai multe limbi, etc.

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

4. Ierarhia claselor Windows Forms

Toate clasele din Windows Forms sunt urmaii ai clasei de baz Object.

Fig. 4.1 Ierarhia de clase Windows Forms

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

Clasa Control n ierarhia de clase ocup locul destul de nalt, ns ea totui are dou clase
printeti importante clasa Component asigur elementelor de control posibilitatea de a fi
componente, i clasa MarshalByRefObject asigur posibilitatea trimiterii elementelor de control
prin reea. Clasa Control definete proprietile importante, metode i evenimente care se
motenesc de ctre toi urmaii si. Cel mai des acetea sunt motenitori nemijlocii, ns, uneori,
ei au i un printe intermediar, care poate fi o clas abstract (asta are sens pentru butoane, liste,
elemente de control textuale).
Clasa Form este una din urmaii ai clasei Control, astfel forma este un element de control cu
proprieti speciale. Fiind motenitoare a claselor ScrollableControl i ContainerControl,
forma admite scrolling i amplasarea elementelor de control.

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

5. Crearea aplicaiilor de tip Dialog Based

Aplicaii de tip Dialog Based sunt aplicaii la care fereastra principal reprezint fereastra
de tip dialog. De obicei, la aplicaiile de tip dialog lipsesc aa elemente de interfa grafic cum
sunt: meniul principal, bara de instrumente, bara de stare. Toat suprafaa a ferestrei principale
aplicaiei dialog este destinat pentru amplasarea elementelor de control (engl. controls). Ca
exemplu de aplicaii de tip Dialog Based din sistemul de operare Windows pot fi aduse:
Calculator, Character Map, Sound Recorder

. a.

S cercetm un exemplu de creare a aplicaiei de tip dialog n limbajul # cu ajutorul

bibliotecii Windows Forms din .Net Framework.
Crem un fiier cu denumirea DialogBasedApp i extensia .cs. n acest fiier nscriem
urmtorul cod:
//Conectm spaii de nume.
//Spaiile de nume determin colecii(mulimi) de clase ce
//realizeaz diferite funcionaliti
using System;
using System.Windows.Forms;
//Declarm n baza ferestrei Form
//clasa ferestrei principale a aplicaiei
class MainDialog : Form
{
//Constructorul clasei a ferestrei principale
public MainDialog()
{
//Setm textul pe bara de titlu a ferestrei.
Text="Dialog based application";
//Setm poziia i dimensiunile iniiale ale ferestrei.
//FormStartPosition este enumerare, ce conine urmtoarele constante:
//

CenterParent Forma va fi centrat relativ la fereastra printe;

//

CenterScreen - Forma va fi centrata relativ la ecran i

//

dimensiunile formei vor fi specificate n proprietatea Size;

//

Manual Poziia formei se determin prin proprietatea Location;

//

WindowsDefaultBounds poziia i dimensiunile formei vor fi setate

//
//
//

implicit;
WindowsDefaultLocation poziia formei va fi setat implicit iar
dimensiunile se specific n proprietatea Size

StartPosition=FormStartPosition.Manual;
Location=new System.Drawing.Point(100, 100);

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

Size=new System.Drawing.Size(600, 400);
//Setm legtura ntre evenimentul nchiderea ferestrei
//i handlerul de evenimente.
//EventHandler este un delegat care seteaz legtura ntre
//evenimentul i handlerul (procesorul) al acestui eveniment
Closed+=new System.EventHandler(MainDialog_Closed);
}
//Adugm handlerul evenimentului nchiderea ferestrei
private void MainDialog_Closed(object sender, EventArgs e)
{
//Fiindc forma va fi folosit ca o fereastr de dialog modal,
//dup un clic pe butonul X (Close) din colul dreapta-sus,
//ea devine invizibil. n acest caz metoda Close nu va fi apelat.
//Dac forma nu se mai folosete, trebuie s apelm metoda Dispose,
//pentru a elibera pe toate resursele formei utilizate.
//Distrugem fereastra i eliberm resurse
Dispose();
}
}

Mai crem un fiier cu denumirea MainApp i extensia .cs, n care nscriem urmtorul cod
de program:
using System;
//Declarm clasa principal a aplicaiei noastre
class MainApp
{
//Funcia Main definete punctul de intrare n aplicaia
//Tipurile din spaiul de nume System.Windows.Forms apeleaz intens
//codul Win-32, elaborat pentru lucrul n single apartment. Din cauza
//aceasta metoda Main n programul nostru trebuie marcat ca [STAThread].
//Altfel blocrile programului nu sunt excluse
[STAThread]
public static void Main()
{
//Crem fereastra principal fereastr modal de dialog a aplicaiei
MainDialog maindialog = new MainDialog();
//Vizualizm forma pe ecran ca un dialog modal
maindialog.ShowDialog();
}

10

Programare vizual (suport de curs), A.Pereteatcu, S.Pereteatcu

}

Rolul ferestrei principale n exemplul nostru joac fereastra modal de dialog, construit n
baza formei. Dup clicul pe butonul (Close) fereastra nu se distruge, doar devine invizibil.
Pentru a distruge fereastra i a elibera resursele este necesar de a apela metoda Dispose().
Pentru a compila programul vom avea nevoie de .Net Framework SDK. El poate fi luat de
pe situl http://www.microsoft.com/downloads. .Net Framework SDK se conine la fel i n
complectul pachetului de program Microsoft Visual Studio.NET. Dup instalarea SDK crem
un fiier .bat, de exemplu, cu numele compile i nscriem n el urmtorul coninut:
C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\csc.exe /target:winexe
/main:MainApp MainApp.cs DialogBasedApp.cs
pause

Prin parametrul main se indic denumirea clasei a crei funcia Main() va fi utilizat pentru
intrare n aplicaie. Parametrul target poate lua una din dou valori: exe sau winexe. n cazul
cnd programul va fi compilat cu valoarea exe, dup lansarea programului pe ecran pe lng
fereastra de dialog va aprea i o fereastr de consol. n cazul cu valoarea winexe, fereastra de
consol nu apare.

Lansm programul i observm pe ecran fereastra de dialog:

11