JavaFX 中的披露窗格
Disclosure Pane in JavaFX
我目前正在 JavaFX 中寻找解决方案,以实现类似于 GWT 中 DisclosurePanel 的行为,请参阅 http://samples.gwtproject.org/samples/Showcase/Showcase.html#!CwDisclosurePanel。
我已经尝试使用 TitledPane 构建一些东西,但它看起来或工作不正常。
我正在使用 FXML:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.text.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<VBox minWidth="260.0" spacing="10.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<FlowPane>
<children>
<Label text="Packages">
<font>
<Font name="System Bold" size="14.0" />
</font>
</Label>
<TitledPane animated="true" expanded="false">
<content>
<VBox spacing="10.0">
<children>
<CheckBox mnemonicParsing="false" text="Filter 1" />
<CheckBox mnemonicParsing="false" text="Filter 2" />
<CheckBox mnemonicParsing="false" text="Filter 3" />
</children>
</VBox>
</content>
<graphic>
</graphic>
<FlowPane.margin>
<Insets left="20.0" />
</FlowPane.margin>
</TitledPane>
</children>
</FlowPane>
<TreeView fx:id="dataPackagesTree" prefWidth="250.0" VBox.vgrow="ALWAYS">
</TreeView>
</children>
<padding>
<Insets bottom="5.0" left="5.0" right="10.0" top="0.0" />
</padding>
</VBox>
相应的 Java 代码在此示例中只是一个入门。
package javafx.example;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage primaryStage) {
try {
VBox root = (VBox) FXMLLoader.load(getClass().getResource("Sample.fxml"));
Scene scene = new Scene(root, 300, 400);
primaryStage.setScene(scene);
primaryStage.show();
} catch (Exception e) {
e.printStackTrace();
}
}
public static void main(String[] args) {
launch(args);
}
}
我想要的是 TitledPane 覆盖 TreeView。这样TitledPane的内容就在TreeView的前面,不会把TreeView往下推。
我不能post原型图,声望还不够,抱歉。
每个想法都会受到赞赏。提前致谢。
此致。
只需将 VBox
替换为 StackPane
。 StackPane 在 back-to-front 堆栈中布置其 children,即所有 children 都有一个 z-order。 children 是 TreeView
和 FlowPane
,后者在前者之上。
TreeView
包裹在 AnchorPane
中,为 FlowPane 提供足够的 space 可见。
FXML
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.Font?>
<StackPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<AnchorPane prefHeight="204.0" prefWidth="400.0">
<children>
<TreeView fx:id="dataPackagesTree" prefHeight="200.0" prefWidth="200.0" AnchorPane.topAnchor="30.0" />
</children>
</AnchorPane>
<FlowPane rowValignment="TOP">
<children>
<Label alignment="TOP_LEFT" text="Packages">
<font>
<Font name="System Bold" size="14.0" />
</font>
</Label>
<TitledPane animated="true" expanded="false">
<content>
<VBox spacing="10.0">
<children>
<CheckBox mnemonicParsing="false" text="Filter 1" />
<CheckBox mnemonicParsing="false" text="Filter 2" />
<CheckBox mnemonicParsing="false" text="Filter 3" />
</children>
</VBox>
</content>
<graphic>
</graphic>
<FlowPane.margin>
<Insets left="20.0" />
</FlowPane.margin>
</TitledPane>
</children>
</FlowPane>
</children>
</StackPane>
主要变化Class
try {
// VBox root = (VBox) FXMLLoader.load(getClass().getResource("Sample.fxml"));
StackPane root = (StackPane) FXMLLoader.load(getClass().getResource("Sample.fxml"));
Scene scene = new Scene(root, 300, 400);
primaryStage.setScene(scene);
primaryStage.show();
} catch (Exception e) {
e.printStackTrace();
}
最终输出
我目前正在 JavaFX 中寻找解决方案,以实现类似于 GWT 中 DisclosurePanel 的行为,请参阅 http://samples.gwtproject.org/samples/Showcase/Showcase.html#!CwDisclosurePanel。
我已经尝试使用 TitledPane 构建一些东西,但它看起来或工作不正常。
我正在使用 FXML:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.text.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<VBox minWidth="260.0" spacing="10.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<FlowPane>
<children>
<Label text="Packages">
<font>
<Font name="System Bold" size="14.0" />
</font>
</Label>
<TitledPane animated="true" expanded="false">
<content>
<VBox spacing="10.0">
<children>
<CheckBox mnemonicParsing="false" text="Filter 1" />
<CheckBox mnemonicParsing="false" text="Filter 2" />
<CheckBox mnemonicParsing="false" text="Filter 3" />
</children>
</VBox>
</content>
<graphic>
</graphic>
<FlowPane.margin>
<Insets left="20.0" />
</FlowPane.margin>
</TitledPane>
</children>
</FlowPane>
<TreeView fx:id="dataPackagesTree" prefWidth="250.0" VBox.vgrow="ALWAYS">
</TreeView>
</children>
<padding>
<Insets bottom="5.0" left="5.0" right="10.0" top="0.0" />
</padding>
</VBox>
相应的 Java 代码在此示例中只是一个入门。
package javafx.example;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage primaryStage) {
try {
VBox root = (VBox) FXMLLoader.load(getClass().getResource("Sample.fxml"));
Scene scene = new Scene(root, 300, 400);
primaryStage.setScene(scene);
primaryStage.show();
} catch (Exception e) {
e.printStackTrace();
}
}
public static void main(String[] args) {
launch(args);
}
}
我想要的是 TitledPane 覆盖 TreeView。这样TitledPane的内容就在TreeView的前面,不会把TreeView往下推。
我不能post原型图,声望还不够,抱歉。
每个想法都会受到赞赏。提前致谢。
此致。
只需将 VBox
替换为 StackPane
。 StackPane 在 back-to-front 堆栈中布置其 children,即所有 children 都有一个 z-order。 children 是 TreeView
和 FlowPane
,后者在前者之上。
TreeView
包裹在 AnchorPane
中,为 FlowPane 提供足够的 space 可见。
FXML
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.Font?>
<StackPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<AnchorPane prefHeight="204.0" prefWidth="400.0">
<children>
<TreeView fx:id="dataPackagesTree" prefHeight="200.0" prefWidth="200.0" AnchorPane.topAnchor="30.0" />
</children>
</AnchorPane>
<FlowPane rowValignment="TOP">
<children>
<Label alignment="TOP_LEFT" text="Packages">
<font>
<Font name="System Bold" size="14.0" />
</font>
</Label>
<TitledPane animated="true" expanded="false">
<content>
<VBox spacing="10.0">
<children>
<CheckBox mnemonicParsing="false" text="Filter 1" />
<CheckBox mnemonicParsing="false" text="Filter 2" />
<CheckBox mnemonicParsing="false" text="Filter 3" />
</children>
</VBox>
</content>
<graphic>
</graphic>
<FlowPane.margin>
<Insets left="20.0" />
</FlowPane.margin>
</TitledPane>
</children>
</FlowPane>
</children>
</StackPane>
主要变化Class
try {
// VBox root = (VBox) FXMLLoader.load(getClass().getResource("Sample.fxml"));
StackPane root = (StackPane) FXMLLoader.load(getClass().getResource("Sample.fxml"));
Scene scene = new Scene(root, 300, 400);
primaryStage.setScene(scene);
primaryStage.show();
} catch (Exception e) {
e.printStackTrace();
}
最终输出