Javafx 2 如何使按钮显示为已单击或选中?(JavaFX2)

Javafx 2 如何使按钮显示为已单击或选中?(JavaFX2),javafx-2,Javafx 2,当用户在我的JavaFX2.2UI中按下一个按钮时,会出现一个深蓝色光晕,表示它已被单击。在事件过程中,我的程序可能希望“松开”它以显示它不再被选中 我希望有一个按钮。setSelected(false)

当用户在我的JavaFX2.2UI中按下一个按钮时,会出现一个深蓝色光晕,表示它已被单击。在事件过程中,我的程序可能希望“松开”它以显示它不再被选中

我希望有一个
按钮。setSelected(false)设置效果(新建DropShadow())

使用
setStyle()
是可以的,但是要使用什么值呢?

我想在您的描述中,您实际上想要的是一个标准,而不是一个标准

有一个很好的关于Oracle的教程


处理问题中的项目

深蓝色光晕显示它已被单击

蓝色光环实际上是一个焦点环,表示控件具有焦点。 要聚焦控件,可以调用该方法

在事件过程中,我的程序可能希望“松开”它以显示它不再被选中

若要从控件中移除焦点,可以调用另一个控件上的requestFocus以将焦点放在该控件上

我希望有一个按钮。setSelected(false)

要使按钮能够在选定和未选定状态之间切换,请使用。
ToggleButton
有一个方法

使用setStyle()的setEffect(新的DropShadow())是可以的,但是要使用什么值呢

放置阴影效果的css样式值在中定义

通过
setEffect
或通过css与
setStyle
或应用样式表中的样式类在视觉上等同于在代码中定义阴影效果。在这三种方法中,我从不推荐
setStyle
方法,而只推荐样式表中的css或代码方法中的
setEffect


相关的

注意,还有一个附加的相关属性-:

指示按钮已“防护”,以便释放鼠标将导致调用按钮的操作。这与压力有着微妙的不同。按下表示鼠标已按下节点,但尚未释放。不过,arm也会考虑鼠标是否实际位于按钮上方并按下

处于启用状态的按钮与未处于启用状态的按钮外观稍有不同。大多数程序不需要与按钮的待命状态交互


用于设置选定状态样式的示例

区分选中的切换按钮和未选中的切换按钮的标准方法是将其变暗以提供深度样式效果,并使其在按下时显示得更远。标准如下:

通过为选定状态提供替代定义,可以覆盖此默认行为。下面的示例将确保所选状态显示比标准显示更精细,只会使所选状态颜色变暗一小部分而不是很多

未选择

精选

关联css:

/**
 * file: colored-toggle.css
 *   Place in same directory as ColoredToggle.java.
 *   Have your build system copy this file to your build output directory.
 **/

.root {
  -fx-background-color: cornsilk; 
  -fx-padding: 10;
}

.toggle-button {
  -fx-color: paleturquoise;
}

.toggle-button:selected {
    -fx-background-color:
        -fx-shadow-highlight-color,
        linear-gradient(to bottom, derive(-fx-color,-22%) 0%, derive(-fx-color,-15%) 100%),
        linear-gradient(to bottom, derive(-fx-color,-15%) 0%, derive(-fx-color,-10%) 50%, derive(-fx-color,-8%) 98%, derive(-fx-color,-12%) 100%);
}

.toggle-button:selected:focused {
    -fx-background-color:
        -fx-focus-color,
        linear-gradient(to bottom, derive(-fx-color,-22%) 0%, derive(-fx-color,-15%) 100%),
        linear-gradient(to bottom, derive(-fx-color,-15%) 0%, derive(-fx-color,-10%) 50%, derive(-fx-color,-8%) 98%, derive(-fx-color,-12%) 100%);
}
源文件:

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class ColoredToggle extends Application {
  public static void main(String[] args) { Application.launch(ColoredToggle.class, args); }

  @Override public void start(Stage stage) {
    ToggleButton visibilityControl = new ToggleButton("Winterfell");

    VBox layout = new VBox(10);
    layout.setAlignment(Pos.CENTER);
    layout.getChildren().setAll(visibilityControl);

    layout.getStylesheets().add(getClass().getResource("colored-toggle.css").toExternalForm());

    stage.setScene(new Scene(layout));
    stage.show();
  }
}

