Rita linjer i JavaFX – Så skapar du former enkelt

Ritning av former är en grundläggande del av GUI-utveckling. Med JavaFX kan du enkelt skapa olika former som ger din applikation mer visuellt intresse. I denna handledning fokuserar vi på den enklaste formen: linjen. Du kommer att lära dig hur man ritar, anpassar och styliserar en linje i en JavaFX-scen.

Viktigaste insikter

• Använd Line-klassen för att skapa en linje i JavaFX.
• Anpassa linjens färg och bredd.
• Introduktion till streckade linjer och olika linjestilar.

Steg-för-steg-guide

För att skapa en linje i JavaFX, följ dessa steg:

Steg 1: Skapa en grundläggande HBox

För att representera din linje måste du först skapa en HBox. Den fungerar som en behållare för alla grafiska komponenter.

Först instansieras boxen. Du kan skapa en ny HBox genom att använda följande kod:

HBox box = new HBox();

Steg 2: Skapa en scen

Nu är det dags att skapa en scen där din HBox kommer bli infogad. Du kan sätta storleken på scenen och därmed målarytan till 400x400 pixlar.

Här är koden för att skapa scenen:

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

Steg 3: Infoga en linje

För att nu rita en linje använder du Line-klassen. Den låter dig specificera start- och slutpunkterna för linjen direkt i konstruktorn.

Till exempel skapar du en linje som går från punkten (0,0) till punkten (200,200):

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

Steg 4: Lägg till linjen i scenen

För att göra linjen synlig måste du lägga till den i HBoxen. För detta använder du metoden getChildren().addAll().

Här är den aktuella koden:

box.getChildren().addAll(line);

Steg 5: Förstå nollpunkten

En viktig egenskap av JavaFX är att nollpunkten ligger i det övre vänstra hörnet av målarytan. Här löper positiva värden nedåt för y-axeln och åt höger för x-axeln.

Steg 6: Färga linjen

För att göra linjen mer synlig kan du ändra färgen med kommandot setStroke().

Använd denna kod för att göra färgen röd:

line.setStroke(Color.RED);

Steg 7: Justera linjetjockleken

Bredden på linjen kan också justeras. För detta använder du metoden setStrokeWidth().

Använd denna kod för att öka bredden till 25 pixlar:

line.setStrokeWidth(25);

Steg 8: Skapa streckade linjer

För att skapa en streckad linje behöver du DashArray. Denna metod låter dig definiera mönster för linjen.

Här är ett exempel för att skapa en streckad linje:

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

Steg 9: Definiera linjestilen

Capen på linjen kan antingen vara rund eller fyrkantig. För att ställa in stilen på rund, använd kommandot setStrokeLineCap().

Här är den aktuella koden:

line.setStrokeLineCap(StrokeLineCap.ROUND);

Steg 10: Interaktiv övning

Nu när du känner till principerna för att rita linjer i JavaFX kan du utmana dig själv med en liten övning. Försök att rita ett enkelt hus genom att använda linjer för fundamentet och taket.

Pausa videon och försök skissa ett hus!

Sammanfattning

I denna handledning har du lärt dig hur man skapar, anpassar och styliserar en linje i JavaFX. Du har fått en grundläggande förståelse för det grafiska användargränssnittet för att fortsätta med andra former i kommande videor.