JavaFX按钮

时间:2020-01-09 10:36:34  来源:igfitidea点击:

JavaFX Button控件使JavaFX应用程序可以在应用程序用户单击按钮时执行某些操作。 JavaFX Button控件由类javafx.scene.control.Button表示。 JavaFX按钮上可以带有文本和图标,这些文本和图标向用户指示单击按钮将执行的操作。

创建一个按钮

我们可以通过创建Button类的实例来创建按钮控件。这是一个JavaFXButton实例化示例:

Button button = new Button("My Label");

要在按钮上显示的文本作为参数传递给Button构造函数。

向场景图添加按钮

为了使JavaFXButton可见,必须将按钮对象添加到场景图中。这意味着将其添加到"场景"对象,或者作为添加到"场景"对象的布局的子级。

这是一个将JavaFXButton添加到场景图的示例:

package com.Hyman.javafx.controls;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.stage.Stage;

public class ButtonExperiments extends Application  {

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.setTitle("HBox Experiment 1");

        Button button = new Button("My Button");

        Scene scene = new Scene(button, 200, 100);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

注意,将"按钮"直接添加到"场景"对象中。通常,我们会将"按钮"嵌套在某种布局组件中。为了使示例简单,我在这里省略了该内容。请参阅有关布局组件的教程,以了解它们如何工作。

运行上述JavaFXButton示例的结果是一个看起来像这样的应用程序:

请注意,该按钮占用了窗口中的所有可用空间。因此,很难看到按钮的边缘。将JavaFX按钮添加到布局组件后,我们可以更轻松地看到按钮的边缘。

按钮文字

有两种方法来设置JavaFX按钮的文本。第一种方法是将文本传递给"按钮"构造函数。我们已经在前面的示例中看到了这一点。

设置按钮文本的第二种方法是在Button实例上调用setText()方法。这可以在创建Button实例之后完成。因此,它可以用来更改已经可见的"按钮"的文本。这是一个示例,如何在JavaFXButton上调用setText()的样子:

button.setText("Click me if you dare!");

按钮文字大小

我们可以设置JavaFXButton的文本大小。我们可以使用CSS属性-fx-text-size来实现。此CSS属性在有关Button CSS样式的部分中进行了说明。

按钮文字换行

JavaFXButton控件支持按钮文本的文本换行。文字换行是指如果文字太长而无法在按钮内的一行上显示,则文字会分成多行。

我们可以使用setWrapText()方法在JavaFXButton实例上启用文本换行。 setWrapText()方法采用一个布尔值参数。如果将值true传递给setWrapText(),则启用文本换行。如果将值false传递给setWrapText(),则将禁用文本换行。这是一个在JavaFX按钮上启用文本换行的示例:

button.setWrapText(true);

这是两个JavaFX按钮的屏幕截图,其中两个按钮启用了文本环绕:

按钮图片

可以在按钮文本旁边的按钮内部显示图像。 JavaFXButton类包含一个构造函数,该构造函数可以将Node作为额外参数。这是一个JavaFX标签示例,该示例使用JavaFX ImageView组件将图像添加到按钮:

package com.Hyman.javafx.controls;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.stage.Stage;

import java.io.FileInputStream;

public class ButtonExperiments extends Application  {

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.setTitle("HBox Experiment 1");

        FileInputStream input = new FileInputStream("resources/images/iconmonstr-home-6-48.png");
        Image image = new Image(input);
        ImageView imageView = new ImageView(image);

        Button button = new Button("Home", imageView);

