使用CSS无法正常删除JavaFX TitledPane中的insets [英] Remove insets in JavaFX TitledPane with CSS not working

问题描述

基于James_D的解决方案（如何设置/删除插图在我试过的JavaFX TitledPane 中，似乎通过CSS从JavaFX TitledPane中删除插件不起作用？它在Scene Builder中正确更新，但在运行时，insets保持不变。即使是Scenic View 8.0报告的填充量为9.6。

Based on a solution of James_D (How to set/remove insets in JavaFX TitledPane) that I've tried, it seems that removing insets from a JavaFX TitledPane through CSS does not work? It does update correctly in Scene Builder, but at runtime the insets remain unchanged. Even Scenic View 8.0 reports a padding of 9.6.

FXML示例：

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" stylesheets="@newCascadeStyleSheet.css" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="test3.FXMLDocumentController">
    <children>
      <Accordion layoutX="14.0" layoutY="14.0" prefHeight="270.0" prefWidth="320.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
        <panes>
          <TitledPane animated="false" text="untitled 1">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                     <children>
                          <Button fx:id="button" layoutX="9.600000381469727" layoutY="9.600000381469727" prefHeight="124.0" prefWidth="318.0" text="Click Me!" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
                     </children>
                  </AnchorPane>
            </content>
              </TitledPane>
              <TitledPane animated="false" text="untitled 2">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </TitledPane>
          <TitledPane animated="false" text="untitled 3">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </TitledPane>
        </panes>
      </Accordion>
    </children>
</AnchorPane>

CSS：

.titled-pane {
    -fx-text-fill: rgb(0,100,157);
}
.titled-pane:focused {
    -fx-color: -fx-base;
    -fx-text-fill: white;
}
.titled-pane > .title {
    -fx-text-fill: rgb(0,100,157);
    -fx-font-weight: bold;
}
titled-pane > .title  > .label{
    -fx-text-fill: rgb(0,100,157);
    -fx-font-weight: bold;
}
.titled-pane:focused > .title {
    -fx-color: rgb(0,100,157); 
    -fx-text-fill: white;
}
.titled-pane > .title:hover {
    -fx-color: lightgrey;
}
.titled-pane > * > * > AnchorPane {
    -fx-padding: 0px ;
}

在Scene Builder中查看:(预览）

在运行时查看：

因此，似乎由于某种原因未应用填充。在我的主应用程序中，我使用了很多 Accordion 容器。另一种选择是将FXML代码中的填充添加到 TitledPane 的 AnchorPane ，这可行，但是时间消耗工作。我错过了CSS中的内容吗？

So it seems that the padding is not applied for some reason. In my main application I use a lot of Accordion containers. The other option was to add the padding in FXML code to the AnchorPane of the TitledPane, this works but is a time consuming job. Am I missing something in the CSS?

推荐答案

在以下样式上将 -fx-padding 设置为0 class。

Set the -fx-padding to 0 on the following style classes.

.titled-pane .content AnchorPane {
    -fx-padding: 0px;
}

这篇关于使用CSS无法正常删除JavaFX TitledPane中的insets的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！