Lucrareanr.

12GraficenJava Breviar teoretic

Deoarece graficele sunt de departe elementele cele mai sugestive n cadrul unor aplicaii de tip pagini web am considerat c se cuvine s acordm un spaiu separat facilitilor de desenare pe care le ofer mediul Java. Deoarece Windows este un sistem grafic, tot ce este afiat n cadrul unei ferestre sunt elemente grafice, fie c este vorba de un text, fie c este vorba de desene sau animaii complicate. Elemente grafice de tip bara de defilare O bar de defilare poate fi implementat prin utilizarea unui obiect de tip scrollbars. Structura unui astfel de obiect este:
Scrollbar scrollbar = new Scrollbar(orientation, start, page, min, max);

Orientarea obiectului poate fi specificat prin argumentele: Scrollbar.HORIZONTAL i Scrollbar.VERTICAL, start va indica printr-un ntreg valoarea de la care fi localizat iniial cursorul, page va identifica pagina uzual va avea valoarea 0, min va indica valoarea minim, iar max, va indica valoarea maxima a obiectului. Spre exemplu o bar de defilare a crei valoare va putea fi modificat ntre 0 i 100 cu valoarea implicit de 50 va fi specificat astfel:
Scrollbar scrollbar=new Scrollbar(Scrollbar.HORIZONTAL, 50, 0, 1, 100);

Evenimente asupra barei de defilare Metoda care se ocup de tratarea evenimentelor ce apar n cadrul unei aplicaii Java este handleEvent() din cadrul clasei Component. Aceast metod gestioneaz toate evvenimentele ce pot aprea n cadrul unei aplicaii Java. n tabelul urmtor sunt prezentate primcipalele evenimente tratate de metoda handleEvent(). ACTION_EVENT GOT_FOCUS KEY_PRESS KEY_RELEASE LIST_DESELECT LIST_SELECT LOST_FOCUS MOUSE_DOWN MOUSE_DRAG MOUSE_ENTER MOUSE_EXIT MOUSE_MOVE MOUSE_UP SCROLL_ABSOLUTE SCROLL_LINE_DOWN SCROLL_LINE_UP SCROLL_PAGE_DOWN SCROLL_PAGE_UP WINDOW_DEICONIFY WINDOW_DESTROY WINDOW_EXPOSE Un eveniment generat de metoda action(). Componenta este focalizat. A fost activat o tast. A fost eliberat o tast. Un element dintr-o list a fost deselectat. Un element al listei a fost selectat. Componenta nu mai este focalizat. Utilizatorul a apsat butonul stng al mouse-ului Mouse-ul a fost micat avnd butonul stng apsat Mouse-ul a fost mutat ntr-o zon de interes. Mouse-ul a prsit o zon de interes. Mouse-ul a fost micat de utilizator. Utilizatorul a eliberat butonul stng al mouse-ului. Utilizatorul a mutat cursorul barei de defilare. Utilizatorul a activat sgeata din zona inferioar a barei de defilare. Utilizatorul a activat sgeata din zona superioar a barei de defilare. Utilizatorul a activat zona de sub cursorul barei de defilare. Utilizatorul a activat zona de deasupra cursorului barei de defilare. Fereastra a fost restaurat de la dimensiunea de icon. Fereastra a fost distrus. Fereastra a fost activat.

WINDOW_ICONIFY WINDOW_MOVED

Fereastra a fost redus la un icon. Feresatra a fost mutat.

Prin urmare unei bare de defilare i se pot asocia 5 metode i implicit 5 evenimente distincte posibile SCROLL_ABSOLITE, SCROLL_LINE_DOWN, SCROLL_PAGE_DOWN, i SCROLL_PAGE_UP. Dup determinarea unuia dintre aceste evenimente, pot fi determinati prin utilizarea unor metode suplimentare, o serie de parametri. n tabelul urmtor sunt prezentate metodele ce pot furniza informaii asupra evenimentelor ce au avut loc n legtur cu bara de defilare-Scrollbar: Metoda Int getLineIncrement() Int getMaximum() Int getMinimum() Int getOrientation() Int getPageIncrement() Int getValue() Int getVisible() setLineIncrement(int inc) setPageIncrement(int inc) setValue(int value) setValues(int value, int visible,int minimum,int maximum) Descriere Furnizeaz incrementul liniei Ofer valoarea maxim Ofer valoarea minim Ofer orientarea barei Indic valoarea incrementului paginei Furnizeaz valoarea curent a poziiei cursorului Indic valoarea paginei Seteaz increment-ul liniei Seteaz increment-ul paginei Seteaz poziia cursorului la valoarea argument Seteaz bara de defilare la valoarile argument: pgsize, int min, int max)

