JavaFX:VBox 中的标签重叠

Question

我正在创建一个视频分析系统。目前，我正在使用 JavaFX 处理播放器本身。在我的播放器旁边，我想要一个在分析过程中放置​​的标记列表(见图)。

我想要什么:

但它又重叠了...

直到它变成这样:

列表是在 ScrollPane 内的 VBox 内创建的。我已经考虑过使用 Text 对象而不是 Label 对象，但我真的想使用标签，因为我需要使用它们的背景属性。

这段代码重现了我的问题:

package application;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Cursor;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.Separator;
import javafx.scene.control.ScrollPane.ScrollBarPolicy;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class Test extends Application {

    final Button button = new Button("Click me!");
    final VBox vb = new VBox();
    final ScrollPane sp = new ScrollPane(vb);

    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) {
        AnchorPane root = new AnchorPane();
        VBox v = new VBox();
        v.getChildren().addAll(button, sp);
        root.getChildren().add(v);

        sp.setFitToHeight(true);
        sp.setFitToWidth(true);
        sp.setMaxHeight(150);
        sp.setHbarPolicy(ScrollBarPolicy.NEVER);
        sp.setVbarPolicy(ScrollBarPolicy.ALWAYS);

        button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                addButton();
            }
        });

        primaryStage.setScene(new Scene(root, 300, 250));
        primaryStage.show();
    }

    public void addButton() {
        Button btn = new Button();
        btn.setStyle("-fx-background-color: null");
        btn.setPadding(Insets.EMPTY);
        String text = "Time: 00:00\nIt's very late!";
        btn.setText(text);
        btn.setOnMousePressed(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent event) {
                btn.setStyle("-fx-background-color: #87CEFA");
            }
        });
        btn.setOnMouseReleased(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent event) {
                btn.setStyle("-fx-background-color: null");
            }
        });
        btn.setCursor(Cursor.HAND);
        Separator sep = new Separator();
        vb.getChildren().addAll(btn, sep);
    }
}

Answer 1

您的问题是您将 ScrollPane 内容的高度调整为 ScrollPane 视口(viewport)的高度。不要这样做。删除以下行:

sp.setFitToHeight(true);