JavaFX: Rotated TitledPane не заполняет макет

Question

Я создаю настольное приложение и пытаюсь создать вертикальную TitledPane для представления «вертикальной складной панели инструментов».

Я сделал несколько исследований о том, как это сделать, и смог правильно создать свою вертикальную TitledPane, но я не могу понять, как установить размер TitledPane для заполнения макета.

Вот скриншот того, что я сделал, и то, что я хочу. My VerticalTitlePane - это FXML, включенный в корневой макет, который является BorderPane, и установлен для размещения в левом контейнере. Знаете ли вы, что можно указать TitledPane для заполнения макета (где TitledPane.height = BorderPane.left.height в псевдокоде)?

Вот FXML вертикальной TitledPane. BorderPane просто включает в себя и устанавливает его влево (в случае необходимости, пожалуйста, спрашивайте):

<Group xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="ch.aardex.widgets.toolbar_vertical.VerticalToolbarCtrl" fx:id="group"> 
<stylesheets> 
    <URL value="@/ch/aardex/widgets/toolbar_vertical/toolbar_vertical.css"/> 
</stylesheets> 
<children> 
    <Accordion rotate="90.0" fx:id="accordion"> 
     <panes> 
      <TitledPane onMouseClicked="#expandMenu" > 
       <content> 
        <HBox spacing="15.0"> 
         <children> 
          <Button fx:id="btShowHome" styleClass="vertical-bar-button" onAction="#showHome" rotate="270.0" > 
           <graphic> 
            <ImageView> 
             <Image url="/ch/aardex/widgets/images/logo_home_48.png"/> 
            </ImageView> 
           </graphic> 
          </Button> 

          <Button fx:id="btShowInitPatient" styleClass="vertical-bar-button" onAction="#showInitPatient" rotate="270.0" > 
           <graphic> 
            <ImageView> 
             <Image url="/ch/aardex/widgets/images/user_add_48.png"/> 
            </ImageView> 
           </graphic> 
          </Button> 

          <Button fx:id="btShowReadMems" styleClass="vertical-bar-button" onAction="#showReadMems" rotate="270.0"> 
           <graphic> 
            <ImageView> 
             <Image url="/ch/aardex/widgets/images/mems_read_48.png"/> 
            </ImageView> 
           </graphic> 
          </Button> 

          <Button fx:id="btShowPatientList" styleClass="vertical-bar-button" onAction="#showPatientList" rotate="270.0"> 
           <graphic> 
            <ImageView> 
             <Image url="/ch/aardex/widgets/images/user_group_48.png"/> 
            </ImageView> 
           </graphic> 
          </Button> 
         </children> 
        </HBox> 
       </content> 
      </TitledPane> 
     </panes> 
     </Accordion> 
</children> 

Большое спасибо!

Answer 1

Наконец-то я нашел способ реализовать то, что хотел. Поскольку я не нашел много ответов, я напишу, что это может помочь кому-то другому.

Лучшее, что я нашел для реализации, это использовать простой VBox с некоторыми анимациями.

Здесь FXML:

<?xml version="1.0" encoding="UTF-8"?> 
<?import java.lang.*?> 
<?import java.net.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.geometry.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.image.*?> 

<VBox minWidth="75.0" alignment="CENTER_RIGHT" styleClass="vertical-bar" fx:id="toolbarVertical" xmlns:fx="http://javafx.com/fxml/1" fx:controller="ch.aardex.root.ToolbarVerticalCtrl"> 
    <padding> 
     <Insets top="10" right="10" bottom="10" left="10"/> 
    </padding> 

    <Button fx:id="btExpandMenu" styleClass="vertical-bar-button" onAction="#expandMenu" > 
     <graphic> 
      <ImageView> 
       <Image url="..."/> 
      </ImageView> 
     </graphic> 
    </Button> 

    <VBox VBox.vgrow="ALWAYS"/> 

    <GridPane alignment="CENTER_RIGHT" > 
     <Label fx:id="homeLabel" text="Go to the dashboard view" GridPane.columnIndex="0" GridPane.rowIndex="0" managed="false" wrapText="true" /> 
     <Button fx:id="homeBt" styleClass="vertical-bar-button" onAction="#showHome" GridPane.columnIndex="1" GridPane.rowIndex="0" > 
      <graphic> 
       <ImageView> 
        <Image url="..."/> 
       </ImageView> 
      </graphic> 
     </Button> 

     <Label fx:id="addLabel" text="Read a patient or add a new one" GridPane.columnIndex="0" GridPane.rowIndex="1" managed="false" wrapText="true"/> 
     <Button fx:id="addBt" styleClass="vertical-bar-button" onAction="#showInitPatient" GridPane.columnIndex="1" GridPane.rowIndex="1" > 
      <graphic> 
       <ImageView> 
        <Image url="..."/> 
       </ImageView> 
      </graphic> 
     </Button> 

     <Label fx:id="listLabel" text="Show the list of patients" GridPane.columnIndex="0" GridPane.rowIndex="2" managed="false" wrapText="true"/> 
     <Button fx:id="listBt" styleClass="vertical-bar-button" onAction="#showPatientList" GridPane.columnIndex="1" GridPane.rowIndex="2"> 
      <graphic> 
       <ImageView> 
        <Image url="..."/> 
       </ImageView> 
      </graphic> 
     </Button> 

     <Label fx:id="confLabel" text="Settings of the app" GridPane.columnIndex="0" GridPane.rowIndex="3" managed="false" wrapText="true"/> 
     <Button fx:id="confBt" styleClass="vertical-bar-button" onAction="#showConfiguration" GridPane.columnIndex="1" GridPane.rowIndex="3"> 
      <graphic> 
       <ImageView> 
        <Image url="..."/> 
       </ImageView> 
      </graphic> 
     </Button> 
    </GridPane> 
