Panneau JavaFX à l’intérieur du redimensionnement automatique du panneau

J’ai une application JavaFX qui n’a qu’un seul fichier FXML. Dans ce fichier, j’ai un AnchorPane qui contient un StackPane. Voici la capture d’écran:

mon panneau à l'intérieur de l'application du panneau

Lorsque je lance cette application, je souhaite redimensionner StackPane automatiquement avec AnchorPane. Ainsi; StackPane récupère automatiquement la largeur et la hauteur disponibles. Au moment où je redimensionne l’application, AnchorPane est automatiquement redimensionné, mais StackPane rest sa taille fixe.

Comment puis-je redimensionner le StackPane automatiquement et le rendre complètement étiré dans son panneau parent?

Mon code

Main.java

package app; import javafx.application.Application; import javafx.fxml.FXMLLoader; import javafx.scene.Parent; import javafx.scene.Scene; import javafx.stage.Stage; public class Main extends Application { public static void main(Ssortingng[] args) { Application.launch(args); } @Override public void start(Stage stage) throws Exception { Parent root = FXMLLoader.load(getClass().getResource("Main.fxml")); Scene scene = new Scene(root,800,600); scene.getStylesheets().add(this.getClass().getResource("/app/style1.css").toExternalForm()); stage.setScene(scene); stage.show(); } } 

MainController.java

 package app; import java.net.URL; import java.util.ResourceBundle; import javafx.fxml.FXML; import javafx.fxml.Initializable; import javafx.scene.layout.AnchorPane; import javafx.scene.layout.StackPane; public class MainController implements Initializable { @FXML private AnchorPane anchorPane; @FXML private StackPane stackPane; @Override public void initialize(URL url, ResourceBundle rb) { stackPane.setPrefSize(anchorPane.getPrefWidth(), anchorPane.getPrefHeight()); //didn't work } } 

Main.fxml

          

style1.css

 #anchorPane { -fx-border-width: 2px; -fx-border-color: chartreuse; } #stackPane { -fx-border-width: 2px; -fx-border-color: red; /* didn't work */ -fx-hgap: 100%; -fx-vgap: 100%; } 

Après des heures de recherche et de test, il a finalement été obtenu juste après avoir posté la question!

Vous pouvez utiliser les commandes fxmlAnchorPane.topAnchor, AnchorPane.bottomAnchor, AnchorPane.leftAnchor, AnchorPane.rightAnchor ” avec la valeur “0.0” pour ajuster / étirer / aligner les éléments enfants dans un AnchorPane. Ainsi, ces commandes indiquent à l’élément enfant de suivre son parent lors du redimensionnement.

Mon code mis à jour Main.fxml

            

Hier est le résultat:

entrer la description de l'image ici

Pour la documentation de l’API: http://docs.oracle.com/javafx/2/api/javafx/scene/layout/AnchorPane.html

Je concevais une interface graphique dans SceneBuilder, essayant de faire en sorte que le conteneur principal s’adapte à la taille de la fenêtre. Il devrait toujours être 100% large.

C’est ici que vous pouvez définir ces valeurs dans SceneBuilder:

Contraintes AnchorPane dans SceneBuilder

Le fait de basculer les lignes pointillées / rouges ne fera qu’append / supprimer les atsortingbuts que Korki a postés dans sa solution (AnchorPane.topAnchor etc.).

Voir aussi ici

 @FXML private void mnuUserLevel_onClick(ActionEvent event) { FXMLLoader loader = new FXMLLoader(getClass().getResource("DBedit.fxml")); loader.setController(new DBeditEntityUserlevel()); try { Node n = (Node)loader.load(); AnchorPane.setTopAnchor(n, 0.0); AnchorPane.setRightAnchor(n, 0.0); AnchorPane.setLeftAnchor(n, 0.0); AnchorPane.setBottomAnchor(n, 0.0); mainContent.getChildren().setAll(n); } catch (IOException e){ System.out.println(e.getMessage()); } } 

Le scénario consiste à charger un fichier fxml enfant dans le parent AnchorPane. Utiliser la commande AnChorPane.setxxxAnchor pour que l’enfant s’étende à son parent.

C’est assez simple car vous utilisez le FXMLBuilder .

Suivez simplement ces étapes simples:

  1. Ouvrez le fichier FXML dans FXMLBuilder.
  2. Sélectionnez le volet stack.
  3. Ouvrez l’onglet Disposition [onglet de gauche de FXMLBuilder].
  4. Définissez la valeur des côtés par lesquels vous voulez calculer la taille du volet lors du redimensionnement de l’étape, comme TOP, LEFT, RIGHT, BOTTOM.

Si vous utilisez Scene Builder, vous verrez à droite un panneau d’accordéon qui a normalement trois options (“Propriétés”, “Mise en page” et “Code”). Dans la seconde (“Mise en page”), vous verrez une option appelée “[mise en page parent] Contraintes” (dans votre cas “AnchorPane Constrainsts”).

Vous devriez mettre “0” sur les quatre côtés de l’élément qui représente la mise en page parente.

Pas besoin de céder.

sélectionnez simplement le volet , cliquez avec le bouton droit , puis sélectionnez Adapter au parent .

Il redimensionne automatiquement le volet en fonction de la taille du volet.