【问题标题】:Button color change in javafxjavafx中的按钮颜色变化
【发布时间】:2018-08-15 09:54:28
【问题描述】:

这是我绘制巴士座位的代码。每个Button 代表在GridPane 中绘制的一个席位。当有人点击座位时,我想将座位颜色从绿色更改为黄色。到目前为止,我已经做到了。如果我单击按钮,它会在输出窗口中打印“hellow world”。但是 UI 中的按钮颜色不会改变。这是我的代码:

public static GridPane drawBus(int rows, int col, String ss){
    GridPane table = new GridPane();
    table.setHgap(5);
    table.setVgap(5);
    table.setAlignment(Pos.CENTER);
    String seatName;

    if(ss.equals("ROW WISE")||ss.equals("Row Wise")||ss.equals("row wise")){
    for(int i=0; i<rows; i++){

        for(int j=0;j<col; j++)
        {
        seat=new Button();
        seat.setAlignment(Pos.CENTER);
        seat.setPrefSize(80, 31);

        seatName=numToString(i+1)+(j+1);
        seat.setText(seatName);
        seat.setStyle("-fx-background-color: MediumSeaGreen");


        seat.setOnAction(new EventHandler<ActionEvent>() {
        @Override
        public void handle(ActionEvent event) {

            seat.setStyle("-fx-background-color: Yellow");
            System.out.println("Hello World!");

        }
        });

        busSeatList.put(seatName, 0);

        //add them to the GridPane
        table.add(seat, j, i); //  (child, columnIndex, rowIndex)

     }


    }
    }
    else
    {
      for(int i=0; i<rows; i++){

        for(int j=0;j<col; j++)
        {
        seat=new Button();
        seat.setAlignment(Pos.CENTER);
        seat.setPrefSize(80, 31);

        seatName=(i+1)+numToString(j+1);
        seat.setText(seatName);
        seat.setStyle("-fx-background-color: MediumSeaGreen");


        seat.setOnAction(new EventHandler<ActionEvent>() {
        @Override
        public void handle(ActionEvent event) {
            System.out.println("Hello World!");
            //seat.setStyle("-fx-background-color: Yellow");

        }
        });



        busSeatList.put(seatName, 0);
        //add them to the GridPane
        table.add(seat, j, i); //  (child, columnIndex, rowIndex)


       }


    }


    }


    return table;
}

【问题讨论】:

  • 使用“魔术字符串”不是一个好主意。最好使用枚举。这样编译器会抱怨拼写错误,使代码更容易维护......

标签: java user-interface button javafx


【解决方案1】:

我对动态样式的建议是使用自定义 PseudoClass 和 css:

代码中的伪类:

public static final PseudoClass PSEUDO_CLASS_FOO = PseudoClass.getPseudoClass("foo");

// ... then in your creation method
// Note using java8 lambda is more concise:
seat.setOnAction(event->{
        System.out.println("Hello World!");
       seat.pseudoClassStateChanged(PSEUDO_CLASS_FOO, true);

    });

在你的 CSS 中:

Button:foo {
    -fx-background-color: yellow;
}

【讨论】:

    【解决方案2】:

    使用已经实现此功能的类并使用样式表会更容易。 ToggleButton 是一个适合你需要的类:

    ToggleButton btn = new ToggleButton("Say 'Hello World'");
    btn.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });
    
    ...
    scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
    

    style.css

    .toggle-button {
        -fx-background-color: green;
    }
    
    .toggle-button:selected {
        -fx-background-color: yellow;
    }
    

    顺便说一句:您的代码中的问题可能是使用字段 (seat) 来存储按钮。这样,如果您按下 any 按钮,最后创建的将始终是修改的。如果您想继续使用您的实现,请改用在内部循环中声明的 final 局部变量。

    【讨论】:

    • 非常感谢。对于我使用final 局部变量的实现对我有用。这个函数在我的testControllerClass for test fxml 文件中。我需要从Style.css 类获取资源。
    • @WaliurRahman 您需要确保它在运行时包含在类路径中,并与包含代码的类的类文件放在同一目录中。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-25
    • 1970-01-01
    • 2017-04-11
    • 2013-04-27
    • 2021-05-29
    相关资源
    最近更新 更多