要在上带有Button
s图标,请执行以下操作Tab
:
的setGraphic
方法Tab
可用于添加Node
要在上显示的任何内容Tab
。阿Button
可加入,因为它是一个Node
。
此后,将显示一个功能齐全的按钮,但不显示任何图标。Button
也具有setGraphic
相同的方法,因此ImageView
可以添加,以Image
在上显示Button
。
要Button
在制表符区域的右上角具有s,请执行以下操作:
这些按钮可以放置在上TabPane
,而不是放置在上TabPane
。为此,您可以使用AnchorPane
将锚定Button
到右上角。
例子:
public class ButtonedTabPane extends Application {
@Override
public void start(Stage primaryStage) {
BorderPane root = new BorderPane();
TabPane tabPane = new TabPane();
tabPane.setTabClosingPolicy(TabPane.TabClosingPolicy.UNAVAILABLE);
// HBox of control buttons
HBox hbox = new HBox();
hbox.getChildren().addAll(createTabButton("min.png"), createTabButton("max.png"));
// Anchor the controls
AnchorPane anchor = new AnchorPane();
anchor.getChildren().addAll(tabPane, hbox);
AnchorPane.setTopAnchor(hbox, 3.0);
AnchorPane.setRightAnchor(hbox, 5.0);
AnchorPane.setTopAnchor(tabPane, 1.0);
AnchorPane.setRightAnchor(tabPane, 1.0);
AnchorPane.setLeftAnchor(tabPane, 1.0);
AnchorPane.setBottomAnchor(tabPane, 1.0);
// Create some tabs
Tab tab = new Tab("Files");
tab.setGraphic(createTabButton("files.png"));
((Button) tab.getGraphic()).setOnAction(e -> System.out.println("I'll show the list of files!"));
tabPane.getTabs().add(tab);
tab = new Tab("Network");
tab.setGraphic(createTabButton("network.png"));
((Button) tab.getGraphic()).setOnAction(e -> System.out.println("I'll show the network!"));
tabPane.getTabs().add(tab);
root.setCenter(anchor);
Scene scene = new Scene(root, 400, 400);
scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
primaryStage.setScene(scene);
primaryStage.show();
}
private Button createTabButton(String iconName) {
Button button = new Button();
ImageView imageView = new ImageView(new Image(getClass().getResource(iconName).toExternalForm(),
16, 16, false, true));
button.setGraphic(imageView);
button.getStyleClass().add("tab-button");
return button;
}
public static void main(String[] args) {
launch(args);
}
}
剩下的唯一事情就是要从中删除默认的背景和边框Button
。这可以通过将以下CSS选择器插入CSS样式表来完成。
style.css
.tab-button {
-fx-border-width: 0;
-fx-background-radius: 0;
-fx-background-color: transparent;
-fx-content-display: graphic-only;
}
.tab-button:hover {
-fx-background-color: white;
}
结果:
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句