Piirrä viivoja JavaFX:ssä – Näin luot muotoja vaivattomasti

Muotojen piirtäminen on keskeinen osa GUI-kehitystä. JavaFX:llä voit helposti luoda erilaisia muotoja, jotka lisäävät sovelluksesi visuaalista vetovoimaa. Tässä oppaassa keskitymme yksinkertaisimpaan muotoon: viivaan. Opit, kuinka viiva piirretään, muokataan ja tyylitellään JavaFX-scenessä.

Tärkeimmät havainnot

• Line-luokan käyttö viivan luomiseen JavaFX:ssä.
• Viivan värin ja leveyden muokkaaminen.
• Johdatus katkoviivoihin ja eri viivatyyleihin.

Vaihe vaiheelta -ohje

Luodaksesi viivan JavaFX:ssä, seuraa näitä vaiheita:

Vaihe 1: Perus HBoxin luominen

Visuaalisen esityksen varten sinun on ensin luotava HBox. Se toimii säiliönä kaikille graafisille komponenteille.

Ensinnäkin luodaan boksi. Voit luoda uuden HBoxin käyttämällä seuraavaa koodia:

HBox box = new HBox();

Vaihe 2: Scenen luominen

On nyt aika luoda scena, johon HBoxisi lisätään. Scenen koko ja siten piirtoalue voidaan asettaa 400x400 pikseliin.

Tässä on koodi scenerin luomiseksi:

Scene scene = new Scene(box, 400, 400);

Vaihe 3: Viivan lisääminen

Piirtäessäsi viivaa käytä Line-luokkaa. Tämä mahdollistaa viivan alku- ja loppupisteiden määrittämisen suoraan konstruktorissa.

Esimerkiksi luot viivan, joka kulkee pisteestä (0,0) pisteeseen (200,200):

Line line = new Line(0, 0, 200, 200);

Vaihe 4: Viivan lisääminen lupauteen

Tehdäksesi viivasta näkyvän, sinun on lisättävä se HBoxiin. Käytä tähän getChildren().addAll()-metodia.

Alla oleva koodi vastaa tähän:

box.getChildren().addAll(line);

Vaihe 5: Nollapisteen ymmärtäminen

Tärkeä ominaisuus JavaFX:ssä on, että nollapiste sijaitsee piirtoalueen vasemmassa ylhäällä kulmassa. Positiiviset arvot liikkuvat alas y-akselilla ja oikealle x-akselilla.

Vaihe 6: Viivan värin muuttaminen

Muokataksesi viivan näkyvyyttä, voit muuttaa sen väriä setStroke()-komennolla.

Käytä tätä koodia muuttaaksesi värin punaiseksi:

line.setStroke(Color.RED);

Vaihe 7: Viivan paksuuden säätäminen

Viivan leveyttä voit myös säätää. Käytä siihen setStrokeWidth()-metodia.

Käytä tätä koodia suurentaaksesi leveyden 25 pikseliin:

line.setStrokeWidth(25);

Vaihe 8: Katkoviivojen luominen

Luodaksesi katkoviivan, tarvitset DashArrayn. Tämä metodi antaa sinulle mahdollisuuden asettaa viivalle kuvioita.

Tässä on esimerkki katkoviivan luomiseksi:

line.getStrokeDashArray().addAll(10.0, 20.0);

Vaihe 9: Viivatyylin määrittäminen

Viivan pää voi olla joko pyöreä tai kulmikas. Aseta tyyli pyöreäksi käyttämällä setStrokeLineCap()-komentoa.

Tässä on vastaava koodi:

line.setStrokeLineCap(StrokeLineCap.ROUND);

Vaihe 10: Interaktiivinen harjoitus

Kun tunnet nyt JavaFX:ssä viivojen piirtämisen periaatteet, voit kokeilla pientä harjoitusta. Yritä piirtää yksinkertainen talo käyttämällä viivoja perustuksille ja katolle.

Pysäytä video ja yritä luonnostella taloa!

Yhteenveto

Tässä oppaassa olet oppinut, kuinka luodaan, muokataan ja tyylitellään viivaa JavaFX:ssä. Olet saanut perustiedot graafisesta käyttöliittymästä, jotta voit jatkaa muiden muotojen parissa tulevissa videoissa.