如何使用 javafx 使用 DropDown Items 进行 sidenav?

时间:2021-08-01 22:37:13

标签: java user-interface animation javafx-8 fxml

我正在尝试使用可折叠项目制作左侧导航栏,如下所示:

Sidenav with dopdown items

我尝试使用带有按钮的父 Vbox 和另一个带有项目的 vBox 来制作组件。

最后我一直在使用缩放动画,但我不知道如何在顶部设置兴趣点,现在我尝试使用翻译动画将其向上平移,

import com.jfoenix.controls.JFXButton;
import java.util.ArrayList;
import javafx.animation.ScaleTransition;
import javafx.animation.TranslateTransition;
import javafx.geometry.Insets;
import javafx.scene.layout.VBox;
import javafx.util.Duration;

public class SideCollapsableMenu extends VBox{
    private VBox vBoxItems;
    private JFXButton TopButton;
    private TranslateTransition  collapseAnimation;

    public SideCollapsableMenu(String mainName, ArrayList<JFXButton> buttonList){
        this.TopButton = new JFXButton(mainName);
        this.vBoxItems = new VBox(0);
        this.vBoxItems.setPadding(new Insets(0, 0, 0, 20));
        this.vBoxItems.getChildren().addAll(buttonList);
        this.getChildren().addAll(TopButton,vBoxItems);
        this.TopButton.setOnMouseClicked(event -> playCollapse());
        
        this.collapseAnimation = 
            new TranslateTransition(Duration.INDEFINITE.millis(1000), vBoxItems);
        this.collapseAnimation.setToY(-40*buttonList.size());
    }
    
    public void playCollapse(){
        collapseAnimation.play();
        vBoxItems.setVisible(false);
    }
}

但在这两种情况下,下一项都不会向上移动。

Opened items

Clossed items

0 个答案:

没有答案