Introduction aux dispositions JavaFX
Les dispositions d'interface utilisateur sont au centre de la conception de l'interface. De nombreux cadres d'interface utilisateur graphique prennent en charge les dispositions sous la forme d'API (interfaces de programmation d'application). Dans JavaFX également, un grand nombre de mises en page sont fournies qui aident à remplir de nombreuses contraintes afin de répondre à l'aspect et à la convivialité. Seul le nombre minimum de paramètres doit être défini dans ce cas. Les mises en page peuvent être de différents types et cela est expliqué en détail dans les sections suivantes.
Top 5 des mises en page JavaFX
Comme déjà discuté, les dispositions de JavaFX peuvent être de différents types tels que VBox, HBox, BorderPane, FlowPane, StackPane, AnchorPane, TilePane, GridPane, etc. Dans cette section, nous en discuterons cinq.
1. VBox
VBox aide à organiser le nœud dans une colonne verticale. En cela, la hauteur par défaut de la zone de contenu peut afficher les enfants à sa hauteur préférée et la largeur par défaut est la plus grande de la largeur des enfants. Même si les emplacements ne peuvent pas être définis pour les enfants car il est calculé automatiquement, il peut être contrôlé dans une certaine mesure par la personnalisation des propriétés de la VBox.
Code:
// 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);
)
)
Production:
Ici, 3 boutons A, B et C sont disposés horizontalement.
2. HBox
HBox fonctionne dans le concept opposé de VBox. Autrement dit, les nœuds seront organisés horizontalement. Voici un programme qui aide à comprendre HBox.
Code:
// 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);
)
)
Production:
Dans ce cas, 3 boutons A, B et C sont disposés horizontalement.
3. BorderPane
En cela, la structure de mise en page a cinq régions telles que HAUT, BAS, CENTRE, GAUCHE et DROITE.
Code:
// 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);
)
)
Production:
Ici, 5 champs de texte sont renvoyés dans les cinq directions du volet.
4. FlowPane
FlowPane permet à l'utilisateur de disposer les nœuds de manière consécutive et enveloppe les nœuds à la limite. Ici, les nœuds peuvent être dans la direction verticale (colonnes) ou horizontale (lignes).
Code:
// 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);
)
)
Production:
5. StackPane
Dans cette disposition, tous les nœuds sont placés dans une seule pile. Autrement dit, les nœuds sont disposés comme dans une pile, au-dessus d'un autre.
Code:
// 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);
)
)
Production:
Conclusion
Les mises en page JavaFX aident à créer la conception de l'interface dans une apparence cohérente. Les mises en page peuvent être de différents types et peuvent être choisies en fonction des besoins de l'utilisateur. Dans ce document, cinq des dispositions JavaFX sont décrites en détail.
Articles recommandés
Ceci est un guide des mises en page JavaFX. Nous discutons ici des 5 principales dispositions de JavaFX telles que VBox, HBox, BorderPane, FlowPane et StackPane ainsi que des exemples et l'implémentation de code. Vous pouvez également consulter les articles suivants pour en savoir plus -
- Déclaration de rupture en Java
- JList en Java
- JPanel en Java
- Pour boucle en Java
- Guide complet de JavaFX Label
- Déclaration de rupture en JavaScript
- Disposition HTML
- Types et comment créer des graphiques JavaFx?
- Comment saisir du texte dans JavaFX TextField?
- Constructeurs et méthodes du bouton JavaFx
- Top 15 des méthodes de HBox dans JavaFX
- Comment créer une case à cocher dans JavaFX avec des exemples?
- JavaFX VBox | Méthodes de JavaFX VBox
- Différentes méthodes de JavaFX StackPane