从css样式表中,此命令也可以使用。不需要切换按钮。一旦你按下一个不同的按钮,焦点就会切换到新的

.button:focused{
    -fx-background-color: gray;

我使用JavaFx13,我使用css来实现我的活动按钮状态。这是我的代码(只是部分代码)

控制器:

@FXML
private BorderPane bp;

@FXML
private Button mnu_list;

@FXML
private Button mnu_address;

private Button activeMenu;

// This is my Constructor
public DashboardController() {
    this.activeMenu = null;
}

public void initialize() {

    mnu_list.setOnMouseClicked(
            actionEvent -> this.setActiveMenu(mnu_list, ListController.class)
    );

    mnu_address.setOnMouseClicked(
            actionEvent -> this.setActiveMenu(mnu_address, AddressController.class)
    );
}

private void setActiveMenu(Button s, Class c) {
    if (c != null) {
        // I'm using FXWeaver. Here I'm setting a new fxml to borderpane.
        bp.setCenter(this.fxWeaver.loadView(c));
    }
    if (this.activeMenu != null) {
        this.activeMenu.getStyleClass().removeAll("active");
    }
    s.getStyleClass().add("active");
    this.activeMenu = s;
}
.btn_menu{
    -fx-background-radius: 0px;
    -fx-cursor: hand;
    -fx-alignment: center-left;
}
.btn_accent_color{
    -fx-background-color: #7c4dff;
    -fx-text-fill: #FFFFFF;
}
.btn_accent_color.active{
    -fx-background-color: #aa3bfe;
    -fx-text-fill: #FFFFFF;
}
CSS:

@FXML
private BorderPane bp;

@FXML
private Button mnu_list;

@FXML
private Button mnu_address;

private Button activeMenu;

// This is my Constructor
public DashboardController() {
    this.activeMenu = null;
}

public void initialize() {

    mnu_list.setOnMouseClicked(
            actionEvent -> this.setActiveMenu(mnu_list, ListController.class)
    );

    mnu_address.setOnMouseClicked(
            actionEvent -> this.setActiveMenu(mnu_address, AddressController.class)
    );
}

private void setActiveMenu(Button s, Class c) {
    if (c != null) {
        // I'm using FXWeaver. Here I'm setting a new fxml to borderpane.
        bp.setCenter(this.fxWeaver.loadView(c));
    }
    if (this.activeMenu != null) {
        this.activeMenu.getStyleClass().removeAll("active");
    }
    s.getStyleClass().add("active");
    this.activeMenu = s;
}
.btn_menu{
    -fx-background-radius: 0px;
    -fx-cursor: hand;
    -fx-alignment: center-left;
}
.btn_accent_color{
    -fx-background-color: #7c4dff;
    -fx-text-fill: #FFFFFF;
}
.btn_accent_color.active{
    -fx-background-color: #aa3bfe;
    -fx-text-fill: #FFFFFF;
}
注意:在.fxml文件中-我已将所有菜单按钮类设置为btn_菜单,btn_重音颜色


信息:在这里,我将css类切换(添加和删除)到按钮。(与我们在使用js的网站中所做的相同)

我将更改为使用切换按钮。对于回复延迟,我深表歉意。我将按钮更改为“切换按钮”,并尝试了以下操作,但设置按钮颜色会移除深蓝色光环-即使在我请求对焦时,它也不会出现。如有任何建议,我们将不胜感激<代码>字符串activeButtonStyle=“-fx背景色:淡绿色;”;b、 设置样式(活动按钮样式);b、 requestFocus()使用
-外汇基础:淡绿色而不是
-fx背景色:淡绿色我试过了,但它看起来很深的灰蓝色,而不是淡的蓝绿色。让按钮显示为选中的目的是改变它的默认样式。执行此操作的默认机制是使按钮变暗。我在答案中添加了一些示例代码和样式,这只演示了将所选样式稍微变暗一点,而不是变暗很多。