wiki:graphics
Last modified 11 months ago Last modified on 2017-02-04 10:29:04

Graphics in english

Käytä sivun TIM-versiota

































fi.jyu.mit.graphics

Graphics on Ohjelmointi 1 kurssille tarkoitettu käytöltään yksinkertainen graafinen kirjasto.

1. Käyttöönotto

1.1 Kirjasto

  • kopioi itsellesi Graphics.jar. Tai ota ohj1.jar ja korvaa kaikissa ohjeissa nimi Graphics.jar nimellä ohj1.jar
  • Vinkki: Klikkaa linkkiä hiiren oikeanpuoleisella napilla (valikkonappi) ja valitse 'Tallenna nimellä...'.
  • Jos jostakin kaikille käsittämättömästä syystä käytät Internet Exploreria etkä mitään kunnon selainta, niin saattaa käydä niin, että IE muuttaa tallennuksessa tiedoston nimen .zip tyyppiseksi. Tällöin nimeä tiedosto uudelleen niin että saat sen alkuperäiselle nimelle.

1.2 Kääntäminen ja ajaminen komentoriviltä

  • Esimerkiksi alle olevan SimpleGraphics-mallin kääntämiseksi:
  • Tee itsellesi ensin tiedosto SimpleGraphics.java ja kopioi siihen mallin mukainen sisältö.
  • anna komentoriviltä komennot:
    javac -cp Graphics.jar SimpleGraphics.java
    java -cp .;Graphics.jar SimpleGraphics
    
    Muistathan, että Unix- ja Linux-käyttöjärjestelmissä polun osat erotellaan kaksoispisteellä, joten niissä ajo tapahtuu seuraavasti
    java -cp .:Graphics.jar SimpleGraphics
    

1.3 Helpompi käyttäminen jos tarvitsee tehdä useammin

  • Kannattaa ehkä lisätä Graphics.jar luokkien etsintäpolkuun Windowsissa komennolla (huomaa piste lopussa, se PITÄÄ olla)
    set CLASSPATH=.;Graphics.jar
    
  • Muista että tuo komento pitää antaa erikseen joka kerta kun konsoli-ikkunan käynnistää uudelleen.
  • Graphics.jar saa olla muuallakin, silloin vaan sanotaan myös se polku, josta löytyy, esim: set CLASSPATH=.;n:\kurssit\ohj1\graphics\Graphics.jar
  • Linuxeissa vastaava komento on:
    export CLASSPATH=.:Graphics.jar
    
  • Sitten itse kääntäminen ja ajaminen menevät komennoilla:
    javac  SimpleGraphics.java
    java  SimpleGraphics
    

1.4 Käyttö Eclipsessä

  • tarvittaessa luo uusi Java-projekti ja sinne uusi luokka
  • paina projetin nimen päällä hiiren oikeaa nappia ja ota Properties
  • Java Build Path/Libraries/Add External JARs...
  • lisää Graphics.jar
  • aja ohjelma
  • jos haluat JavaDocit eclipseen, paina lisäämäsi Graphics.jarin vieressä olevaa +-merkkiä ja laita JavaDoc-poluksi: http://users.jyu.fi/~vesal/kurssit/ohj1/graphicsdoc/
  • jos haluat debugata, niin hae myös lähdekoodit svn:stä ja lisää niiden hakemisto tuossa samalla

2. Käyttö esimerkkien avulla

2.1 Yksinkertaisin malli

  • source:/graphics/trunk/sample/SimpleGraphics.png source:/graphics/trunk/sample/SimpleGraphicsCoord.png
    import fi.jyu.mit.graphics.EasyWindow;
    
    public class SimpleGraphics {
    
        public static void main(String[] args) {
            EasyWindow window = new EasyWindow();
            window.addLine(0,0,100,100);
            window.addCircle(50,50, 20);
        }
    }
    

2.2 Enemmän ominaisuuksia

import fi.jyu.mit.graphics.*;

public class GraphicsTest {
    public static void main(String[] args) {
		
        EasySpace space = new EasySpace(); //Luodaan avaruus johon lisataan komponentit

	    double points[][] = {
	    	{ 0, -2 , 1}, 
	        { 2, -2 , 2},
	        { 2,  0 , 3},
	        { 0,  2 , 2},
	        {-2,  0 , 1}
            };

	    space.addPolygon(points).setColor(255, 0, 0); //3D-polygon

	    space.addCircle(0, 0, 2).setColor(0, 255, 0);

	    space.addLine(-2.7, 2.5, 1, 1).setColor(0, 0 , 255);

	    space.addCircle(0, -2.5, 0.2);

	    Window window = new Window();
	    window.scale(-3, -3, 3, 3);
	    space.addAxis(5, 5, 5); //x-, y- ja z-akselit joiden pituus on 5

	    window.setSpace(space); //Asetetaan window-ikkuna nayttamaan aiemmin luotua spacea

	    window.showWindow(); // vain EasyWindow näyttää itsensä automaattisesti

	    EasyWindow w2 = new EasyWindow(400, 400);
	    w2.scale(-5, -5, 5, 5);

	    w2.rotate(Axis.Y, 45); //Pyoritetaan y-akselin ympari
	    w2.rotate(Axis.Z, 45); //Pyoritetaan z-akselin ympari

	    w2.setSpace(space);
	    w2.showWindow();
	    w2.getPanel().setAllowRescale(false);

	    space.addCircle(0, 0, -3, 1).setColor(192, 52, 200);
	}
}

