简体   繁体   English

如何去除分隔器内的空间?

[英]How can i remove the space inside a Separator?

I have created a Horizontal Separator in a VBox . 我在VBox创建了一个Horizontal Separator

Following is the code: 以下是代码:

Separator s = new Separator(Orientation.HORIZONTAL);
s.setStyle(""
    + "-fx-border-width: 1px;"
    + "-fx-border-color: black;"
    + "-fx-padding: 0px;"
    + "");
getChildren().add(s);

I want to remove the space inside the Separator . 我要删除Separator内部的空间。 So I set the CSS property -fx-padding: 0px; 所以我设置了CSS属性-fx-padding: 0px; but it doesn't seem to work. 但它似乎不起作用。

How can I do it??!! 我该怎么做??!!


Here is the image Separator 这是图像分隔符

The separator consists out of two Elements. 分隔符由两个元素组成。

The Separator root node with css class separator and an child element Region with css class line 具有CSS类分隔符Separator根节点和具有CSS类的子元素Region

If you want to remove the line in the middle of the black box than you have to modify the region( line ) child and set its border insets and width to 0px 如果要删除黑框中间的线,则必须修改region( line )子级并将其边界插入宽度设置0px

for example: 例如:

Separator separator = new Separator();
separator.setStyle(""
    + "-fx-border-width: 1px;"
    + "-fx-border-color: black;"
    + "-fx-padding: 0px;"
    + "");

stage.show()

And than after stage.show() you will have access to its childern via lookup or getChildrenUnmodifiable() 而且比stage.show()之后,您将可以通过lookupgetChildrenUnmodifiable()来访问其子项

Node line = separator.lookup(".line");
line.setStyle(""
    + "-fx-border-insets: 0px;"
    + "-fx-border-width: 0px;"
    + "");

or 要么

separator.getChildrenUnmodifiable().get(0).setStyle(""
    + "-fx-border-insets: 0px;"
    + "-fx-border-width: 0px;"
    + "");

and third the option of With metrics 第三项“ 使用指标 ”选项

FontMetrics metrics = Toolkit.getToolkit().getFontLoader().getFontMetrics(label.getFont());
label.setPadding(new Insets(-metrics.getDescent(), 0, 0, 0));

and fourth option of With Bounds which is not applyable for all Nodes and does not work in this case. 以及“ 有边界”的第四个选项不适用于所有节点,并且在这种情况下不起作用。

Text text = new Text();
text.setBoundsType(TextBoundsType.VISUAL);

And as last option you could add an CSS file which changes the style of the .line class 最后,您可以添加一个CSS文件来更改.line类的样式

App.css: App.css:

.line {
    -fx-border-width: 0px;
    -fx-border-insets: 0px;
}

.separator {
    -fx-padding: 0px;
    -fx-border-insets: 0px;
    -fx-border-width: 1px;
    -fx-border-color: black;
}

And than you just have to apply this css to your scene. 而且,您只需要将此CSS应用于场景即可。

scene.getStylesheets().add("App.css");

If you dont know about it already maybe you should checkout Scenic View which is a good tool if you want to inspect JavaFx applications. 如果您还不了解它,也许您应该签出Scenic View ,这是一个很好的工具,如果您想检查JavaFx应用程序。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM