©Internetix

Grafiikkaa Javalla

Seuraavaksi tutustumme käyttöliittymän erilaisten graafisten elementtien hallintaan sekä vuorovaikutteisen käyttöliittymän toteutukseen Java-kielen avulla.

Paneelit:

Javan graafiset toiminnot pyörivät erillisen (alueen) paneelin päällä. Eli paneeli on se selaimen päällä oleva piirtopinta, jossa Java-Appletit pyörivät. Tämä luokka löytyy oliohierarkiasta paikasta:

Java-ohjelmat hoitavat kaiken graafisen toimintansa paneelin päällä. Java-ohjelmat periytetään Applet-luokasta, joka on periytynyt luokasta Panel. Tämän takia paneeli avataan automaattisesti Java-ohjelmille HTML-koodissa määriteltyjen mittojen mukaan. Eli ohjelmoija voi koodissaan vain tulostella paneeliin eikä hänen tarvitse huolehtia itse paneelin luomisesta.

Grafiikan piirtäminen Javalla:

Aluksi tutustumme erilaisten grafiikkaelementtien piirtämiseen Javalla.

Grafiikan tulostaminen on ehkä yleisin Java-kielen käyttöalue varsinkin Internet-ympäristössä. Javasta löytyykin melko kattava joukko erilaisia valmiita grafiikkafunktioita grafiikan piirtämiseen.

Piirrtopinta-käsite

Piirtopinta on se pinta, johon graafisilla funktioilla voidaan piirtää. Piirtopintana Java-Appleteissa toimii joko paneeli tai ikkuna (vrt. Canvas).

Appletin piirtopinta määräytyy HTML-dokumentin <APPLET>-tagissa. Sitä voidaan myös muuttaa koodilla käyttäen Javan resize-funktiota.

Piirtäminen

Itse piirtäminen tapahtuu Graphics-luokan (olion) metodeilla (funktioilla).

Piirtäminen suoritetaan koordinaattien avulla yleensä siten, että piirrettävästä kappaleesta ilmoitetaan vasemman yläreunan ja oikean alareunan koordinaatit. Itse piirtopinnan origo on vasemmassa yläkulmassa (0,0).

Kuten aiemmin jo tuli esille, mikäli piirtotoiminto sijoitetaan Applet-olion Paint-metodiin, niin piirtopinnan päivittäminen hoidetaan automaattisesti. Paint-metodi saa Graphics-olion parametrinään automaattisesti, joten sitä ei tarvitse erikseen määritellä.

Mikäli piirtämistä harjoitetaan jossain sellaisessa metodissa, jossa Graphics-olio ei ole automaattisesti käytettävissä, voidaan Garphics-olio hakea käyttöön getGraphics-funktiolla.

Seuraava esimerkki havainnollistaa näiden kahden tavan käyttöä:

Esim22

Värit

Graphics-oliosta löytyy metodi setColor, jonka avulla asetetaan käytettävä piirtoväri. Väri annetaan metodille parametrinä Color-tyyppisenä oliona.

Väriasetus on voimassa kunnes se kumotaan toisella väriasetuksella.

Taustan väri määritellään Component-olion setBackground-metodilla, joka on suoraan käytettävissä, koska koko Applet-luokka on periytetty Component-luokasta.

Valitun piirtovärin saa kysytyksi Graphics-olion getColor-metodilla sekä taustavärin puolestaan getBackground-metodilla.

Color-oliossa on valmiiksi määriteltynä seuraavat värit:

Ohjelmoija voi myös määritellä oman värin RGB-yhdistelmän avulla. Tällöin hänen täytyy kuitenkin ensin luoda Color-oliolle ilmentymä seuraavan esimerkin mukaisesti:

Esim23

Graphics-olion piirtometodit:

Viiva:

Viivat piirretään Graphics-olion drawLine-metodilla. Metodille annetaan parametreinä viivan alku- ja loppupisteiden koordinaatit.

Suorakulmio:

Suorakulmiot piirretään Graphics-olion drawRect-metodilla. Metodille annetaan parametreinä suorakulmion vasemman yläkulman koordinaatit, sekä leveys ja korkeus.

Pyöreäreunainen suorakulmio:

Pyöreäreunainen suorakulmio piirretään Graphics-olion drawRoundRect-metodilla. Parametreinä metodille annetaan suorakulmion vasemman yläkulman koordinaatit, leveys ja korkeus sekä kaaren leveys ja korkeus.

3D-suorakulmio:

