（翻译）第二十四回 JavaFX2.0 提示条ToolTip

原文地址http://download.oracle.com/javafx/2.0/ui_controls/tooltip.htm#BABBIJBJ

 

 

Tooltip类产生一个常见的UI控件，一般用来为UI控件添加信息。把鼠标放在控件上提示条就显示出来。任何控件使用 setTooltip方法都能添加提示条。

提示条有2个状态：激活的和显示的。当鼠标放置在控件上时提示条激活，当它显示出来就是“显示的”状态，显示的提示条也是激活的。在提示条激活和显示之间有一些延迟。

带有提示条的密码框见Figure 18-1 .

Figure 18-1 Tooltip Added to a Password Field

Description of "Figure 18-1 Tooltip Added to a Password Field"

创建Tooltip

研究 Example 18-1 中的代码，它创建的是上面的应用。

 

Example 18-1 Adding a Tooltip to the Password Field

final PasswordField pf = new PasswordField();
final Tooltip tooltip = new Tooltip();
tooltip.setText(
    "\nYour password must be\n" +
    "at least 8 characters in length\n"  +
);
pf.setTooltip(tooltip);

 

javafx.scene.control包中的每个控件都具有添加提示条的 setTooltip 方法。可以定义文本，使用Tooltip的构造方法或 setText 方法 。

由于 Tooltip 类继承了Labeled 类，所以不仅可以添加文本，也可以添加图形。 Example 18-2 中的代码块为密码框的提示条添加了图标。

 

Example 18-2 Adding an Icon to a Tooltip

Image image = new Image(
    getClass().getResourceAsStream("warn.png")
);
tooltip.setGraphic(new ImageView(image));

 

运行效果见 Figure 18-2

Figure 18-2 Tooltip with an Icon

Description of "Figure 18-2 Tooltip with an Icon"

提示条不仅能提供辅助信息，也能呈现数据。

在提示条中呈现数据

 Figure 18-3 中的应用使用显示在提示条中的信息来计算酒店住宿的总费用。

 

Figure 18-3 Calculating Hotel Rates

Description of "Figure 18-3 Calculating Hotel Rates"

 

Each checkbox is accompanied by a tooltip.每个复选框有一个提示条，每个提示条显示一个特定预定项目的费用。如果用户选择了复选框，相应的值就加到总数中。当然取消选中后也会从总数中减去。

看下该应用的代码Example 18-3 .

Example 18-3 Using Tooltips to Calculate Hotel Rates

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.CheckBox;
import javafx.scene.control.Label;
import javafx.scene.control.Tooltip;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
 
 
public class Main extends Application {
 
    final static String[] rooms = new String[]{
        "Accommodation (BB)",
        "Half Board",
        "Late Check-out",
        "Extra Bed"
    };
    final static Integer[] rates = new Integer[]{
        100, 20, 10, 30
    };
    final CheckBox[] cbs = new CheckBox[rooms.length];
    final Label total = new Label("Total: $0");
    Integer sum = 0;
 
    public static void main(String[] args) {
        launch(args);
    }
 
    @Override
    public void start(Stage stage) {
        Scene scene = new Scene(new Group());
        stage.setTitle("Tooltip Sample");
        stage.setWidth(300);
        stage.setHeight(150);
 
        total.setFont(new Font("Arial", 20));
        
        for (int i = 0; i < rooms.length; i++) {
            final CheckBox cb = cbs[i] = new CheckBox(rooms[i]);
            final Integer rate = rates[i];
            final Tooltip tooltip = new Tooltip("$" + rates[i].toString());
            tooltip.setFont(new Font("Arial", 16));
            cb.setTooltip(tooltip);
            cb.selectedProperty().addListener(new ChangeListener() {
                public void changed(ObservableValue ov,
                    Boolean old_val, Boolean new_val) {
                    if (cb.isSelected()) {
                        sum = sum + rate;
                    } else {
                        sum = sum - rate;
                    }
                    total.setText("Total: $" + sum.toString());
                }
            });
        }
 
        VBox vbox = new VBox();
        vbox.getChildren().addAll(cbs);
        vbox.setSpacing(5);
        HBox root = new HBox();
        root.getChildren().add(vbox);
        root.getChildren().add(total);
        root.setSpacing(40);
        root.setPadding(new Insets(20, 10, 10, 20));
 
        ((Group) scene.getRoot()).getChildren().add(root);
 
        stage.setScene(scene);
        stage.show();
    }
}

 Example 18-4 中的代码加入到 Example 18-3 中来创建一个提示条并分配了一个文本。项目价格的Integer 值被转化成了String 值。

Example 18-4 Setting the Value for a Tooltip

final Tooltip tooltip = new Tooltip("$" + rates[i].toString())

可以通过使用CSS来改变其外观。