问题: 我有一个名为MenuContainer的HBox,其中我有一个MenuBar,我使用FXML来解决问题,将CSS用于样式。我想在MenuContainer下面有1px边框,所以我给它了样式:" -fx-border-width:0px 0px 1px 0px; -fx-border-color:black;"我知道样式表已正确设置,因为我在项目中设置了其他元素。 我的问题是边框没有出现,经过进一步的实验,我发现边框开始显示当我将边框宽度增加到5px时,边框显示为应该是(1px)。我花了好几个小时试图找到一个不仅仅是将宽度设置为5px的修复,因为我不知道这是否适用于不同的屏幕尺寸,我对这种懒惰的修复感到不满意。 有趣的是,当我在FXML的场景构建器中查看布局时,边框会正确显示,但是当我运行程序时,它不存在,附着的是此截图。Executed Program。 In Scene Builder
相关代码: 的 FXML
<?xml version="1.0" encoding="UTF-8"?>
<?import java.net.URL?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.canvas.Canvas?>
<?import javafx.scene.control.Accordion?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Menu?>
<?import javafx.scene.control.MenuBar?>
<?import javafx.scene.control.MenuItem?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Separator?>
<?import javafx.scene.control.TitledPane?>
<?import javafx.scene.control.Tooltip?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>
<GridPane fx:id="mainGridPane" xmlns="http://javafx.com/javafx/8.0.121" xmlns:fx="http://javafx.com/fxml/1" fx:controller="code.controllers.MainScreenController">
<children>
<!-- menu at the top of screen -->
<HBox fx:id="menuContainer" GridPane.columnIndex="0" GridPane.columnSpan="2" GridPane.rowIndex="0" GridPane.hgrow="ALWAYS">
<MenuBar fx:id="menuBar" HBox.hgrow="ALWAYS">
<menus>
<Menu text="File">
<MenuItem text="New" />
<MenuItem text="Open" />
<MenuItem text="Save" />
</Menu>
<Menu text="Edit">
</Menu>
</menus>
</MenuBar>
</HBox>
<!--the toolbar-->
<HBox fx:id="toolBar" alignment="CENTER_LEFT" GridPane.columnIndex="0" GridPane.columnSpan="2" GridPane.rowIndex="1">
<Button fx:id="undoButton" styleClass="toolButton">
<tooltip>
<Tooltip text="Undo" />
</tooltip>
<HBox.margin>
<Insets left="15.0" />
</HBox.margin>
</Button>
<Button fx:id="redoButton" styleClass="toolButton">
<tooltip>
<Tooltip text="Redo" />
</tooltip>
<HBox.margin>
<Insets right="15.0" />
</HBox.margin>
</Button>
<Separator orientation="VERTICAL" />
<Button fx:id="drawButton" styleClass="toolButton">
<tooltip>
<Tooltip text="Draw" />
</tooltip>
<HBox.margin>
<Insets left="15.0" />
</HBox.margin>
</Button>
<Button fx:id="cursorButton" styleClass="toolButton">
<tooltip>
<Tooltip text="Move" />
</tooltip>
</Button>
</HBox>
<Canvas fx:id="mainCanvas" GridPane.columnIndex="0" GridPane.columnSpan="2" GridPane.rowIndex="2" GridPane.valignment="TOP" />
<!-- pane at left hand side of screen -->
<VBox fx:id="sidePane" GridPane.columnIndex="0" GridPane.rowIndex="2">
<ScrollPane hbarPolicy="NEVER" styleClass="secondaryContainer">
<Accordion fx:id="componentAccordion" style="-fx-background-color: #3c3f41">
<panes>
<TitledPane text="Inputs">
<Button styleClass="componentButton" />
</TitledPane>
<TitledPane text="Outputs">
</TitledPane>
<TitledPane text="Logic Gates">
</TitledPane>
</panes>
</Accordion>
</ScrollPane>
</VBox>
</children>
<!--These properties dynamically size the components to the screen size-->
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="20.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="80.0" prefWidth="100.0" />
<ColumnConstraints />
</columnConstraints>
<rowConstraints>
<RowConstraints percentHeight="3.0" vgrow="NEVER" />
<RowConstraints percentHeight="5.0" vgrow="NEVER" />
<RowConstraints percentHeight="92.0" vgrow="NEVER" />
<RowConstraints />
</rowConstraints>
<!-- points to the stylesheet that this markup file is using-->
<stylesheets>
<URL value="@../css/mainStyle.css" />
</stylesheets>
</GridPane>
CSS
#menuContainer {
-fx-background-color: #3c3f41;
-fx-border-width: 0px 0px 1px 0px;
-fx-border-color: black;
}
#menuBar {
-fx-background-color: #3c3f41;
}
#toolBar {
-fx-background-color: #3c3f41;
-fx-border-width: 1px 0px 0px 0px;
-fx-border-color: #585d5f;
}