JavaFX - 在CSS中使用“-fx-background-radius”会使我的app变慢

Question

所以情况就是如此。我正在使用JavaFXPorts实现一个应用程序，我想创建一个圆形的ToggleButton。然后将此按钮放在GridPane上，该GridPane还包含一个包裹在ScrollPane中的HBox。为了保持这个简单，我只是给树提供GridPane所拥有的节点。

GridPane
|___________ ToggleButton
|___________ ScrollPane
             |__________ HBox
                         |_______ 20+ Images here

所以，当我在iPhone 5上编译它时，一切都运行得很顺利。我可以水平滚动HBox并查看其中的图像。

然而，当我使用下面的CSS代码时，事情开始发生变化。滚动的性能降低到它变得迟钝的程度。在使用这些样式后，我注意到问题是“ - fx-（背景/边框） - 半径”样式的原因。我认为这可能是一个错误。我也试过缓存节点，虽然提高了速度，但仍然很滞后。

请注意，在iPhone 6上运行相同的应用程序，它执行正常。

.rounded_button {
    -fx-background-color: transparent;
    -fx-background-insets: 0;
    -fx-text-fill: black;
    -fx-border-color: lightgray;
    -fx-font-size: 0.9em;
    -fx-pref-height: 33px;
    -fx-background-radius: 0em 1.5em 1.5em 0em; 
    -fx-border-radius: 0 1.5em 1.5em 0;
}

我还启用了脉冲记录器，这是输出：

PULSE: 556 [73887ms:327ms]
T1 (-73886 +73887ms): Layout Pass
T1 (0 +14ms): CSS Pass
T1 (14 +2ms): Layout Pass
T1 (16 +0ms): Update bounds
T1 (17 +0ms): Waiting for previous rendering
T1 (17 +0ms): Copy state to render graph
T7 (18 +0ms): Dirty Opts Computed
T7 : 2 different dirty regions to render
T7 : Dirty Region 0: RectBounds { minX:183.0, minY:157.0, maxX:219.0, maxY:180.0} (w:36.0, h:23.0)
T7 : Render Root Path 0: [com.sun.javafx.sg.prism.NGRegion@578c420, com.sun.javafx.sg.prism.NGRegion@56314d0, com.sun.javafx.sg.prism.NGRegion@5631420, com.sun.javafx.sg.prism.NGRegion@4d03420, com.sun.javafx.sg.prism.NGRegion@adca630, com.sun.javafx.sg.prism.NGRegion@4d03160, com.sun.javafx.sg.prism.NGRegion@4d030b0, com.sun.javafx.sg.prism.NGRegion@49294d0, com.sun.javafx.sg.prism.NGRegion@49296e0]
T7 : Dirty Region 1: RectBounds { minX:310.0, minY:63.0, maxX:319.0, maxY:519.0} (w:9.0, h:456.0)
T7 : Render Root Path 1: [com.sun.javafx.sg.prism.NGRegion@578c420, com.sun.javafx.sg.prism.NGRegion@56314d0, com.sun.javafx.sg.prism.NGRegion@5631420, com.sun.javafx.sg.prism.NGRegion@4d03420, com.sun.javafx.sg.prism.NGRegion@adca630, com.sun.javafx.sg.prism.NGRegion@4d03160]
T7 (18 +0ms): Render Roots Discovered
T7 : Slow background path for null
T7 : Slow shape path for null
T7 : Slow background path for null
T7 : Slow shape path for null
T7 : Slow background path for null
T7 (18 +305ms): Painting
T7 (324 +0ms): Painting
T7 (325 +2ms): Presenting
Counters:
    CacheFilter rebuilding: 3
    NGRegion renderBackgroundShape slow path: 2
    NGRegion renderBackgrounds slow path: 3
    Nodes rendered: 57
    Nodes visited during render: 71

没有 -fx-background-radius ， -fx-border-radius ：

PULSE: 1493 [89717ms:37ms]
T1 (-89717 +89717ms): Layout Pass
T1 (0 +13ms): CSS Pass
T1 (13 +1ms): Layout Pass
T1 (15 +0ms): Update bounds
T1 (16 +0ms): Waiting for previous rendering
T1 (16 +0ms): Copy state to render graph
T7 (16 +0ms): Dirty Opts Computed
T7 : 2 different dirty regions to render
T7 : Dirty Region 0: RectBounds { minX:183.0, minY:157.0, maxX:219.0, maxY:180.0} (w:36.0, h:23.0)
T7 : Render Root Path 0: [com.sun.javafx.sg.prism.NGRegion@542b420, com.sun.javafx.sg.prism.NGRegion@578a370, com.sun.javafx.sg.prism.NGRegion@578a2c0, com.sun.javafx.sg.prism.NGRegion@556e840, com.sun.javafx.sg.prism.NGRegion@556e0b0, com.sun.javafx.sg.prism.NGRegion@556e420, com.sun.javafx.sg.prism.NGRegion@556e370, com.sun.javafx.sg.prism.NGRegion@4c9f580, com.sun.javafx.sg.prism.NGRegion@4c9f630, com.sun.javafx.sg.prism.NGRegion@4c9f790, com.sun.javafx.sg.prism.NGRegion@4c9f8f0]
T7 : Dirty Region 1: RectBounds { minX:310.0, minY:63.0, maxX:319.0, maxY:519.0} (w:9.0, h:456.0)
T7 : Render Root Path 1: [com.sun.javafx.sg.prism.NGRegion@542b420, com.sun.javafx.sg.prism.NGRegion@578a370, com.sun.javafx.sg.prism.NGRegion@578a2c0, com.sun.javafx.sg.prism.NGRegion@556e840, com.sun.javafx.sg.prism.NGRegion@556e0b0, com.sun.javafx.sg.prism.NGRegion@556e420]
T7 (16 +0ms): Render Roots Discovered
T7 : Slow background path for null
T7 : Slow shape path for null
T7 : Slow background path for null
T7 : Slow shape path for null
T7 (17 +17ms): Painting
T7 (35 +0ms): Painting
T7 (35 +1ms): Presenting
Counters:
    CacheFilter rebuilding: 3
    NGRegion renderBackgroundShape slow path: 2
    NGRegion renderBackgrounds slow path: 2
    Nodes rendered: 57
    Nodes visited during render: 71

脉冲以 37ms 完成，没有样式。

提前谢谢

更新

您可以从here下载源代码。

下面是来自iPhone 5的屏幕截图。当横向滚动包含按钮ABC，BCD，CDE等的HBox时，就会发现事情开始变得迟钝。在右下角的图片中，是我删除.css样式后的屏幕截图，滚动工作正常。

更新

Video Without CSS

Video With CSS