        Scene scene = new Scene(button, 200, 100);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

运行上述JavaFXButton示例的结果是一个看起来像这样的应用程序:

按键尺寸

JavaFX Button类包含一组可用于设置按钮大小的方法。控制按钮大小的方法是:

button.setMinWidth()
button.setMaxWidth()
button.setPrefWidth()

button.setMinHeight()
button.setMaxHeight()
button.setPrefHeight()

button.setMinSize()
button.setMaxSize()
button.setPrefSize()

setMinWidth()和setMaxWidth()方法设置按钮应允许的最小和最大宽度。 setPrefWidth()方法设置按钮的首选宽度。当有足够的空间来显示其首选宽度的按钮时,JavaFX会这样做。如果不是,JavaFX将按比例缩小按钮,直到达到其最小宽度。

setMinHeight()和setMaxHeight()方法设置按钮应允许的最小和最大高度。 setPrefHeight()方法设置按钮的首选高度。当有足够的空间来显示其首选高度的按钮时,JavaFX会这样做。如果不是,JavaFX将按比例缩小按钮,直到达到其最小高度。

setMinSize(),setMaxSize()和setPrefSize()方法可在单个调用中设置按钮的宽度和高度。因此,这些方法同时采用width和height参数。例如,打电话

button.setMaxSize(100, 200);

相当于打电话

button.setMaxWidth(100);
button.setMaxHeight(200);

这是两个JavaFX按钮的屏幕截图。第一个按钮的默认大小是根据其按钮文本和嵌套其中的布局组件计算得出的。第二个按钮的首选宽度为200,高度为48:

按钮事件

为了响应按钮的单击,我们需要将事件侦听器添加到"按钮"对象。看起来是这样的:

button.setOnAction(new EventHandler<ActionEvent>() {
    @Override
    public void handle(ActionEvent actionEvent) {
        //... do something in here.
    }
});

这是使用Java Lambda表达式添加点击事件侦听器的外观:

button.setOnAction(actionEvent ->  {
    //... do something in here.    
});

最后,让我们看一个完整的示例,该示例在单击按钮时更改JavaFX Label的文本:

package com.Hyman.javafx.controls;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class ButtonExperiments extends Application  {

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.setTitle("HBox Experiment 1");

        Label label = new Label("Not clicked");
        Button button = new Button("Click");

        button.setOnAction(value ->  {
           label.setText("Clicked!");
        });

        HBox hbox = new HBox(button, label);

        Scene scene = new Scene(hbox, 200, 100);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

按钮助记符

我们可以在JavaFXButton实例上设置助记符。助记符是键盘键,当与ALT键一起按下时可激活该按钮。因此,助记符是激活按钮的键盘快捷键。稍后,我将说明如何通过其助记键激活按钮。

在按钮文本内指定按钮的助记符。通过在要设置为该键的助记符的按钮文本中的字符前面放置下划线字符(_),可以标记将哪个键用作助记键。下划线字符将不会显示在按钮文本中。这是为按钮设置助记符的示例:

button.setMnemonicParsing(true);

button.setText("_Click");

注意,必须首先在按钮上调用setMnemonicParsing(),其值为'true'。这指示按钮解析按钮文本中的助记符。如果我们使用" false"的值来调用此方法,则按钮文本中的下划线字符将仅显示为文本,而不会被解释为助记符。

第二行在按钮上设置文本"_Click"。这告诉按钮使用键" c"作为助记符。助记符不区分大小写,因此不必是大写的C来激活按钮。

要激活该按钮,我们现在可以按ALT-C(同时按下两个)。这将激活该按钮,就像我们用鼠标单击它一样。

我们也可以先按一次ALT键。这将在按钮文本中显示按钮的助记符。然后,我们可以按c键。如果我们按ALT,然后再按ALT,则将首先显示该助记符,然后再次将其隐藏。当助记符可见时,我们可以仅使用助记键来激活按钮,而无需同时按下ALT。如果看不到助记符,则必须同时按ALT和助记键才能激活该按钮。

这是两个屏幕快照,显示了助记符不可见和可见时的外观:

按钮CSS样式

我们可以使用CSS样式来设置JavaFX按钮的样式。 JavaFXButton控件支持以下CSS样式:

-fx-border-width
-fx-border-color
-fx-background-color
-fx-font-size
-fx-text-fill

这是将JavaFX按钮的背景色设置为红色的示例:

Button button = new Button("My Button");

button.setStyle("-fx-background-color: #ff0000; ");

此示例通过setStyle()方法直接在按钮上设置样式,但是我们也可以通过样式表为JavaFX按钮设置样式。有关将CSS样式表与JavaFX结合使用的更多信息,请参见我的JavaFX CSS样式教程。

这是一个JavaFX按钮示例,它创建了4个不同的按钮。每个按钮上均设置了CSS样式。在代码示例之后,我提供了屏幕截图,显示了按钮在给定样式下的外观。

package com.Hyman.javafx.controls;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

import java.io.FileInputStream;
import java.io.FileNotFoundException;

public class ButtonExperiments extends Application  {

    @Override
    public void start(Stage primaryStage) throws Exception {
        primaryStage.setTitle("Button Experiment 1");

        Button button1 = new Button("Button 1");
        Button button2 = new Button("Button 2");
        Button button3 = new Button("Button 3");
        Button button4 = new Button("Button 4");

        button1.setStyle("-fx-border-color: #ff0000; -fx-border-width: 5px;");
        button2.setStyle("-fx-background-color: #00ff00");
        button3.setStyle("-fx-font-size: 2em; ");
        button4.setStyle("-fx-text-fill: #0000ff");

        HBox hbox = new HBox(button1, button2, button3, button4);

        Scene scene = new Scene(hbox, 400, 100);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

这是4个JavaFX按钮及其CSS样式的屏幕截图:

第一个按钮同时设置了-fx-border-width和-fx-border-color CSS属性。这将导致按钮的5像素宽的红色边框。

第二个按钮具有-fx-background-colorCSS属性集。这将导致按钮的绿色背景色。

第三个按钮设置了-fx-font-size CSS属性。这将导致按钮的文本大小是普通文本的2倍。

第四个按钮设置了-fx-text-fill CSS属性。这将导致按钮带有蓝色的文本颜色。

我们可以简单地通过在JavaFX按钮上设置多个CSS属性来组合CSS样式,就像上面示例中的第一个按钮一样。

禁用按钮

我们可以通过JavaFX Button的setDisable()方法禁用它。 setDisable()方法采用一个布尔值参数,该参数指定是否应禁用按钮。值为" true"表示按钮将被禁用,值为" false"表示按钮不会被禁用(意味着已启用)。这是一个通过其setDisable()方法禁用JavaFX Button的示例:

Button button = new Button();
button.setText("Click me!");

// here the app is running, and something happens so
// the button should now be disabled.

button.setDisable(true);

// again the app runs, and something happens so
// the button should now be enabled again.

button.setDisable(false);