javaFx的标签与输入框

最新推荐文章于 2024-05-23 09:07:37 发布

吃西瓜不吐西瓜籽

最新推荐文章于 2024-05-23 09:07:37 发布

阅读量2.2k

点赞数 2

文章标签： javafx

本文链接：https://blog.csdn.net/qq_40747974/article/details/118103317

版权

标签其实没什么可以说的，这里就主要说一下输入框。输入框是人机交互的一个非常重要的方式。最常见的就是登录/注册界面，账号密码的输入。注册界面账号密码的输入，需要获取输入框的内容与数据库进行对比，是否存在重复账号、密码是否设置过于简单等等。这里先做一个简单的示例。

public class JavaFxNote extends Application {
    public static void main(String[] args)
    {
//        调用launch方法启动应用
     launch(args);
    }
    @Override
    public void start(Stage primaryStage) throws Exception {

        Group group =new Group();
//        容器添加子组件

//        指定一个布局类或者根结点
        Scene scene = new Scene(group);

        primaryStage.setScene(scene);
        primaryStage.setTitle("骏杰小程序");
        primaryStage.setHeight(400);
        primaryStage.setWidth(400);

        TextField text = new TextField();
//        text.setText("输入框");

        text.setLayoutX(100);
        text.setLayoutY(100);

//        设置提示
        Tooltip tip = new Tooltip("输入账号");
        text.setTooltip(tip);

//        设置文本框背景提示，需要去除焦点，并去除文本框文字
        text.setPromptText("请输入10位账号");
        text.setFocusTraversable(false);

//        设置输入限制，对应上面的背景提示
        text.textProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
//                判断新值是否大于10，
//                大于10则显示旧值，
//                小于10显示新值
                if(newValue.length()>10){
                    text.setText(oldValue);
                }
            }
        });

//        监听文本框内选择的文字
        text.selectedTextProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
                System.out.println(newValue);
            }
        });

//        密码框
        PasswordField pt = new PasswordField();
        pt.setLayoutX(100);
        pt.setLayoutY(200);

//       设置提示
        Tooltip tip2 = new Tooltip("输入密码");
        pt.setTooltip(tip2);

//      设置文本框背景提示，需要去除焦点，并去除文本框文字
        pt.setPromptText("请输入含英文和数字的10位密码");
        pt.setFocusTraversable(false);
//        设置输入限制，对应上面的背景提示
        pt.textProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
//                判断新值是否大于10，
//                大于10则显示旧值，
//                小于10显示新值
                if(newValue.length()>10){
                    pt.setText(oldValue);
                }
            }
        });

        Label label1 = new Label("账号");
        label1.setLayoutX(60);
        label1.setLayoutY(105);
        Label label2 = new Label("密码");
        label2.setLayoutX(60);
        label2.setLayoutY(205);

        group.getChildren().addAll(text,pt,label1,label2);
        primaryStage.show();
    }
}

运行后的效果如下：

这里的示例比较简单，监听器里的操作也是比较基础的。账号输入框这里，可以在监听change方法里将输入框里的值拿到数据库进行查询，如果返回为空，可以在输入框后设置标签，设置提示内容“此账号可注册”之类的。如果返回不为空，那么标签的提示内容则可以设置成“此账号已被注册”之类的，这都是比较常见的。账号在我们常见的页面还有其他限制，像什么必须字母加数字啊，不输入中文的，这个可以用正则表达式来进行限制。

还有就是密码输入框，密码输入框在注册时比较常见的是在后面有三条密码强度信号，当你的密码强度达到一定的级别，会亮不同的颜色。这个也是在监听change方法里可以实现的。获取到密码输入框的内容，和正则表达式进行比较，再对密码强度信号标签设置颜色即可。这里我简单的做了个示例：


import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Group;
import javafx.scene.control.Label;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.scene.control.Tooltip;
import javafx.scene.layout.Background;
import javafx.scene.layout.BackgroundFill;
import javafx.scene.paint.Paint;
import javafx.stage.Stage;
import javafx.scene.Scene;


public class JavaFxNote extends Application {
    public static void main(String[] args)
    {
//        调用launch方法启动应用
        launch(args);
    }
    @Override
    public void start(Stage primaryStage) throws Exception {

        Group group =new Group();
//        容器添加子组件

//        指定一个布局类或者根结点
        Scene scene = new Scene(group);

        primaryStage.setScene(scene);
        primaryStage.setTitle("骏杰小程序");
        primaryStage.setHeight(500);
        primaryStage.setWidth(500);

        TextField text = new TextField();
//        text.setText("输入框");

        text.setLayoutX(100);
        text.setLayoutY(100);

//        设置提示
        Tooltip tip = new Tooltip("输入账号");
        text.setTooltip(tip);

//        设置文本框背景提示，需要去除焦点，并去除文本框文字
        text.setPromptText("请输入10位账号");
        text.setFocusTraversable(false);

//        设置输入限制，对应上面的背景提示
        text.textProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
//                判断新值是否大于10，
//                大于10则显示旧值，
//                小于10显示新值
                if(newValue.length()>10){
                    text.setText(oldValue);
                }
            }
        });