2.3 Erikoisominaisuuksia

Jos haluat ajaa esimerkkejä valikon kautta, anna komento

  java -jar Graphics.jar

Huom! Tämä toimii vain Graphics.jar:in kanssa. ohj1.jar:in kanssa pitää antaa

  java -cp ohj1.jar sample.demo

Jos haluat kokeilla alla olevia esimerkkejä (oletetaan että sinulla on CLASSPATH asetettuna ja siellä Graphics.jar tai ohj1.jar ), niin anna komento (toki haluamasi luokan nimi):

  java  sample.CarSample

Esimerkissä on kahdet ohjausikkunat, joista toisella voi hallita koko kuvan asentoa ja toisella ukon asentoa. Ruksimalla automaattiruudun, ja painamalla jonkin akselin näppäintä, saa kuvan tai ukon pyörimään jatkuvasti ko. akselin suhteen. "TouchPadistä" voi säätää asentoa nopeasti. Vasemmassa vain hiirtä liikuttamalla ja toisessa hiiri pohjassa.

Jos haluat kokeilla JA muokata alla olevia esimerkkejä, lataa koodi Lähdekoodi-linkista ja siellä Plain Text -linkistä hakemistoon sample (luo itsellesi tällainen hakemisto, jos sinulla ei vielä ole sellaista). Oletetaan että sinulla on CLASSPATH asetettuna. Oletetaan että olet muokannut tiedostoa sample/UkkoSample.java ja olet tallentanut sen nimelle sample/UkkoSample2.java. Silloin käännökset ja ajo esimerkiksi komennoilla jotka annetaan siis sample-hakemiston isä-hakemistossa:

  javac sample/UkkoSample2.java
  java  sample.UkkoSample2

2.4 Toiveita

  • Pylväsdiagrammit (lisätty, katso BarChart-luokka)
  • Piirakkakuviot
  • kaikki em. voinee yleistää sopivasta datajoukosta
  • Tekstit (ei 3D:tä ainakaan aluksi)

2.5 Omien kuvien käyttö taustakuvana

Jos haluat tuoda kuvan projektiisi, onnistuu se esimerkiksi viemällä kuvatiedosto esim projektin "/kuvat" -hakemistoon. Esim. "EsimerkkiGUI/kuvat/esimerkkikuva.png". Kuvan näyttämiseksi täytyy luoda uusi SpacePanel, johon kuva kiinnitetään Drawable-oliona. SpacePanelin voi puolestaan asettaa mihin tahansa muuhun Paneliin. Jotta kuva saadaan Drawable-olioksi, käytetään Bitmap-luokkaa. Eimerkiksi:

import fi.jyu.mit.graphics.Bitmap;
import fi.jyu.mit.graphics.SpacePanel;
...
JPanel panel = new JPanel();
SpacePanel spacePanel = new SpacePanel();
spacePanel.setAllowRescale(true);
panel.add(spacePanel, BorderLayout.CENTER);
Bitmap kuva = new Bitmap(100, 0, "kuvat/esimerkkikuva.png");
spacePanel.add(kuva);

Jos kuvan haluaa toimivan myös .jar -tiedostosta, pitää kuvat-hakemisto laittaa src-hakemiston alle (ja käyttää uudempaa kuin 8.3.2014 Graphics.jar-tiedostoa).

3. Bittikuvat

  • bittikuvia voi piirtää seuraavasti (korvaa junk.jpg jollakin kuvan nimellä joka sinulla on):
    import fi.jyu.mit.graphics.*;
    
    public class GraphicsBitmap {
    
        public static void main(String[] args) {
            Bitmap bm = new Bitmap(0,0,"junk.jpg"); // vaihda tähän kuvan nimi
            Window ikkuna = new EasyWindow(bm.getWidth(),bm.getHeight());
            ikkuna.add(bm);
        }
    }
    
  • kuvaa voi muokata vaikka seuraavasti:
        public static void convertGrayScale(Bitmap bm) {
            for (int y = 0; y < bm.getHeight(); y++) {
                for (int x = 0; x < bm.getWidth(); x++) {
                    int c = bm.getRGB(x, y);
                    int b = Bitmap.brightness(c);
                    int c2 = Bitmap.toRGB(b, b, b, 255);
                    bm.setRGB(x, y, c2);
                }
            }
        }