如何镜像给定代码中的选项卡

Question

不久前，我从一个好心的陌生人那里收到了这段代码，从那时起，我一直试图镜像这段代码的效果，但没有成功。

我希望选项卡从左边滑入，而不是从右边滑入，这是代码当前所做的。

import javafx.application.Application;
import javafx.animation.TranslateTransition;    
import javafx.geometry.Insets;
import javafx.geometry.Side;    
import javafx.util.Duration;    
import javafx.stage.Stage;
import javafx.scene.Scene;  
import javafx.scene.control.Label;
import javafx.scene.control.Tab;
import javafx.scene.control.TabPane;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;  
import javafx.scene.layout.Region;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
public class PlaylistDemo
extends Application {
private static final Duration ANIMATION_SPEED = Duration.seconds(0.5);
private enum ExpandState { EXPANDED, HIDDEN, CHANGING }
private ExpandState expandState = ExpandState.HIDDEN;
@Override
public void start(Stage stage) {
TableView<Object> musicList = new TableView<>();
musicList.getColumns().add(new TableColumn<Object, Object>("Name"));
musicList.getColumns().add(new TableColumn<Object, Object>("Artist"));
musicList.getColumns().add(new TableColumn<Object, Object>("Album"));
Region playlist = new BorderPane(musicList);
playlist.setMaxWidth(Region.USE_PREF_SIZE);
playlist.setStyle("-fx-background-color: white;");
Label tabLabel = new Label("PlayList");
Tab playlistTab = new Tab(null, playlist);
playlistTab.setGraphic(tabLabel);
playlistTab.setClosable(false);
TabPane tabPane = new TabPane(playlistTab);
tabPane.setSide(Side.LEFT);
tabPane.setRotateGraphic(true);
// Placeholder, to reserve space for playlist tab.
TabPane dummyTabPane = new TabPane(new Tab("Dummy", new Label()));
dummyTabPane.setSide(Side.LEFT);
dummyTabPane.setVisible(false);
Label player = new Label("Music player goes here");
player.setPadding(new Insets(200));
BorderPane musicPane =
new BorderPane(player, null, dummyTabPane, null, null);
BorderPane.setMargin(player, new Insets(0, 24, 0, 0));
StackPane applicationPane = new StackPane(musicPane, tabPane);
playlist.layoutBoundsProperty().addListener((o, old, b) -> {
double tabWidth = playlist.localToScene(b).getMinX() -
tabPane.localToScene(0, 0).getX();
tabPane.setTranslateX(applicationPane.getWidth() - tabWidth);
});
applicationPane.widthProperty().addListener((o, old, width) -> {
double tabWidth =
playlist.localToScene(playlist.getLayoutBounds()).getMinX() -
tabPane.localToScene(0, 0).getX();
tabPane.setTranslateX(applicationPane.getWidth() - tabWidth);
});
tabLabel.setOnMouseEntered(e -> {
if (expandState == ExpandState.HIDDEN) {
TranslateTransition transition =
new TranslateTransition(ANIMATION_SPEED, tabPane);
transition.setByX(-playlist.getWidth());
expandState = ExpandState.CHANGING;
transition.setOnFinished(ae -> {
expandState = ExpandState.EXPANDED;
});
transition.play();
}
});
playlist.setOnMouseExited(e -> {
if (expandState == ExpandState.EXPANDED) {
TranslateTransition transition =
new TranslateTransition(ANIMATION_SPEED, tabPane);
transition.setByX(playlist.getWidth());
expandState = ExpandState.CHANGING;
transition.setOnFinished(ae -> {
expandState = ExpandState.HIDDEN;
});
transition.play();
}
});
stage.setScene(new Scene(applicationPane));
stage.setTitle("Player");
stage.show();
}
public static class Main {
public static void main(String[] args) {
Application.launch(PlaylistDemo.class, args);
}
}
}

如果你能解释为什么当对代码进行以下更改时，选项卡会脱节

tabPane.setSide(Side.RIGHT);
dummyTabPane.setSide(Side.RIGHT);

那也太好了！

Answer 1