//        监听文本框内选择的文字
        text.selectedTextProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
                System.out.println(newValue);
            }
        });

//        密码框
        PasswordField pt = new PasswordField();
        pt.setLayoutX(100);
        pt.setLayoutY(200);

//        放置密码强度组件的容器
        Group gropTip = new Group();

//       设置提示
        Tooltip tip2 = new Tooltip("输入密码");
        pt.setTooltip(tip2);

//      设置文本框背景提示，需要去除焦点，并去除文本框文字
        pt.setPromptText("请输入含英文和数字的10位密码");
        pt.setFocusTraversable(false);
//        设置输入限制，对应上面的背景提示
        pt.textProperty().addListener(new ChangeListener<String>() {
            @Override
            public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {
//                判断新值是否大于10，
//                大于10则显示旧值，
//                小于10显示新值
                if(newValue.length()>10){
                    pt.setText(oldValue);
                }
//                清除密码强度组件
                gropTip.getChildren().clear();
                Label labelTip = new Label("密码强度");
                Label labelLow = new Label(" ");
                labelLow.setLayoutX(60);
                labelLow.setLayoutY(0);
                labelLow.setScaleY(0.6);//对第一个强度信号标签的高度进行缩放
                Label labelMid = new Label(" ");
                labelMid.setLayoutX(65);
                labelMid.setLayoutY(-1.5);
                labelMid.setScaleY(0.8);//对第二个强度信号标签的高度进行缩放
                Label labelHigh = new Label(" ");
                labelHigh.setLayoutX(70);
                labelHigh.setLayoutY(-3);
                gropTip.getChildren().addAll(labelTip,labelLow,labelMid,labelHigh);
//                灰色背景色
                BackgroundFill bgf2 = new BackgroundFill(Paint.valueOf("#d3d7d4"),null,null);
                Background bg2 = new Background(bgf2);
                String patternNumt = "[0-9]*";
                String patternS ="[a-zA-Z]*";
                String pattern2 =".*\\d+.*";
                String pattern3 =".*[a-zA-Z]+.*";
                String pattern4 =".*[~!@#$%^&*()_+|<>,.?/:;'\\[\\]{}\"]+.*";
                if(pt.getText().matches(patternNumt) || pt.getText().matches(patternS)){
//                    红色背景色，密码强度最低，密码只包含数字或只包含字母
                    BackgroundFill bgf = new BackgroundFill(Paint.valueOf("#d71345"),null,null);
                    Background bg = new Background(bgf);
                    labelLow.setBackground(bg);
                    labelMid.setBackground(bg2);
                    labelHigh.setBackground(bg2);
                }else if(pt.getText().matches(pattern4) && pt.getText().matches(pattern3) && pt.getText().matches(pattern2)){
//                    绿色背景色，密码强度最高，密码包含数字字母以及特殊字符
                    BackgroundFill bgf = new BackgroundFill(Paint.valueOf("#45b97c"),null,null);
                    Background bg = new Background(bgf);
                    labelLow.setBackground(bg);
                    labelMid.setBackground(bg);
                    labelHigh.setBackground(bg);
                }else{
//                    黄色背景色，密码强度中等，密码包含数字字母特殊字符中的两种
                    BackgroundFill bgf = new BackgroundFill(Paint.valueOf("#ffd400"),null,null);
                    Background bg = new Background(bgf);
                    labelLow.setBackground(bg);
                    labelMid.setBackground(bg);
                    labelHigh.setBackground(bg2);
                }
//                如果密码框为空，也清除密码强度组件
                if(pt.getText()==null || pt.getText().equals("")){
                    gropTip.getChildren().clear();
                }
            }
        });

        Label label1 = new Label("账号");
        label1.setLayoutX(60);
        label1.setLayoutY(105);
        Label label2 = new Label("密码");
        label2.setLayoutX(60);
        label2.setLayoutY(205);
        gropTip.setLayoutX(280);
        gropTip.setLayoutY(205);

        group.getChildren().addAll(text,pt,label1,label2,gropTip);
        primaryStage.show();
    }
}

注释写得很清楚，这里就不多解释了。运行效果如下：

密码强度弱

密码强度中等

密码强度强

学习javafx的资料比较少，视频学习推荐哔哩哔哩搜索up主：Aimls，或者加入扣扣群里学习：一群 456378454 ，二群：464362636

吃西瓜不吐西瓜籽

关注

2
点赞
踩
37

收藏

觉得还不错? 一键收藏
打赏
0
评论
javaFx的标签与输入框

标签其实没什么可以说的，这里就主要说一下输入框。输入框是人机交互的一个非常重要的方式。最常见的就是登录/注册界面，账号密码的输入。注册界面账号密码的输入，需要获取输入框的内容与数据库进行对比，是否存在重复账号、密码是否设置过于简单等等。这里先做一个简单的示例。public class JavaFxNote extends Application { public static void main(String[] args) {// 调用launch方法启动...
复制链接

扫一扫