open java css javafx-2 fxml pane

open dialog javafx



Panel JavaFX dentro del redimensionamiento automático del panel (6)

Tengo una aplicación JavaFX que tiene solo un archivo FXML. En este archivo tengo un AnchorPane que tiene un StackPane dentro. Aquí está la captura de pantalla:

Cuando inicio esta aplicación, quiero cambiar el tamaño de StackPane automáticamente con el AnchorPane. Así; StackPane obtendrá el ancho y la altura actuales de forma automática. En el momento en que cambio el tamaño de la aplicación, AnchorPane se redimensiona automáticamente, pero StackPane se mantiene como su tamaño fijo.

¿Cómo puedo cambiar el tamaño del StackPane automáticamente y hacerlo completamente estirado dentro de su panel principal?

Mi código

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(String[] 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

<?xml version="1.0" encoding="UTF-8"?> <?import java.lang.*?> <?import java.util.*?> <?import javafx.scene.*?> <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <AnchorPane fx:id="anchorPane" xmlns:fx="http://javafx.com/fxml" fx:controller="app.MainController"> <StackPane fx:id="stackPane" ></StackPane> </AnchorPane>

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%; }


Después de horas de búsqueda y prueba finalmente lo consiguió justo después de publicar la pregunta.

Puede usar los comandos " AnchorPane.topAnchor, AnchorPane.bottomAnchor, AnchorPane.leftAnchor, AnchorPane.rightAnchor " fxml con el valor "0.0" para ajustar / estirar / alinear los elementos secundarios dentro de un AnchorPane. Por lo tanto, estos comandos le dicen al elemento hijo que siga a su padre mientras cambia el tamaño.

Mi código actualizado Main.fxml

<?xml version="1.0" encoding="UTF-8"?> <?import java.lang.*?> <?import java.util.*?> <?import javafx.scene.*?> <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <AnchorPane fx:id="anchorPane" xmlns:fx="http://javafx.com/fxml" fx:controller="app.MainController"> <!--<StackPane fx:id="stackPane" ></StackPane>--> <!-- replace with the following --> <StackPane fx:id="stackPane" AnchorPane.topAnchor="0.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" ></StackPane> </AnchorPane>

Hier es el resultado:

Para la documentación de API: http://docs.oracle.com/javafx/2/api/javafx/scene/layout/AnchorPane.html


Es bastante simple porque estás usando FXMLBuilder .

Solo sigue estos sencillos pasos:

  1. Abra el archivo FXML en FXMLBuilder.
  2. Seleccione el panel de pila.
  3. Abra la pestaña Diseño [ficha del lado izquierdo de FXMLBuilder].
  4. Establezca el valor de los lados por el que desea calcular el tamaño del panel durante el cambio de tamaño de la etapa, como TOP, LEFT, RIGHT, BOTTOM.

Estaba diseñando una GUI en SceneBuilder, tratando de adaptar el contenedor principal a cualquier tamaño de ventana. Siempre debe ser del 100% de ancho.

Aquí es donde puedes establecer estos valores en SceneBuilder:

Alternar las líneas punteadas / rojas simplemente agregará / eliminará los atributos que Korki publicó en su solución (AnchorPane.topAnchor, etc.).


No es necesario ceder

solo seleccione el panel , haga clic derecho y luego seleccione Ajustar a principal .

Cambiará el tamaño del panel para anclar el tamaño del panel.


Si está utilizando Scene Builder, verá a la derecha un panel de acordeón que normalmente tiene tres opciones ("Propiedades", "Diseño" y "Código"). En el segundo ("Diseño"), verá una opción llamada "Restricciones [de diseño principal]" (en su caso "Constrainsts de AnchorPane").

Debería poner "0" en los cuatro lados del elemento que representa el diseño principal.


Ver también here

@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()); } }

El escenario es cargar un archivo fxml en el AnchorPane padre. Para hacer que el niño se estire de acuerdo con su padre, use el comando AnChorPane.setxxxAnchor.