JavaFX：引用CSS中的折叠和扩展的手风琴状态

Question

我希望每个人都做得很好。

我试图使用css基于我的TiteldPane对象中的collapsed或expanded伪类属性来控制箭头的旋转。我正在使用javafx8。如果你查看文档here，你会看到expanded和collapsed伪造的类在那里。

以下是我认为应该起作用的最小例子。通用主 - >

package application;

import javafx.application.Application;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.control.Accordion;
import javafx.scene.control.Label;
import javafx.scene.control.TitledPane;


public class Main extends Application 
{
    @Override
    public void start(Stage primaryStage) 
    {
        Accordion accordion = new Accordion
        (
                new TitledPane("TitledPane #1", new Label("Content #1"))
        );
        primaryStage.setScene(new Scene(accordion, 600, 400));
        primaryStage.setTitle("Test");
        primaryStage.show();
    }
}

并且下面的css正如您所期望的那样在主要工作 - >

.accordion .title > .arrow-button
{
    -fx-rotate: -45;   
}

但是如果我想根据它是否倒塌影响箭头的旋转，我希望能够写下面的东西 - >

.accordion .title:collapsed > .arrow-button
{
      -fx-rotate: 45;
}

.accordion .title:expanded > .arrow-button
{
      -fx-rotate: -45
}

任何人都可以向我解释为什么这不起作用并显示它应该如何正确完成？在项目中我试图应用它，我不是动画旋转，但我有兴趣知道这是否会影响事物。

非常感谢您抽出宝贵时间来帮助我。

编辑：为我想要实现的目标添加细节。我希望箭头指向折叠状态，我希望它在展开状态下指向上方。

Answer 1

在搞砸了这个之后，我发现了一个黑客，它允许你在折叠时向下指向箭头，在展开时向上指向向上。但是，当TitledPane动画（或至少看起来很糟糕）时，它将无法正常工作。

import javafx.beans.binding.Bindings;
import javafx.scene.control.TitledPane;
import javafx.scene.layout.Region;
import javafx.scene.transform.Rotate;

public static void pointArrowUp(TitledPane pane) {
    Region arrow = (Region) pane.lookup(".arrow");

    Rotate rotate = new Rotate();
    rotate.pivotXProperty().bind(arrow.widthProperty().divide(2.0));
    rotate.pivotYProperty().bind(arrow.heightProperty().divide(2.0));
    rotate.angleProperty().bind(
            Bindings.when(pane.expandedProperty())
                    .then(-180.0)
                    .otherwise(90.0)
    );

    arrow.getTransforms().add(rotate);
    pane.setAnimated(false);
}

就像my answer to a previous question of yours一样，上面要求TitledPane在使用前显示在Window中;也就是说，除非你使用自定义皮肤。

我试着简单地调用arrow.rotateProperty().unbind()然后在CSS中设置旋转，但无论出于何种原因我都无法让它看起来正确。

---

通常警告：这是一个“黑客”，依赖于TitledPane及其皮肤的内部实现，可能会在未来版本中发生变化。更改JavaFX版本时要小心。我只用JavaFX 11.0.2尝试了上述内容。