</VBox> 

И контроллер:

import ch.aardex.common.IController; 
import java.net.URL; 
import java.util.ResourceBundle; 
import javafx.animation.Animation; 
import javafx.animation.Transition; 
import javafx.event.ActionEvent; 
import javafx.fxml.FXML; 
import javafx.fxml.Initializable; 
import javafx.scene.control.Button; 
import javafx.scene.control.Label; 
import javafx.scene.layout.VBox; 
import javafx.util.Duration; 

public class ToolbarVerticalCtrl extends IController implements Initializable { 

    // FXML controls 
    @FXML private VBox toolbarVertical; 

    @FXML private Label homeLabel; 
    @FXML private Button homeBt; 

    @FXML private Label addLabel; 
    @FXML private Button addBt; 

    @FXML private Label listLabel; 
    @FXML private Button listBt; 

    @FXML private Label confLabel; 
    @FXML private Button confBt; 

    // Constants 
    private final double EXPANSION = 90.0; // the expansion of the vertical toolbar 
    private final double MARGIN = 10.0; // the margin of the vertical toolbar 
             // margin is used to set the offset when sliding the toolbar 

    // Variables 
    private boolean hidden = true; // is the bar hidden ? 

    @Override 
    public void initialize(URL url, ResourceBundle rb) { 
    } 

    @FXML 
    private void showHome(ActionEvent event) { 
     getRoot().initViewWithTopOnly(DASHBOARD_VIEW); 
    } 

    @FXML 
    private void showInitPatient(ActionEvent event) { 
     getRoot().initViewWithTopAndVertical(WORKFLOW_VIEW); 
    } 

    @FXML 
    private void showPatientList(ActionEvent event) { 
     getRoot().initViewWithTopAndVertical(LIST_VIEW); 
    } 

    @FXML 
    private void showConfiguration(ActionEvent event) { 
     getRoot().initViewWithTopAndVertical(CONFIG_VIEW); 
    } 

    @FXML 
    private void expandMenu(ActionEvent event){ 
     final Animation hideSideBar = new Transition() { 
      { setCycleDuration(Duration.millis(250)); } 

      @Override 
      protected void interpolate(double frac) { 
       double current = EXPANSION - EXPANSION * frac; 
       toolbarVertical.setPrefWidth(EXPANSION + current); 
      } 
     }; 

     final Animation showSideBar = new Transition() { 
      { setCycleDuration(Duration.millis(250)); } 

      @Override 
      protected void interpolate(double frac) { 
       double current = MARGIN + EXPANSION * frac; 
       toolbarVertical.setPrefWidth(EXPANSION + current); 
      } 
     }; 

     showSideBar.onFinishedProperty().set((ActionEvent event1) -> { 
      setLabelsManagement(true); 
     }); 

     if(showSideBar.statusProperty().get() == Animation.Status.STOPPED && 
       hideSideBar.statusProperty().get() == Animation.Status.STOPPED){ 
      if(!hidden){ 
       hideSideBar.play(); 
       setLabelsManagement(false); 
       System.out.println(toolbarVertical.getWidth()); 
      } else { 
       showSideBar.play(); 
       System.out.println(toolbarVertical.getWidth()); 
      } 
     } 
    } 

    private void setLabelsManagement(boolean b){ 
     homeLabel.setManaged(b); 
     homeLabel.setVisible(b); 

     addLabel.setManaged(b); 
     addLabel.setVisible(b); 

     listLabel.setManaged(b); 
     listLabel.setVisible(b); 

     confLabel.setManaged(b); 
     confLabel.setVisible(b); 

     hidden = !b; 
    }  
} 

Важной частью является функция expandMenu, которая отвечает за сдвинув VBox и скрытие/управляющий или нет Labels (потому что в этом случае они могут быть выложены, даже если они скрыты, и, таким образом, добавить дополнительное пространство, если это не требуется).

Оригинальный источник может дать вам еще несколько советов, идея исходит от here.

Надеюсь, это может помочь кому-то, ура!