Introduktion til JavaFX-layout
Brugergrænsefladelayouts er centrum for interface-design. Mange af de grafiske brugergrænsefladsrammer tilbyder support til layout i form af API'er (Application Programming Interfaces). I JavaFX leveres også et stort antal layouts, der hjælper med at opfylde mange af begrænsningerne for at tackle det konsistente udseende og fornemmelse. Det er kun nødvendigt at indstille det minimale antal parametre i dette tilfælde. Layouts kan være af forskellige typer, og det forklares i de følgende afsnit i detaljer.
Top 5 JavaFX-layout
Som allerede omtalt kan layouter af JavaFX være af forskellige typer, såsom VBox, HBox, BorderPane, FlowPane, StackPane, AnchorPane, TilePane, GridPane osv. I dette afsnit diskuterer vi fem af dem.
1. VBox
VBox hjælper med at organisere noden i en lodret søjle. I dette kan indholdsområdets standardhøjde vise børnene i den foretrukne højde, og standardbredden er den største af børnenes bredde. Selvom placeringerne ikke kan indstilles for børnene, da det automatisk beregnes, kan det styres i en udstrækning ved tilpasning af VBox-egenskaber.
Kode:
// Java Program to create a VBox
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
// Title set
stage.setTitle("Example for VBox");
// VBox creation
VBox vb = new VBox(10);
// Label creation
Label lb = new Label("this is VBox example");
// Add the created label to vbox
vb.getChildren().add(lb);
// add the buttons to VBox
vb.getChildren().add(new Button("Click A"));
vb.getChildren().add(new Button("Click B"));
vb.getChildren().add(new Button("Click C"));
// Scene creation
Scene scene = new Scene(vb, 300, 300);
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)
Produktion:
Her er 3 knapper A, B og C arrangeret på vandret måde.
2. HBox
HBox fungerer i det modsatte koncept af VBox. Det vil sige, at noder organiseres vandret. Følgende er et program, der hjælper med at forstå HBox.
Kode:
// Java Program to create an HBox
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
// Title set
stage.setTitle("Example for HBox");
// HBox creation
HBox hb = new HBox(10);
// Label creation
Label lb = new Label("this is HBox example");
// Add the created label to Hbox
hb.getChildren().add(lb);
// add the buttons to Hbox
hb.getChildren().add(new Button("Click A"));
hb.getChildren().add(new Button("Click B"));
hb.getChildren().add(new Button("Click C"));// Scene creation
Scene scene = new Scene(hb, 300, 300);
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)
Produktion:
I dette tilfælde er 3 knapper A, B og C arrangeret på en vandret måde.
3. BorderPane
I dette har layoutstrukturen fem regioner som TOP, BOTTOM, CENTER, VENSTRE og HØJRE.
Kode:
// Java Program to create an BorderPane
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
BorderPane bp = new BorderPane();
bp.setTop(new TextField("A-Top"));
bp.setBottom(new TextField("B-Bottom"));
bp.setLeft(new TextField("C-Left"));
bp.setRight(new TextField("D-Right"));
bp.setCenter(new TextField("E-Center"));// Scene creation
Scene scene = new Scene(bp);// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)
Produktion:
Her videresendes 5 tekstfelter i rudenes fem retninger.
4. FlowPane
FlowPane tillader brugeren at placere noderne på hinanden følgende måde og pakke noderne ved grænsen. Her kan knudepunkterne være i lodret retning (kolonner) eller vandret retning (rækker).
Kode:
// Java Program to create a flowpane
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.FlowPane;
import javafx.scene.shape.Sphere;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
//create buttons
Button b1 = new Button("Button A");
Button b2 = new Button("Button B");
Button b3 = new Button("Button C");
Button b4 = new Button("Button D");
//Flow Pane creation
FlowPane fp = new FlowPane();
//Set horizontal gap
fp.setHgap(25);
//Set margin
fp.setMargin(b1, new Insets(20, 0, 20, 20));
ObservableList list = fp.getChildren();
//Add nodes to the flow pane
list.addAll(b1, b2, b3, b4);
// Scene creation
Scene scene = new Scene(fp);
// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)
Produktion:
5. StackPane
I dette layout er alle noder placeret i en enkelt stak. Det vil sige, noder er arrangeret ligesom i en stak oven på en anden.
Kode:
// Java Program to create a flowpane
import javafx.application.Application;
import javafx.scene.shape.Sphere;
import javafx.collections.ObservableList;
import javafx.scene.text.Font;
import javafx.geometry.Insets;
import javafx.scene.text.FontWeight;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.shape.Circle;
import javafx.scene.text.Text;
import javafx.stage.Stage;
import javafx.scene.paint.Color;
public class JFXLayouts extends Application (
@Override
public void start(Stage stage) (
//draw a sphere
Sphere sph = new Sphere(50);
//text creation
Text t = new Text("DEMO");
//Set font of the text
t.setFont(Font.font(null, FontWeight.BOLD, 13));
//Set color of the text
t.setFill(Color.RED);
//set position of the text
t.setX(20);
t.setY(50);
//Create a Stackpane
StackPane sp = new StackPane();
ObservableList list = sp.getChildren();
//Add nodes to the pane
list.addAll( sph, t);
// Scene creation
Scene scene = new Scene(sp);
// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)
Produktion:
Konklusion
JavaFX Layouts hjælper med at skabe interface design i et ensartet look and feel. Layouts kan være af forskellige typer, og de kan vælges på baggrund af brugerens krav. I dette dokument diskuteres fem af JavaFX-layouts i detaljer.
Anbefalede artikler
Dette er en guide til JavaFX-layout. Her diskuterer vi de top 5 layouts af JavaFX som VBox, HBox, BorderPane, FlowPane og StackPane sammen med eksempler og kodeimplementering. Du kan også se på de følgende artikler for at lære mere -
- Break Statement i Java
- JList i Java
- JPanel i Java
- Til loop i Java
- Komplet guide til JavaFX-etiket
- Break Statement i JavaScript
- HTML-layout
- Typer og hvordan man opretter JavaFx-diagrammer?
- Sådan indtastes tekst i JavaFX TextField?
- Konstruktører og metoder til JavaFx-knap
- Top 15 metoder til HBox i JavaFX
- Sådan oprettes checkbox i JavaFX med eksempler?
- JavaFX VBox | Metoder til JavaFX VBox
- Forskellige metoder til JavaFX StackPane