是否可以在 JavaFX 中为子窗格设置规则只为父窗格制作圆角？

Question

我有以下 fxml：

<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>
<StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <AnchorPane maxHeight="200.0" maxWidth="200.0" prefHeight="200.0" prefWidth="200.0">
         <children>
            <VBox style="-fx-border-radius: 10; -fx-border-color: black; -fx-border-width: 1;" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
               <children>
                  <Pane maxWidth="200.0" prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: red;" />
                  <Pane prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: cyan;" />
                  <Pane prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: green;" />
               </children>
            </VBox>
         </children>
      </AnchorPane>
   </children>
</StackPane>

这是结果：

VBox 具有以下 css 规则：

-fx-border-radius: 10; 
-fx-border-color: black; 
-fx-border-width: 1;

问题是子角（总共 4 个角）在父角之外 - 我的意思是根据父半径，4 个子角不是圆形的。 是否可以在不为子窗格设置规则的情况下修复它？ 如果是，那么如何？ 我问它是因为在实际应用中，我在父母中有许多不同的孩子，这些孩子的顺序可以改变，我不想控制孩子的半径。

Answer 1

您可以对圆角矩形使用形状剪裁。 将其坐标和尺寸绑定到源窗格，它应该可以正常工作。

import javafx.scene.shape.*;

VBox box = ...;
Rectangle r = new Rectangle();
r.widthProperty().bind(box.widthProperty());
r.heightProperty().bind(box.heightProperty());
r.setArcWidth(10);
r.setArcHeight(10);

box.setClip(r);

Answer 2

据我所知，有点晚了，但是您无需做任何额外的工作就可以实现这一目标。 您只需要使用 css ：在您的 css 文件中，只需使用 css 选择 AnchorPanes。 举个例子，假设你的 root 的 id 是 #rootPane，你可以使用 #rootPane 使用以下方式设置其余的 Anchor Panes 的样式，

#rootPane AnchorPane{
    -fx-background-radius:200; /* a value of your preference*/
}

会得到你想要的。 输出在这里：输出

我在外部为锚窗格添加了颜色，仅用于视觉目的