javafx - HiddenSidesPane fxml 示例

Question

有人可以告诉我如何在 FXML 中而不是在 Controller 中构造 HiddenSidesPane 吗？

我有基本的 Controller 代码，但我无法理解如何从中创建 fxml 结构。

我可以要这样的东西吗？下面的代码；

<HiddenSidesPane prefWidth="800.0" pinnedSide="TOP">
            <content>
                <HBox fillHeight="false" nodeOrientation="RIGHT_TO_LEFT"
                    prefHeight="27.0" prefWidth="800.0" AnchorPane.bottomAnchor="0.0"
                    AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0"
                    AnchorPane.topAnchor="3.0" StackPane.alignment="TOP_RIGHT">
                    <children>
                        <Label prefHeight="14.0" prefWidth="94.0" text="Value Date From">
                            <HBox.margin>
                                <Insets right="2.0" top="5.0" />
                            </HBox.margin>
                        </Label>
                    </children>
                    <StackPane.margin>
                        <Insets top="2.0" />
                    </StackPane.margin>
                </HBox>
            </content>
        </HiddenSidesPane>

Answer 1

这就是我如何使用 ControlsFX 的官方 FXSampler 制作一个快速示例:

假设

您已经设置了 FXML 项目并将 ControlsFX.jar 添加为构建路径的依赖项。

FXMLDocument.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.*?>
<?import javafx.geometry.*?>
<?import org.controlsfx.control.*?>


<StackPane xmlns:fx="http://javafx.com/fxml/1" prefHeight="200" prefWidth="320"  fx:controller="javafxapplication17.FXMLDocumentController">
  <children>
    <HiddenSidesPane fx:id="pane">
      <content>
        <Label alignment="CENTER"  style="-fx-background-color: white; -fx-border-color: black;" maxHeight="1000.0" maxWidth="1000.0"  text="Content Node" />
      </content>
      <top>
        <Label fx:id="pinLabel"  style="-fx-background-color: rgba(0,255,0,.25);"  text="(Click to pin / unpin)" alignment="CENTER" prefHeight="50.0" prefWidth="50.0"  onMouseClicked="#handleMouseClicked"  />
      </top>
    </HiddenSidesPane>
  </children>
</StackPane>

FXMLController.java

注入(inject)变量 Pane 和 pinLabel 来设置它们。

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.geometry.Side;
import javafx.scene.control.Label;
import javafx.scene.input.MouseEvent;
import org.controlsfx.control.HiddenSidesPane;

public class FXMLDocumentController implements Initializable {

  @FXML
  private HiddenSidesPane pane;

  @FXML
  private Label pinLabel;

  @FXML
  private void handleMouseClicked(MouseEvent event) {
    if (pane.getPinnedSide() != null) {
      pinLabel.setText("(unpinned)");
      pane.setPinnedSide(null);
    } else {
      pinLabel.setText("(pinned)");
      pane.setPinnedSide(Side.TOP);
    }
  }

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

}

JavaFXApplication17.java

对不起这个名字:-)

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class JavaFXApplication17 extends Application {

  @Override
  public void start(Stage stage) throws Exception {
    Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

    Scene scene = new Scene(root);

    stage.setScene(scene);
    stage.show();
  }

  /**
   * @param args the command line arguments
   */
  public static void main(String[] args) {
    launch(args);
  }
}

据您所知，这是 HiddenSidesPane 的 JavaDoc:http://controlsfx.bitbucket.org/org/controlsfx/control/HiddenSidesPane.html

如果您需要示例，请下载 Zip http://fxexperience.com/downloads/controlsfx-8.40.9.zip解压后，里面有一个controlsfx-samples-8.40.9.jar文件。双击它并显示来源。