¿Cómo vincular el cambio de tamaño de escenario con el cambio de tamaño de los componentes?

Question

Tengo una aplicación JavaFX 2.0 con FXML. Quiero que los componentes (campos de texto, cuadros combinados, diseños, etc.) cambien de tamaño cuando se cambia el tamaño de una ventana con una aplicación. Así ...

• Como está escrito en Oracle documentation for JavaFX, para hacer algo como esto con las formas, hay algunas propiedades especiales a las formas:

Al crear aplicaciones GUI con JavaFX, Notará que ciertas clases en la API ya implementan propiedades. Por ejemplo, la clase javafx.scene.shape.Rectangle contiene propiedades para arcHeight, arcWidth, height, width, x y y. Para cada una de estas propiedades, habrá métodos correspondientes que coincidan con las convenciones descritas anteriormente. . Por ejemplo, getArcHeight(), setArcHeight(double), arcHeightProperty(), que en conjunto indican (a los desarrolladores y herramientas) que existe la propiedad dada *

• Para añadir oyente a una etapa que tengo que hacer algo como:

  stage.resizableProperty().addListener(new ChangeListener<Boolean>(){ 
      @Override 
      public void changed(ObservableValue<? extends Boolean> arg0, Boolean arg1, Boolean arg2){ 
       throw new UnsupportedOperationException("Not supported yet."); 
      } 
  
  }); 
  

Así que hay dos preguntas:

• Para hacer algunos enlaces tengo que obtener mi etapa en la clase de controlador. Entonces, ¿cómo puedo obtener un escenario en una clase de controlador?
• Parece que los controles de la interfaz de usuario no tienen ninguna propiedad de ancho/alto, para estar ligados a algo. O tal vez no los he encontrado.

Así que, ¿cómo puedo resolver mi problema?

UPD. Sobre la escena Builder para Sergey Grinev: Cuando uso Ctrl + K en mi componente (es decir a ocupar toda el área de su componente principal) - todo está bien.

Pero, ¿y si quiero decirle a mi componente que ocupe 50% de un área? Por ejemplo, tengo una pestaña con dos VBoxes en ella. El ancho de la pestaña es 100px. Los anchos de Vbox son 50px para cada uno. Vbox1 tiene x1 = 0, y x2 = 50, y VBox2 tiene x1 = 50, y x2 = 100. Luego cambio el tamaño de mi ventana con la aplicación JavaFX. Ahora tengo el ancho de la pestaña = 200px. Pero mis vboxes anchos son todavía = 50px: vbox1 tiene x1 = 0, y x2 = 50, y VBox2 tiene x1 = 150, y x2 = 200. Y necesito que sean vbox1 x1 = 0 y x2 = 100 y VBox2 x1 = 100 y x2 = 200. Donde los valores x1 y x2 son las coordenadas de las esquinas de VBoxes.

¿Cómo me puede ayudar Scene Builder en esta situación?

Answer 1

Otra opción fácil es utilizar JavaFX Escena Builder (recientemente se ha convertido disponible como beta pública: http://www.oracle.com/technetwork/java/javafx/tools/index.html)

Permite crear la interfaz de usuario por elementos de arrastrar y soltar y la interfaz de usuario de anclaje a las fronteras (por anchor tool), por lo se mueven/cambian de tamaño con los bordes de la ventana.

ACTUALIZACIÓN:

Para lograr la disposición porcentaje de cambio de tamaño automático se puede utilizar con GridPaneColumnConstraint:

public void start(Stage stage) { 

    VBox box1 = new VBox(1); 
    VBox box2 = new VBox(1); 

    //random content 
    RectangleBuilder builder = RectangleBuilder.create().width(20).height(20); 
    box1.getChildren().addAll(builder.build(), builder.build(), builder.build()); 
    builder.fill(Color.RED); 
    box2.getChildren().addAll(builder.build(), builder.build(), builder.build()); 

    //half by half screen 
    GridPane grid = new GridPane(); 
    grid.addRow(0, box1, box2); 

    ColumnConstraints halfConstraint = ColumnConstraintsBuilder.create().percentWidth(50).build(); 
    grid.getColumnConstraints().addAll(halfConstraint, halfConstraint); 

    stage.setScene(new Scene(grid, 300, 250)); 
    stage.show(); 
} 

Answer 2

Sugerencias:

1. Si usted tiene sólo un escenario principal y luego almacenarla en un campo/variable estática mientras que la aplicación se inicia y acceder a ella en todas las clases de controlador.
2. Puede poner todos los controles/componentes en un diseño/panel que administre el diseño de sus hijos automáticamente. Para diferentes diseños, consulte el documento de API. Después de eso, vincula las propiedades de ancho y alto de la escena de la escena a las propiedades de este diseño en consecuencia. Más sobre apariencia vinculante en Using JavaFX Properties and Binding.
   Ejemplo de unidirectional binding

Answer 3

Algunas sugerencias para la construcción de interfaces gráficas de usuario de tamaño variable =>

• Asegúrese de que la raíz de su aplicación es una subclase panel, en lugar de un grupo.
• sin amarre el tamaño máximo de los botones (por ejemplo button.setMaxSize (Double.MAX_VALUE, Double.MAX_VALUE).
• mayoría de las veces los paneles de diseño puede manejar el cambio de tamaño para usted y usted no necesita fijaciones y oyentes = > es decir, sólo se unen cuando realmente se necesita.
• controles de interfaz de usuario y paneles de diseño son Regiones = de sólo lectura> todas las regiones han propiedades de altura y anchura se puede escuchar y se unen a.
• no se puede vincular directamente la altura y ancho propiedades de un control a otro valor. En su lugar, use las propiedades minWidth/Height, prefWidth/Height, maxWidth/Height.
• La escena tiene propiedades de alto y ancho es a lo que puede unirse si es necesario. Si hace esto, cuando se cambie el tamaño de la etapa, la escena cambiará de tamaño, luego se redimensionará el contenido de los componentes. Si la raíz de la escena es un panel de diseño en lugar de un grupo, este enlace generalmente no es necesario.
• Si no establece un alto y un ancho en la escena, para una aplicación independiente, la escena (y el escenario) se ajustará para ajustarse al tamaño preferido del nodo raíz de la escena (que generalmente es lo que desea)
• Si todo lo demás falla, puede comenzar a anular el método de elementos primarios de Parent.

Aquí está an example de una interfaz de usuario JavaFX redimensionable que implementa algunos de los principios anteriores.