0

我正在尝试使导航面板从左侧滑出。我已经管理了一个动画，但我无法解决一件事，那就是程序窗口左侧区域留下的绿色空白区域。有谁知道如何摆脱左边的绿地？谢谢

我的代码看起来像这样（只需复制和粘贴，它应该可以工作）

import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextArea;
import javafx.scene.layout.BorderPane;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Main extends Application
{
    BorderPane slider;
    BorderPane mainPane;
    Rectangle clip;
    Button show;
    boolean displayed;

    @Override
    public void start(Stage primaryStage) throws Exception {
        show = new Button("Press");
        displayed = false;
        mainPane = new BorderPane();
        mainPane.setPrefSize(500,200);
        slider = new BorderPane(); slider.setPrefHeight(200);
        mainPane.setStyle("-fx-background-color: chartreuse");
        slider.setStyle("-fx-background-color: aqua");

        clip = new Rectangle(0,200);
        slider.setPrefWidth(0);

        slider.setClip(clip);
        slider.setCenter(new Button("Hello"));
        mainPane.setTop(show);
        mainPane.setCenter(new TextArea("some text"));
        mainPane.setLeft(slider);
        show.setOnAction(event -> {
            if (displayed)
            {
                Timeline tm = new Timeline();
                KeyValue kv1 = new KeyValue(slider.translateXProperty(), -100);
                KeyValue kv2 = new KeyValue(slider.prefWidthProperty(), 0);
                KeyValue kv3 = new KeyValue(clip.widthProperty(), 0);
                KeyFrame kf = new KeyFrame(Duration.millis(200), kv1, kv2, kv3);
                tm.getKeyFrames().addAll(kf);
                tm.play();
                displayed = false;
            }
            else
            {
                Timeline tm = new Timeline();
                KeyValue kv1 = new KeyValue(slider.translateXProperty(), 0);
                KeyValue kv2 = new KeyValue(slider.prefWidthProperty(), 100);
                KeyValue kv3 = new KeyValue(clip.widthProperty(), 100);
                KeyFrame kf = new KeyFrame(Duration.millis(200), kv1, kv2, kv3);
                tm.getKeyFrames().addAll(kf);
                tm.play();
                displayed = true;
            }
        });

        Scene sc = new Scene(mainPane);
        primaryStage.setScene(sc);
        primaryStage.show();
    }
}
4

2 回答 2

1

您可以在按下按钮时添加滑块（mainPane 的左子项），而不是事先添加它。然后，当您再次按下按钮时，您可以在过渡完成后移除滑块。

import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextArea;
import javafx.scene.layout.BorderPane;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Main extends Application
{
    BorderPane slider;
    BorderPane mainPane;
    Rectangle clip;
    Button show;
    boolean displayed;

    @Override
    public void start(Stage primaryStage) throws Exception {
        show = new Button("Press");
        displayed = false;
        mainPane = new BorderPane();
        mainPane.setPrefSize(500,200);
        slider = new BorderPane();
        slider.setPrefHeight(200);
        mainPane.setStyle("-fx-background-color: chartreuse");
        slider.setStyle("-fx-background-color: aqua");

        clip = new Rectangle(0,200);
        slider.setPrefWidth(0);

        slider.setClip(clip);
        slider.setCenter(new Button("Hello"));
        mainPane.setTop(show);
        mainPane.setCenter(new TextArea("some text"));
        show.setOnAction(event -> {
            if (displayed) {
                Timeline tm = new Timeline();
                KeyValue kv1 = new KeyValue(slider.translateXProperty(), -100);
                KeyValue kv2 = new KeyValue(slider.prefWidthProperty(), 0);
                KeyValue kv3 = new KeyValue(clip.widthProperty(), 0);
                KeyFrame kf = new KeyFrame(Duration.millis(200), kv1, kv2, kv3);
                tm.getKeyFrames().addAll(kf);
                tm.play();
                displayed = false;
                tm.setOnFinished(e -> mainPane.setLeft(null));
            } else {
                mainPane.setLeft(slider);
                Timeline tm = new Timeline();
                KeyValue kv1 = new KeyValue(slider.translateXProperty(), 0);
                KeyValue kv2 = new KeyValue(slider.prefWidthProperty(), 100);
                KeyValue kv3 = new KeyValue(clip.widthProperty(), 100);
                KeyFrame kf = new KeyFrame(Duration.millis(200), kv1, kv2, kv3);
                tm.getKeyFrames().addAll(kf);
                tm.play();
                displayed = true;
            }
        });

        Scene sc = new Scene(mainPane);
        primaryStage.setScene(sc);
        primaryStage.show();
    }
}

您也可以重复使用时间线，而不是每次都创建一个新的 :)

于 2015-12-01T11:04:42.383 回答
1

我知道这是一个旧线程，但是有一个很棒的 JavaFX 库可以在这里提供帮助：controlsFX。特别是HiddenSidesPane控件对象。

在此处输入图像描述

于 2018-02-06T08:05:28.787 回答