image - 关于带有小图标的 TextField

Question

我想用图标编写一个 TextField 组件。
所以行为如下:

如果 TextField 包含一个空字符串，我使用“lens.png”。

否则，我使用“cross.png”。

使用 JavaFX 场景生成器，我在堆栈 Pane 中添加了一个 TextFiled 和一个 ImageView。
我的代码如下:

    @FXML
    private TextField textSearch;
    @FXML
    private ImageView imageView;
    final Image lensIcon = new Image("/issue/images/lens.png");
    final Image crossIcon = new Image("/issue/images/cross.png");

    //initialize () method 
     textSearch.textProperty().addListener(obs -> {
            final String text = textSearch.getText();
            Image icon = (text==null || text.isEmpty()) ? lensIcon : crossIcon;
            imageView.setImage(icon);
            imageView.setMouseTransparent(icon == lensIcon);
        }
        );
        imageView.setOnMouseClicked(evt -> textSearch.setText(null));

我的问题如下:
如何防止在图标(ImageView)下方写入字符。下图说明了我的问题。

Answer 1

ControlsFX是一个 JavaFX API，它提供了大量的高级控件 UI，这些 UI 没有随 JavaFX 一起提供。
ControlsFX - http://fxexperience.com/controlsfx/
FontAwesomeFX提供数百个图标(例如 cross 在您上面的例子中)
FontAwesomeFX - https://bitbucket.org/Jerady/fontawesomefx/downloads/

在导入这两个很棒的 AP​​I 后，这是一个演示解决方案

public class TextFields_Demo extends Application {

    private Parent createContent() {
        Pane root = new Pane();
        CustomTextField customTextField = new CustomTextField();
        FontAwesomeIconView icon = new FontAwesomeIconView(FontAwesomeIcon.CLOSE);
        customTextField.setRight(icon);
        root.getChildren().add(customTextField);
        return root;
    }

    @Override
    public void start(Stage primaryStage) {
        Scene scene = new Scene(createContent());
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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