我将TableView和TabPane旋转了180度。然后，我将起始宽度设置为等于TabPane宽度。我将Animation设置为从给定位置扩展到TableView的宽度。你可能需要玩数字游戏更新：原始代码确实解决了您最初的问题。

我希望选项卡从左边滑入，而不是从右边滑入，这是代码当前所做的。

有些人可能有更好的方法来做到这一点。随着你的评论更新，事情变得更加棘手。我不得不在一些节点上使用.setScaleY(-1(。

import javafx.application.Application;
import javafx.animation.TranslateTransition;
import javafx.geometry.Insets;
import javafx.geometry.NodeOrientation;
import javafx.geometry.Side;
import javafx.util.Duration;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Tab;
import javafx.scene.control.TabPane;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.Region;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
public class App
extends Application {
private static final Duration ANIMATION_SPEED = Duration.seconds(0.5);
private enum ExpandState { EXPANDED, HIDDEN, CHANGING }
private ExpandState expandState = ExpandState.HIDDEN;
@Override
public void start(Stage stage) {
TableView<Object> musicList = new TableView<>();
musicList.getColumns().add(new TableColumn<>("Name"));
musicList.getColumns().add(new TableColumn<>("Artist"));
musicList.getColumns().add(new TableColumn<>("Album"));
musicList.setScaleY(-1);
musicList.setRotate(180);
Region playlist = new BorderPane(musicList);
playlist.setMaxWidth(Region.USE_PREF_SIZE);
playlist.setStyle("-fx-background-color: white;");
Label tabLabel = new Label("PlayList");
tabLabel.setScaleY(-1);
tabLabel.setRotate(360);
Tab playlistTab = new Tab(null, playlist);
playlistTab.setGraphic(tabLabel);
playlistTab.setClosable(false);

TabPane tabPane = new TabPane(playlistTab);
tabPane.setNodeOrientation(NodeOrientation.LEFT_TO_RIGHT);
tabPane.setSide(Side.LEFT);
tabPane.setRotateGraphic(true);
tabPane.setRotate(180);
tabPane.setScaleY(-1);
// Placeholder, to reserve space for playlist tab.
TabPane dummyTabPane = new TabPane(new Tab("Dummy", new Label()));
dummyTabPane.setSide(Side.LEFT);
dummyTabPane.setVisible(false);
Label player = new Label("Music player goes here");
player.setPadding(new Insets(200));
BorderPane musicPane =
new BorderPane(dummyTabPane, null, player, null, null);
BorderPane.setMargin(player, new Insets(0, 0, 0, 24));
StackPane applicationPane = new StackPane(musicPane, tabPane);
playlist.layoutBoundsProperty().addListener((o, old, b) -> {
double tabWidth = playlist.localToScene(b).getMinX() -
tabPane.localToScene(0, 0).getX();
tabPane.setTranslateX(-playlist.getWidth() - 20 + tabWidth);
});
applicationPane.widthProperty().addListener((o, old, width) -> {
double tabWidth =
playlist.localToScene(playlist.getLayoutBounds()).getMinX() -
tabPane.localToScene(0, 0).getX();
tabPane.setTranslateX(-playlist.getWidth() + tabWidth);
});
tabLabel.setOnMouseEntered(e -> {
if (expandState == ExpandState.HIDDEN) {
TranslateTransition transition =
new TranslateTransition(ANIMATION_SPEED, tabPane);
transition.setByX(playlist.getWidth());
expandState = ExpandState.CHANGING;
transition.setOnFinished(ae -> {
expandState = ExpandState.EXPANDED;
});
transition.play();
}
});
playlist.setOnMouseExited(e -> {
if (expandState == ExpandState.EXPANDED) {
TranslateTransition transition =
new TranslateTransition(ANIMATION_SPEED, tabPane);
transition.setByX(-playlist.getWidth());
expandState = ExpandState.CHANGING;
transition.setOnFinished(ae -> {
expandState = ExpandState.HIDDEN;
});
transition.play();
}
});
stage.setScene(new Scene(applicationPane));
stage.setTitle("Player");
stage.show();
}
public static class Main {
public static void main(String[] args) {
Application.launch(App.class, args);
}
}
}