Curs 3 GAW

Machete pentru GUI (1)

Cuprins Tipuri de machete Poziionarea absolut FlowLayout BorderLayout Tipuri de machete

Interfeele complexe presupun existena unui mare numr de componente i a unor inter-relaii ntre unele dintre acestea. Prin urmare, n diferite situaii concrete este necesar aezarea acestor elemente n spaiu astfel nct s se pstreze ordinea i anumite legturi logice ntre componente. Machet este o formul care definete modul de aezare i dimensiunile elementelor componente ale unei Interfee Grafice de Utilizator. Principalele machete utilizate actualmente n cadrul Interfeelor Grafice de Utilizator (GUI) din aplicaiile ce ruleaz sub mediul Ms. Windows sunt:

 Poziionarea absolut FlowLayout BorderLayout GridLayout GridBagLayout CardLayout Funcie de caracteristicile ferestrei i de componena ei se selecteaz cea mai potrivit metod de machetare Poziionarea absolut Poziionarea absolut este forma cea mai exact de plasare n spaiu a elementelor componente ale interfeei. Fiecare obiect n parte este plasat fix funcie de originea de referin aflat n colul din stnga sus al ferestrei. De asemenea, dimensiunea fiecrui element este fix i precizat n mod explicit prin numrul de pixeli ocupai pe lime i nlime. Poziionarea absolut este forma cea mai exact de plasare n spaiu a elementelor componente ale interfeei. Fiecare obiect n parte este plasat fix funcie de originea de referin aflat n colul din stnga sus al ferestrei. De asemenea, dimensiunea fiecrui element este fix i precizat n mod explicit prin numrul de pixeli ocupai pe lime i nlime. Modul de lucru cu aceast machet presupune urmtoarele comenzi: Definirea containerului; Definirea machetrii ca fiind absolut; Specificarea poziiei i dimensiunilor exacte pentru fiecare component n parte cu metoda setBounds(int coord_x, int coord_y, int lung, int inalt) . Avantajul acestui tip de machet este acela c permite fixarea foarte exact a fiecrei componente n cadrul interfeei. Label lo; TextField to; ... public void init(){ Container c= getContentPane(); c.setLayout(null); ... // metoda initilizare // definire container // setare Layout absolut

lo=new Label("Jucatorul "); // instantiere eticheta lo.setBounds(20,50,160,20); // setare pozitie i dimensiuni this.add(lo); to=new TextField(p_st); this.add(to); ... } // adaugare la panel // instaniere camp de text // adaugare la panel

to.setBounds(180,50,30,20); // setare pozitie i dimensiuni

Dezavantajele machetei cu poziionare absolut sunt: Metoda este laborioas i dificil de aplicat pentru machetele cu multe elemente La redimensionarea ferestrei elementele rmn fixe aa cum se vede n figur. FlowLayout Stilul FlowLayout (poziionarea curgtoare) este o form simpl de distribuie a componentelor n cadrul interfeei. Obiectele sunt plasate pe rnd de la stanga la dreapta n ordinea n care sunt adugate n panel. La terminarea unui rnd se trece la ocuparea n acelai mod a rndului urmtor. n multe aplicaii aceast formul simpl este foarte avantajoas i satisface cu succes cerinele concrete de machetare. Etapele concrete de lucru sunt: Definirea containerului; Definirea machetrii ca fiind FlowLayout; Plasarea obiectelor pe rnduri. Dezavantajul acestei metode const n aceea c la redimensionare aezarea componentelor se modific radical i exist riscul ca s se piard relaia corect ntre diferitele elemente.

Constructorii clasei FlowLayout sunt: FlowLayout() machet cu presetri default; FlowLayout(int alin) machet cu presetri default; FlowLayout(int alin, int dist_x, int dist_y) machet cu presetri default. Variabilele ntregi sunt: alin = alinierea (LEFT, CENTER, RIGHT), dist_x = distana pe orizontal ntre dou componente consecutive, dist_y = distana pe vertical ntre dou rnduri consecutive. n figura alturat se demonstreaz cum o machetare iniial corect se pierde n momentul n care fereastra este redimensionat.

Acest fapt se ntmpl deoarece rndurile iniiale se modific. Label lo; TextField to; ... public void init(){ Container c= getContentPane(); c.setLayout(new FlowLayout(Left)); ... lo=new Label("Jucatorul "); // instantiere eticheta this.add(lo); to=new TextField(20); this.add(to); ... } BorderLayout Stilul BorderLayout (poziionarea pe sectoare) pornete de la mprirea suprafeei n sectoare denumite dup granie: North, South, East, West i Center. // adaugare la panel // instaniere camp de text // adaugare la panel // metoda initilizare // definire container // setare Layout absolut

Obiectele sunt plasate n fiecare sector pe baza unor machete ce pot fi definite separat n fiecare: Label lo, li; TextField to, ti; Button Ok ... public void init(){ p1.setLayout(new FlowLayout(CENTER)); lo=new Label(Numele); to=new TextField(30); p1.add(lo); p1.add(to); ... add("North",p1); p2.setLayout(new GridLayout(2,2,10,5)); p2.add(li=new Label("Cf.mult.")); p2.add(ti=new TextField("1",2)); p2.add(Ok=new Button("Ok")); ... add("South",p2); ... } ... // adaugare sector la panel // adaugare sector la panel // adaugare la sector // instantiere // declarare componente