Question

上面的图片是我的代码的结果。但我想要如下。

我该如何解决？以下是我的代码。我读了太多来源，但它们太复杂了。例如，a source that I read，我认为这种方式非常复杂。也许有一种简单的方法可以解决这个问题。

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class Test extends Application {

    public BorderPane border = new BorderPane();

    public Label name = new Label("Name");
    public Label surname = new Label("Surname");

    public TextField name1 = new TextField();
    public TextField surname1 = new TextField();

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

    }

    @Override
    public void start(Stage arg0) throws Exception {
        Scene scene = new Scene(new VBox(), 300, 200);
        arg0.setTitle("Header");
        arg0.setResizable(false);
        scene.setFill(Color.OLDLACE);

        StackPane grid = addStackPane();
        border.setMargin(grid, new Insets(12,12,12,12));
        border.setCenter(grid);

        ((VBox) scene.getRoot()).getChildren().add(border);
        arg0.setScene(scene);
        arg0.show();

    }

    @SuppressWarnings("static-access")
    public StackPane addStackPane() {
        StackPane pane = new StackPane();
        GridPane grid = new GridPane();
        Label title = new Label("Border Title");
        title.setStyle("-fx-translate-y: -7");
        pane.setAlignment(title, Pos.TOP_LEFT);
        grid.setStyle("-fx-content-display: top");
        grid.setStyle("-fx-border-insets: 20 15 15 15");
        grid.setStyle("-fx-background-color: white");
        grid.setStyle("-fx-border-color: black");
        grid.setHgap(10);
        grid.setVgap(10);
        grid.setPadding(new Insets(25, 10, 25, 10));
        grid.add(name, 1, 0);
        grid.add(name1, 2, 0);

        grid.add(surname, 1, 1);
        grid.add(surname1, 2, 1);
        pane.getChildren().addAll(grid, title);

        return pane;
    }

}

谢谢大家阅读这个主题。

Answer 1

尝试将标题标签的-fx-background-color设置为与borderPane背景相同的颜色。并确保您在css文件中设置，因为除非您将它们连接起来，否则无法通过setStyle()设置多个样式：

myComponent.setStyle("-fx-text-fill: white;"+
    "-fx-background-color: black;");

此外，使用InlineStyleSheets是不好的做法，因为它始终具有比CSS StyleSheet中指定的规则更高的优先级。

（如果您将pane.setAlignment(title, Pos.TOP_LEFT)更改为StackPane.setAlignment(title, Pos.TOP_LEFT)，则可以删除＆＃34;静态访问＆＃34;警告。）

Answer 2

用户jewelsea已设置控件来执行此操作。

相关的stackoverflow问题是：How to add border to panel of javafx?

在gitHub上：https://gist.github.com/jewelsea/2838292

我使用它进行了极少的修改，它就像一个魅力。

JavaFX边界标题

2 个答案: