仅在用户开始输入时清除 JavaFX TextField 中的提示文本 [英] Clear prompt text in JavaFX TextField only when user starts typing

查看:24
本文介绍了仅在用户开始输入时清除 JavaFX TextField 中的提示文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

默认行为是字段中的提示文本在字段获得焦点时被擦除.那是标记在现场的时候.

是否可以将文本字段配置为仅在用户开始输入时删除提示文本?

否则我需要在每个文本字段旁边/上方添加一个标签,以描述其中的值.

解决方案

解决方案

此示例将允许 JavaFX 中的 TextFields,其提示行为是在字段为空时显示提示,即使该字段具有焦点.解决方案是结合自定义 CSS 和自定义 TextField 类,该类操作 TextField 的 css 样式.

persistent-prompt.css

.persistent-prompt:focused {-fx-prompt-text-fill: 派生 (-fx-control-inner-background,-30%);}.无提示{-fx-prompt-text-fill:透明!重要;}

PersistentPromptTextField.java

import javafx.scene.control.TextField;公共类 PersistentPromptTextField 扩展了 TextField {PersistentPromptTextField(字符串文本,字符串提示){超级(文本);设置提示文本(提示);getStyleClass().add("persistent-prompt");refreshPromptVisibility();textProperty().addListener(observable -> refreshPromptVisibility());}私人无效refreshPromptVisibility(){最终字符串文本 = getText();如果(isEmptyString(文本)){getStyleClass().remove("无提示");} 别的 {if (!getStyleClass().contains("no-prompt")) {getStyleClass().add("无提示");}}}私人布尔 isEmptyString(字符串文本){返回文本 == 空 ||text.isEmpty();}}

PromptChanger.java

import javafx.application.Application;导入 javafx.geometry.Insets;导入 javafx.scene.Scene;导入 javafx.scene.control.TextField;导入 javafx.scene.layout.VBox;导入 javafx.stage.Stage;公共类 PromptChanger 扩展应用程序 {@覆盖公共无效开始(阶段阶段)抛出异常{TextField textField1 = new PersistentPromptTextField("", "名字");TextField textField2 = new PersistentPromptTextField("", "Last name");VBox 布局 = 新 VBox(10、文本字段1,文本字段2);layout.setPadding(new Insets(10));场景场景 = 新场景(布局);场景.getStylesheets().add(getClass().getResource(持久提示.css").toExternalForm());stage.setScene(场景);舞台表演();}公共静态无效主(字符串 [] args){Application.launch(args);}}

JavaFX 8 当前如何实现提示处理

用于控制提示文本的 JavaFX 8 (modena.css) 的默认 CSS 如下:

.text-input {-fx-prompt-text-fill: 派生 (-fx-control-inner-background,-30%);}.text-input:focused {-fx-prompt-text-fill:透明;}

当一个字段被聚焦时,这将使提示文本透明,即使该字段中没有数据.

与 HTML 的比较

HTML 输入有一个

The default behaviour is that the prompt text in the field is erased as the field is being focused. That is when the marker is in the field.

Is it possible to configure the textfield so the prompt text is only erased when the user have started typing?

Otherwise I need to add a label beside/over each textfield for description of the value in it.

解决方案

Solution

This example will allow TextFields in JavaFX whose prompt behaviour is to show the prompt when the field is empty, even if the field has focus. The solution is a combination of custom CSS and a custom TextField class, which manipulates the css styles of the TextField.

persistent-prompt.css

.persistent-prompt:focused {
    -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%);
}
.no-prompt {
    -fx-prompt-text-fill: transparent !important;
}

PersistentPromptTextField.java

import javafx.scene.control.TextField;

public class PersistentPromptTextField extends TextField {
    PersistentPromptTextField(String text, String prompt) {
        super(text);
        setPromptText(prompt);
        getStyleClass().add("persistent-prompt");
        refreshPromptVisibility();

        textProperty().addListener(observable -> refreshPromptVisibility());
    }

    private void refreshPromptVisibility() {
        final String text = getText();
        if (isEmptyString(text)) {
            getStyleClass().remove("no-prompt");
        } else {
            if (!getStyleClass().contains("no-prompt")) {
                getStyleClass().add("no-prompt");
            }
        }
    }

    private boolean isEmptyString(String text) {
        return text == null || text.isEmpty();
    }
}

PromptChanger.java

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class PromptChanger extends Application {
    @Override
    public void start(Stage stage) throws Exception {
        TextField textField1 = new PersistentPromptTextField("", "First name");
        TextField textField2 = new PersistentPromptTextField("", "Last name");

        VBox layout = new VBox(
                10,
                textField1,
                textField2
        );
        layout.setPadding(new Insets(10));

        Scene scene = new Scene(layout);
        scene.getStylesheets().add(
                getClass().getResource(
                        "persistent-prompt.css"
                ).toExternalForm()
        );
        stage.setScene(scene);
        stage.show();
    }

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

How prompt handling is currently implemented in JavaFX 8

Default CSS for JavaFX 8 (modena.css) for controlling the prompt text is as follows:

.text-input {
    -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%);
}
.text-input:focused {
    -fx-prompt-text-fill: transparent;
}

This will make the prompt text transparent whenever a field is focused, even if the field has no data in it.

In Comparison to HTML

HTML input has a placeholder, which is specified as follows:

User agents should present this hint to the user . . . when the element's value is the empty string or the control is not focused (or both).

You can try this functionality in your browser at this test link.

I think the argument against this behaviour for JavaFX "Prompt text should be cleared when focus is grabbed to signal readiness to receiving user input" is moot because focused text fields get a clearly visible focus ring, so the user knows that the control is ready to receive input even when the prompt text is displayed.

I think JavaFX should by default operate the same way as most HTML user agents in this respect. Feel free to create a Tweak request in the JavaFX issue tracker to request that the input prompt in JavaFX work similarly to HTML implementations (if there isn't an issue created for this already).

Alternative

The third party Gluon Glisten has a custom TextField control can have the following attributes:

  • Float Text- A place holder text inside a TextField which is transitioned to the top of the TextField when focus is received by it.

The nice thing about the Glisten based TextField is that the prompt text is always visible, whether or not the user has typed anything into the control.

这篇关于仅在用户开始输入时清除 JavaFX TextField 中的提示文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