JavaFX带有透明背景的按钮

Question

我有一些在JavaFX中的经典Button，其中包含一些文本。

我需要没有盒子，只有文本的按钮，并且当我悬停在按钮上或使用鼠标单击按钮时，它应该改变颜色。

- Terra Incognita

---

你的代码在哪里？我们能看到吗？ - surajs1n

只需在场景中放置一个按钮和一个空的FXML文件，无需特殊代码。 - Terra Incognita

“直接在这个按钮上”是什么意思？悬停？点击？点击后更改颜色？ - fabian

Answer 1

在JavaFX中，样式是通过使用CSS来完成的。

.button{
    -fx-border-color: transparent;
    -fx-border-width: 0;
    -fx-background-radius: 0;
    -fx-background-color: transparent;
    -fx-font-family:"Segoe UI", Helvetica, Arial, sans-serif;
    -fx-font-size: 1em; /* 12 */
    -fx-text-fill: #828282;
}

.button:focused {
    -fx-border-color: transparent, black;
    -fx-border-width: 1, 1;
    -fx-border-style: solid, segments(1, 2);
    -fx-border-radius: 0, 0;
    -fx-border-insets: 1 1 1 1, 0;
}

.button:pressed {
    -fx-background-color: black;
    -fx-text-fill: white;
}

将此代码添加到CSS文件中，将其保存到包含按钮的控件源文件所在的目录中。然后在该类中：

getStylesheets().add(getClass().getResource("nameofyourcssfile.css").toExternalForm());

那么该对象包含的所有按钮都将使用这些样式类。

根据您的需求进行修改非常简单。

一个很好的入门教程： http://docs.oracle.com/javafx/2/css_tutorial/jfxpub-css_tutorial.htm

- DVarga

---

谢谢您的回答，但我能把它们都放在FXML文件中吗？还是必须只能放在CSS文件中？ - Terra Incognita

所有的样式都可以在类文件中使用 setStyle() 方法来设置 Button 的样式。但我不知道为什么你要使用 Button 而不是 Hyperlink。 - Zephyr

你可以用按钮(Button)做超链接(Hyperlink)能做的一切，甚至更多：例如，以后你想用图标替换文本。如果你不喜欢超链接控件的默认颜色，你仍然需要编写CSS。对于CSS：将CSS放入代码中会污染代码。将样式与代码分离总是更好的选择，因为它会导致更干净、更易于更改的前端。 - DVarga

Answer 2

JavaFX有一个名为Hyperlink控件，基本上具备您所寻找的所有功能。它与按钮一样会触发ActionEvent事件：

Hyperlink button = new Hyperlink("Some text");
button.setOnAction(e -> System.out.println("Hyperlink clicked"));

就像网页中的链接一样，如果它已经被“访问”了，也就是说，它上面发生了某些动作，那么它会以不同的颜色显示。

- James_D

Answer 3

这是在SceneBuilder中如何操作：

通过点击选择按钮。

然后在属性->样式中选择“-fx-background-color”，将值设置为“transparent”。

就像这样：

- Shivam Papat

Answer 4

如果有人想要删除默认按钮背景的方法，可以按照以下步骤进行：

button.setBackground(null);

如果您想重新设计按钮，我建议使用类似上面答案中提到的CSS。

- Ben