Aplicatie: Creai i implementai urmatoarele variante pentru applet-ul BaraDefilare:

Varianta 1

import java.awt.*; import java.applet.*; //sunt importate pachetele public { class BaraDefilare

necesare extends Applet

Scrollbar BaraDefilare; String s; public void init() {//se initializeaz BorderLayout layout setLayout(layout); //se stabileste elementele appletului = new BorderLayout(); de poziie

gestionarul

BaraDefilare=new Scrollbar(Scrollbar.HORIZONTAL,50, 0, 1, 100); add("North", scrollbar); //se adaug bara de defilare s = "50"; Font font = new Font("TimesRoman", Font.BOLD, 72); setFont(font); resize(200, 200); //s-a stabilit valoarea s, tipul } public void paint(Graphics g) {//s-a lansat metoda de desenare g.drawString(s, 60, 120); de font i dimensiunea

//este }

afiat

valoarea

irului

public boolean handleEvent(Event evt) {//tratarea evenimentelor ce pot aprea if (evt.target instanceof Scrollbar) { scrollbar = (Scrollbar)evt.target; int value = BaraDefilare.getValue(); s = String.valueOf(value); repaint(); return } else { boolean result = super.handleEvent(evt); return result; } } } Varianta 2 true;

import java.awt.*; import java.applet.*; //sunt importate pachetele

necesare

public class BaraDefilare extends Applet { Scrollbar BaraDefilare; String s; public void init() {//se initializeaz elementele appletului BorderLayout layout = new BorderLayout(); setLayout(layout); //se stabileste gestionarul de poziie BaraDefilare=new Scrollbar(Scrollbar.HORIZONTAL,50,0,1,100); add("North", BaraDefilare); //se adaug bara de defilare s = "50"; Font font = new Font("TimesRoman", Font.BOLD, 72); setFont(font); resize(200, 200); //s-a stabilit valoarea } s, tipul de font i dimensiunea

public void paint(Graphics g) {//s-a lansat metoda de desenare g.drawString(s, 60, 120); //este afiat valoarea irului } public void raspuns() { int value = BaraDefilare.getValue(); s = String.valueOf(value);

repaint(); } public boolean handleEvent(Event evt)

{//tratarea evenimentelor ce pot aprea switch (evt.id) { case Event.SCROLL_ABSOLUTE: {raspuns();return true;}; case Event.SCROLL_LINE_DOWN: {raspuns();return true;}; case Event.SCROLL_LINE_UP: {raspuns(); return true;}; case Event.SCROLL_PAGE_DOWN:{ raspuns(); return true;}; case Event.SCROLL_PAGE_UP: {raspuns();return true;}; default: return false; } } }

Probleme propuse
1. Inhibai pe rnd metodele ce se ocup cu bara de defilare. Ce observai? 2. Utilizai metodele specifice mouse-ului i apoi pe cele specifice ferestrelor, prin rescrierea metodei handleEvent. 3. Utilizai 2 bare de defilare i afiai att valoarea numeric a fiecrei bare, ct i suma, produsul i ctul celor 2 valori(utilizai un gestionar de poziie corespunztor, iar pe ct posibil facei n aa fel nct cele 2 bare de defilare sa fie una vertical i cealalt orizontal).

Mediul de desenare al unui applet - Canvas Fiecare applet are o zon numit canvas, n care afim ceea ce dorim. Parametrii de desenare ai unui applet sunt specificai prin intermediul fiierului html ca argumente pentru variabilele weidth i height ce apar n cadrul unui tag de tip <applet>. Orice este desenat n afara acestor limite nu va fi vizibil pe monitor. Coordonatele utilizate n desenare sunt exprimate n pixeli, puntul de coordonate 0,0 fiind colul ecranului din stnga sus. Incrementarea valorii lui z duce la deplasarea pe vertical n jos, iar incrementarea valorii lui x duce la deplasarea pe orizontal spre dreapta.

 Desenarea formelor Pentru utilizarea metodelor grafice disponibile n Java va trebui n primul rnd importate pachetele ce permit lucrul cu grafice . Acest lucru se realizeaz astfel: sau mai general: import java.awt.Graphics import java.awt.*

Cele mai utilizate metode de desenare sunt prezentate n tabelul urmtor: Metoda clearRect() copyArea() drawArc() drawLine() drawOval() drawPolygon() drawRect() drawRoundRect() drawString() fillArc() fillPolygon() fillRect() fillRoundRect() getColor() getFont() getFontMetrics() Descriere terge o zon dreptunghiular dintr-un desen canvas. Copiaz o zon dreptunghiular dintr-un desen ntr-o alt zon. Deseneaz un arc de cerc. Deseneaz o linie dreapt. Deseneaz o elips. Deseneaz un poligon. Deseneaz un dreptunghi. Deseneaz un dreptunghi cu colturi rotunjite. Afieaz un ir de tip text. Deseaneaz un arc cu interiorul colorat sau haurat. Deseaneaz un poligon cu interiorul colorat sau haurat. Deseaneaz un dreptunghi cu interiorul colorat sau haurat. Deseaneaz un dreptunghi cu interiorul colorat sau haurat i margini rotunjite. Extrage culoarea de desenare curent. Extrage fontul curent utilizat. Extrage informaiile despre fontul curent.

Prin urmare pentru a desena un anumit element grafic va fi apelat metoda respectiv, furnizndu-se totodat i argumentele corespunztoare. Astfel pentru a desena o linie ntre coordonatele 5,10 i 20,30 apelul metodei drawLine va fi urmtorul: g.drawLine(5, 10, 20, 30); Elementul g va fi declarat anterior ca fiind un obiect de tip Graphics, iar desenarea prin respectiva metod va avea loc n cadrul unei metode de tip paint() , argumentele metodei de desenare fiind coordonatele X, Y ale nceputului linie, respectiv sfritul acesteia.

Desenarea unui dreptunghi n cadrul acestui subpunct este exemplificat desenarea unui dreptunghi. Metoda este asemntoare celei de desenare a unei linii. n plus dac se dorete pe lng desenarea dreptunghiului, inserarea n interiorul su a unui alt dreptunghi cu marginile rotunjite, vor fi apelate dou metode: prima pentru dreptunghi -- g.drawRect(startX, startY, lungime, nlime), iar cea de-a doua metod g.fillRoundRect(startX, startY, lungime, nlime, lungRound, naltRound);

unde lungRound, naltRound sunt lungimea lung, respectiv nlimea - nalt dreptunghiului de-a lungul crei diagonale se va trasa arcul de cerc ce va fi amplasat la colurile dreptunghiului declarat anterior Aplicatie: Exemplu de desenare a unui dreptunghi in cadrul unui applet Java Dreptunghiuri:
import java.awt.*; import java.applet.*; public { class Dreptunghiuri extends Applet

public void paint(Graphics g) { //se lanseaz clasa de desenare g.drawRect(35, 15, 125, 200); //este desenat dreptunghiul gol g.fillRoundRect(50, 30, 95, 170, 15, 15); //este desenat dreptunghiul cu interior rotunjite } } colorat i margini

Se reamintete c toate appletele nu pot fi rulate dect avnd ca suport un fiier html. Un exemplu de fiier HTML suport este prezentat n continuare:
<title>Exemplu <h1>Pagina <applet de desenare Applet a unor dreptunghiuri</title> a dreptunghiurilor</h1> height=250> </applet>

suport

de

desenare

code="Dreptunghiuri.class"

width=200

Desenarea unor elipse Acest lucru se realizeaz relativ simplu, pruin apelul unui obiect al clasei Graphics. Forma acestei metode drawOval(), este urmtoarea:
instan_obiect_Graphics.drawOval(start X, start Y, lungime, nlime);

Desenarea unor arce de cerc Forma general a metodei de desenare a unui arc de cerc are urmtoarea structur:
g.drawArc(startX,startY, lungime, nlime, unghi_start, numr_grade);

unde starX, startY reprezint punctul de start al arcului, lungimea i nlimea reprezint dimensiunea dreptunghiului care va nscrie cercul sau elipsa descris de respectivul arc, unghi_start reprezint valoarea de start a capului inferior a arcului, numr_grade reprezint unghiul cu vrful la centru ce va fi descris de raza generatoare a cercului/elipsei . Modul de msurare a elementelor de tip unghi este indicat n figura urmtoare:

Un exemplu simplu este prezentat n continuare. Se presupune c se dorete desenarea unui arc de cerc, ce pornete din punctul de coordonate 10,10 , ncadrat de un dreptunghi cu dimensiunile de 300,100 , unghiul de start de 10 grade, iar numarul de grade 120. Pentru a nelege rolul dreptunghiului ce nscrie arcul a fost adugat n fiierul surs i desenarea unui dreptunghi avnd aceleai coordonate ca i elementul suport.

Aplicatia de desenare a unui arc de cerc in cadrul unui applet Java - varianta 1
import java.awt.*; import java.applet.*; public class Arc extends { public void paint(Graphics

Applet g)

{//se lanseaz clasa de desenare g.drawArc(10,10,300,100,10,120); //este desenat arcul cu argumentele specificate in cadrul explicatiilor g.drawRect(10,10,300,100); //este desenat dreptunghiul suport } }

Aplicatia de desenare a unui arc de cerc in cadrul unui applet Java - varianta 2 Urmtorul exemplu utilizeaz metoda parsInt() pentru a prelua argumente din cadrul unor cmpuri de tip text.Totodat sunt introduse o serie de cmpuri de tip text care ofer argumente pentru desenarea arcului de cerc. Explicarea elementelor noi se va realiza n applet-ul Arc1:
import java.awt.*; import java.applet.*; public class Arc1 extends Applet { //sunt declarate variabilele de clas TextField public unghiStart, init() pentru preluarea unor parametri numarGrade;

void

{//se indic folosirea unor cmpuri Text unghiStart = numarGrade = //la canvas new TextField(10); new TextField(10); sunt adugate cele 2

cmpuri

de

tip

text

add(unghiStart); add(numarGrade); //iar apoi sunt iniializate cu anumite valori unghiStart.setText("0"); numarGrade.setText("360"); }

public void paint(Graphics g) { //este lansat funcia de desenare String ungh = unghiStart.getText(); //valoarea din variabila ungh cadrul cmpului text este memorat n

int start = Integer.parseInt(ungh); //variabila ungh de tip String este convertit la ntreg grd = numarGrade.getText(); int grade=Integer.parseInt(grd); g.drawArc(35, 50, 125, 180, start, grade); //este lansat desenarea arcului cu punctul de start 35,50, dreptunghiul de ncadrare de 125,180, avnd ca unghi de start valoarea indicat de variabila start, iar ca numar de grade variabila grade } public boolean action(Event event, Object arg) { //la evenimentul apasare tasta ENTER este appletului repaint(); return true; } }

generat redesenarea

Obs. Experimentai modificarea argumentelor n clipa utilizrii altor evenimente spre exemplu GOT_FOCUS. Aplicatia de desenare a unui arc de cerc in cadrul unui applet Java - varianta 3 Urmtorul exemplu va aduga la exemplul anterior un obiect de tip Checkbox, la activarea cruia va fi lansat desenarea unui arc de cerc al crui interior este colorat. Se observ c evenimentul de tip validare csu este captat prin metoda getState().
import java.awt.*; import java.applet.*;

public class Arc1 extends Applet {//sunt declarate variabilele de clas TextField Checkbox public unghiStart, c = new numarGrade;

Checkbox();

void

init() folosirea new new sunt unor cmpuri Text pentru preluarea unor

{//se indic parametri unghiStart numarGrade = =

TextField(10); TextField(10); adugate cele 2 cmpuri de tip text si un

//la canvas checkbox

add(c); add(unghiStart); add(numarGrade); //iar apoi sunt iniializate cu anumite valori unghiStart.setText("0"); numarGrade.setText("360"); } public void paint(Graphics g) {//este lansat funcia de desenare String ungh = unghiStart.getText(); //valoarea din cadrul cmpului text ungh int start = Integer.parseInt(ungh); //variabila ungh de tip String este String grd =numarGrade.getText(); int grade =Integer.parseInt(grd); boolean s = c.getState();

este

memorat

variabila

convertit

la

ntreg

if (s==true) g.fillArc(35, 50, 125, 180, start, grade); else g.drawArc(35, 50, 125, 180, start, grade); //este lansat desenarea arcului cu punctul de start 35,50, dreptunghiul de ncadrare de 125,180, avnd ca unghi de start valoarea indicat de variabila start, iar ca numar de grade variabila grade } public boolean action(Event event, Object arg)

{//la orice eveniment este generat redesenarea appletului repaint(); return true; } }

10

Desenarea unor poligoane Poligoanele sunt figuri geometrice cu mai multe laturi. Spre exemplu triunghiul este cel mai simplu poligon. n Java se poate desena un poligon crend un ir de puncte ce reprezint coordonatele fiecrui capt al liniilor ce compun poligonul. Spre exemplu dac se dorete desenarea unui poligon cu 6 laturi se va crea un ir cu 7 elemente: int x[]={35, 150, 60, 140, 60, 150, 35}; //coordonatele x int y[]={50, 80, 110, 140, 170, 200, 230}; //coordonatele y int numPts = 7; Primul ir x[] memoreaz coordonatele X ale punctelor, n timp ce y[], memoreaz coordonatele Y. n aceste condiii desenarea unui poligon se poate realiza prin metoda de forma: g.drawPolygon(x, y, numPts); Ca o observaie, pentru a obine un contur nchis, ultimul punct va trebui s coincid cu primul, dac se utilizeaz metoda drawPolygon, iar n cazul utilizrii metodei fillPolygon, acest lucru nu mai este necesar deoarece culoarea ce va colora interiorul desenului va da impresia de poligon nchis. Aplicatie de desenare a unor poligoane a caror umplere este controlata prin activarea sau dezactivarea unui obiect de tip Chekbox
import java.awt.*; import java.applet.*; public class Poly extends Applet {//sunt declarate variabilele de clas int x[]={35, 150, 60, 140, 60, 150, 35}; //coordonatele x int y[] = {50, 80, 110, 140, 170, 200, 230}; //coordonatele y int numPts = 7; Checkbox c=new Checkbox(); public void init() { add(c); } public void paint(Graphics g) { boolean s=c.getState();

11

if (s==true) g.drawPolygon(x, y, numPts); else g.fillPolygon(x, y, numPts);

public boolean action(Event event, Object arg) { repaint(); return true; } }

Aplicatie de desenar a unor forme diverse n continuare va fi prezentat un program care reunete toate elementele grafice prezentate n cadrul aplicaiilor de desenare, utiliznd totodat i o serie de elemente de tip interfa grafic.
import java.awt.*; import java.applet.*; public class { int forma; Button buton; public { void FormeDiverse extends Applet

init()

forma = 0; buton = new Button("Figura urmatoare"); add(buton); }

public void paint(Graphics g) { int x[] = {35, 150, 60, 140, 60, 150, 35}; int y[] = {50, 80, 110, 140, 170, 200, 230};

12

int numPts = 7; switch(forma) { case 0:g.drawLine(35, 50, 160, 230); break; case 1:g.drawRect(35, 50, 125, 180); break; case case case case case } 2:g.drawRoundRect(35,50,125,180,15,15);break; 3:g.drawOval(35, 50, 125, 180); break; 4:g.drawArc(35, 50, 125, 180, 90, 180); break; 5:g.drawPolygon(x, y, numPts); break; 6:g.fillPolygon(x, y, numPts);break; } boolean action(Event event, Object arg)

public {

} }

++forma; if (forma == 7) forma = 0; repaint(); return true;

13

Probleme propuse
1. Pentru applet-ul Arc1 experimentai modificarea argumentelor n clipa utilizrii altor evenimente spre exemplu GOT_FOCUS. 2. Scriei codul necesar desenrii unui dreptunghi cu lungimea de 200 i nlimea de 100, avnd ca punct de start punctul de coordonate 50,75. 3. Scriei un applet care va desena un ptrat nscris ntr-un cerc. 4. Scriei un applet care va permite utilizatorului s introduc punctul de start, lungimea i nlimea unui dreptunghi a crei desenare va fi lansat la activarea unui buton de OK. Desenul realizat anterior apsrii butonului OK va fi ters. 5. Modificai appletul Arc astfel nct utilizatorul s poat introduce ca opiune nu numai punctul de start al arcului, dar i dimensiunea arcului. 6. Scriei un applet care va desena o fa umanioid, realiza din elipse i arce de cerc.

14