南山建网站公司深圳网络推广

“眨眼睛查看密码”工具类实现思路：

---

一、核心功能

实现点击眼睛图标切换密码明文/星号显示，提升表单输入体验。包含以下关键功能：
• 初始状态：密码框显示为星号，闭眼图标可见。
• 点击闭眼图标：切换为明文显示，睁眼图标可见。
• 点击睁眼图标：恢复星号显示，闭眼图标可见。

---

二、组件准备

1. 两个输入框
   • PasswordField：默认显示星号的密码输入框。
   • TextField：显示明文的文本框（初始隐藏）。
2. 两个图标控件
   • ImageView openEye：睁眼图标（初始隐藏）。
   • ImageView closeEye：闭眼图标（初始显示）。

---

三、实现步骤

1. 初始化状态

• 隐藏明文框：visiblePasswordField.setVisible(false)
• 显示密码框：passwordField.setVisible(true)
• 图标状态：显示闭眼图标，隐藏睁眼图标。

2. 事件绑定

• 监听两个图标的点击事件：无论点击哪个图标，触发切换逻辑。

openEye.setOnMouseClicked(e -> handleOpenEye());
closeEye.setOnMouseClicked(e -> handleOpenEye());

3. 切换逻辑实现

• 判断当前显示状态：根据明文框是否可见决定下一步动作。

boolean isPasswordVisible = visiblePasswordField.isVisible();

• 切换到明文显示：
• 将密码框内容复制到明文框：visiblePasswordField.setText(passwordField.getText())
• 显示明文框，隐藏密码框。
• 切换图标状态：显示睁眼，隐藏闭眼。
• 切换到星号显示：
• 将明文内容复制回密码框：passwordField.setText(visiblePasswordField.getText())
• 显示密码框，隐藏明文框。
• 切换图标状态：显示闭眼，隐藏睁眼。

---

四、关键问题处理

• 文本同步：切换时同步内容，避免切换后数据不一致。
• 焦点管理：切换时保持输入焦点，避免用户需要重新点击输入框。
• 空值处理：确保null或空字符串时不会抛出异常。

---

五、优化建议

• 双向绑定（可选）：
使用JavaFX属性绑定，实现两个输入框内容实时同步，避免手动复制。

visiblePasswordField.textProperty().bindBidirectional(passwordField.textProperty());

• 图标样式：
添加CSS悬浮效果（如手指光标），提升用户体验。
• 输入监听：
限制明文框的输入类型（如仅允许特定字符）。

---

六、使用示例

// 在FXML控制器中初始化工具类
ExchangeEyeTUtil eyeUtil = new ExchangeEyeTUtil(visiblePwdField, passwordField, openEyeIcon, closeEyeIcon
);

---

总结：该工具类通过状态切换和事件监听，实现密码可见性控制，核心在于正确处理组件显示/隐藏状态及内容同步。开发者可结合具体需求进行扩展优化。

package com.example.demo6.util;import javafx.fxml.FXML;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.scene.image.ImageView;public class ExchangeEyeTUtil {private final TextField visiblePasswordField;private final PasswordField passwordField;private final ImageView openEye;private final ImageView closeEye;public ExchangeEyeTUtil(TextField visiblePasswordField, PasswordField passwordField, ImageView openEye, ImageView closeEye) {this.visiblePasswordField = visiblePasswordField;this.passwordField = passwordField;this.openEye = openEye;this.closeEye = closeEye;// 初始状态设置initialize();}@FXMLprivate void initialize() {// 初始化时隐藏明文输入框和睁眼图标visiblePasswordField.setVisible(false);openEye.setVisible(false);closeEye.setVisible(true);}@FXMLpublic void handleOpenEye() {// 判断当前是否显示明文boolean isPasswordVisible = visiblePasswordField.isVisible();if (isPasswordVisible) {// 切换到密码隐藏状态passwordField.setText(visiblePasswordField.getText());passwordField.setVisible(true);visiblePasswordField.setVisible(false);openEye.setVisible(false);closeEye.setVisible(true);} else {// 切换到明文显示状态visiblePasswordField.setText(passwordField.getText());visiblePasswordField.setVisible(true);passwordField.setVisible(false);openEye.setVisible(true);closeEye.setVisible(false);}}
}