3D-suorakulmio piirretään Graphics-olion draw3DRect-metodilla. Parametreinä metodille annetaan suorakulmion vasemman yläreunan koordinaatit, leveys ja korkeus, sekä tieto kohotetaanko suorakulmio vai upotetaanko se (true/false).

Kaari:

Kaari voidaan piirtää Graphics-olion drawArc-metodilla. Kaari piirretään ns. "näennäisen suorakulmion" sisälle. Parametreinä metodille annetaan näennäisen suorakulmion vasemman yläkulman koordinaatit, leveys ja korkeus, kaaren aloituskohta ja kaaren kulma.

Ympyrä:

Ympyrä piirretään Graphics-olion metodilla drawOval. Parametreinä metodille annetaan näennäisen suorakulmion vasemman yläkulman koordinaatit, leveys ja korkeus.

Ellipsi:

Ellipsi piirretään Graphics-olion metodilla drawOval kuten ympyräkin, mutta näennäisen nelikulmion korkeuden ja leveyden tulee olla erisuuret.

Monikulmio:

Monikulmio piirretään Graphics-olion metodilla drawPolygon. Parametrinä metodille annetaan useita xy-koordinaattipareja (kts. esimerkki).

Seuraava esimerkki havainnollistaa Graphics-olion piirtometodien käyttöä:

Esim24

Täytetyt piirtokuviot:

Graphics-olio tarjoaa lisäksi joukon metodeita erilaisten täytettyjen alueiden piirtämiseen

Täytetty suorakulmio:

Täytetty suorakulmio voidaan piirtää Graphics-olion fillRect-metodilla. Parametrinä metodille annetaan suorakulmion vasemman yläkulman koordinaatit sekä leveys ja korkeus.

Täytetty pyöreäkulmainen suorakulmio:

Tällainen kuvio voidaan piirtää Graphics-olion fillRoundRect-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Täytetty 3D-suorakulmio:

Täytetyn 3D-suorakulmion saa Graphics-olion fill3DRect-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Täytetty kaari:

Täytetty kaari voidaan tehdä strong>Graphics-olion FillArc-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Täytetty ympyrä:

Täytetyn ympyrän voi tehdä Graphics-olion FillOval-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Täytetty ellipsi:

Täytetyn ellipsin saa myöskin aikaiseksi Graphics-olion FillOval-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Täytetty monikulmio:

Täytetyn monikulmion saa aikaiseksi Graphics-olion FillPolygon-metodilla. Parametreinä metodille annetaan samat tiedot kuin vastaavassa täyttämättömässä kuviossa.

Seuraava esimerkki havainnollistaa erilaisten täytettyjen kuvioiden piirtämistä.

Esim25

Alueen putsaus:

Alueen puhdistus tarkoittaa alueen täyttämistä taustavärillä. Puhdistus suoritetaan Graphics-olion clearRect-metodilla.

Puhdistettavasta alueesta annetaan parametreinä alueen vasemman yläkulman koordinaatit sekä puhdistettavan alueen leveys ja korkeus.

Alueen kopiointi:

Alueita voidaan kopioida paikasta toiseen Graphics-olion metodilla copyArea. Metodille annetaan parametreinä kopioitavan alueen vasemman yläkulman koordinaatit, leveys ja korkeus, sekä kohteen vasemman yläkulman koordinaatit.

Metodi toimii vain piirtopinnalla (huom. ei muistin ja piirtopinnan välillä). Nämä metodit ovat varsin käteviä animaatioiden teossa. Tästä aiheesta kerrotaan enemmän myöhemmin tällä kurssilla.

Seuraava esimerkki havainnollistaa alueen puhdistamista ja kopiointia:

Esim26

Tekstin tulostaminen:

Normaali teksti tulostetaan Graphics-olion drawString-metodilla. Parametreinä metodille annetaan tulostettava merkkijono sekä tulostuspaikan vasemman yläreunan koordinaatit.

Tulostettaessa merkkejä yksitellen käytetään Graphics-olion drawChars-metodia. Parametreinä metodille annetaan merkkitaulukko, aloitusindeksi, pituus ja tulostusalueen koordinaatit.

Fontit:

Mikäli halutaan vaikuttaa tulostusfonttiin, luodaan Font-oliolle ilmentymä ja otetaan fontti käyttöön Graphics-olion setFont-metodilla. (kts. esimerkki)

Seuraavat esimerkit havainnollistavat tekstien tulostamista:

Esim27

Harjoituksia: