Question

我需要创建一个这样的登录对话框

图像文件：eyeOn.png，eyeOff.png

要求：

密码（即使我们单击并按住并将鼠标拖动到对话框外的区域，密码仍会显示），当我们释放鼠标时，密码会再次被覆盖。
在显示密码时，眼睛图标为eyeOn。覆盖密码后，眼睛图标为eyeOff。

我刚刚构建了布局。

QGridLayout *mainlogin = new QGridLayout();

QLabel *usernameLabel = new QLabel;
usernameLabel->setWordWrap(true);
usernameLabel->setText("Username");
mainlogin->addWidget(usernameLabel, 0, 0);

QComboBox *usernameLineEdit = new QComboBox;
usernameLineEdit->setEditable(true);
usernameLabel->setBuddy(usernameLineEdit);
mainlogin->addWidget(usernameLineEdit, 0, 1);

QLabel *capslockShow = new QLabel;
capslockShow->setWordWrap(true);
capslockShow->setText(" ");
mainlogin->addWidget(capslockShow, 1, 1);

QLabel *passwordLabel = new QLabel;
passwordLabel->setWordWrap(true);
passwordLabel->setText("Password");
mainlogin->addWidget(passwordLabel, 2, 0);
QLineEdit *passwordLineEdit = new QLineEdit;
passwordLineEdit->setEchoMode(QLineEdit::Password);
QAction *myAction = passwordLineEdit->addAction(QIcon(":/eyeOff.png"), QLineEdit::TrailingPosition);
passwordLabel->setBuddy(passwordLineEdit);
mainlogin->addWidget(passwordLineEdit, 2, 1);

下一步我该怎么做？请帮助我提供代码段。

Answer 1

解决方案是在QAction上添加QLineEdit，这将创建一个QToolButton，我们可以从associatedWidgets()获得它（这是自第一个是与clearButton关联的那个）。已经拥有QToolButton的您必须使用pressed和released信号。

passwordlineedit.h

#ifndef PASSWORDLINEEDIT_H
#define PASSWORDLINEEDIT_H

#include <QAction>
#include <QLineEdit>
#include <QToolButton>

class PasswordLineEdit: public QLineEdit
{
public:
    PasswordLineEdit(QWidget *parent=nullptr);
private slots:
    void onPressed();
    void onReleased();
protected:
    void enterEvent(QEvent *event);
    void leaveEvent(QEvent *event);
    void focusInEvent(QFocusEvent *event);
    void focusOutEvent(QFocusEvent *event);
private:
    QToolButton *button;
};

#endif // PASSWORDLINEEDIT_H

passwordlineedit.cpp

#include "passwordlineedit.h"

PasswordLineEdit::PasswordLineEdit(QWidget *parent):
    QLineEdit(parent)
{
    setEchoMode(QLineEdit::Password);
    QAction *action = addAction(QIcon(":/eyeOff"), QLineEdit::TrailingPosition);
    button = qobject_cast<QToolButton *>(action->associatedWidgets().last());
    button->hide();
    button->setCursor(QCursor(Qt::PointingHandCursor));
    connect(button, &QToolButton::pressed, this, &PasswordLineEdit::onPressed);
    connect(button, &QToolButton::released, this, &PasswordLineEdit::onReleased);
}

void PasswordLineEdit::onPressed(){
    QToolButton *button = qobject_cast<QToolButton *>(sender());
    button->setIcon(QIcon(":/eyeOn"));
    setEchoMode(QLineEdit::Normal);
}

void PasswordLineEdit::onReleased(){
    QToolButton *button = qobject_cast<QToolButton *>(sender());
    button->setIcon(QIcon(":/eyeOff"));
    setEchoMode(QLineEdit::Password);
}

void PasswordLineEdit::enterEvent(QEvent *event){
    button->show();
    QLineEdit::enterEvent(event);
}

void PasswordLineEdit::leaveEvent(QEvent *event){
    button->hide();
    QLineEdit::leaveEvent(event);
}

void PasswordLineEdit::focusInEvent(QFocusEvent *event){
    button->show();
    QLineEdit::focusInEvent(event);
}

void PasswordLineEdit::focusOutEvent(QFocusEvent *event){
    button->hide();
    QLineEdit::focusOutEvent(event);
}

可以从以下link下载完整的示例。

Answer 2

与其尝试使用QAction返回的QLineEdit::addAction，而是将其与合适的事件过滤器结合使用，可能可以使用QWidgetAction。

class eye_spy: public QWidgetAction {
  using super = QWidgetAction;
public:
  explicit eye_spy (QLineEdit *control, QWidget *parent = nullptr)
    : super(parent)
    , m_control(control)
    , m_on(":/eyeOn")
    , m_off(":/eyeOff")
    , m_pixmap_size(50, 50)
    {
      m_label.setScaledContents(true);
      m_control->setEchoMode(QLineEdit::Password);
      m_label.setPixmap(m_off.pixmap(m_pixmap_size));
      m_label.installEventFilter(this);
      setDefaultWidget(&m_label);
    }
protected:
  virtual bool eventFilter (QObject *obj, QEvent *event) override
    {
      if (event->type() == QEvent::MouseButtonPress) {
        m_control->setEchoMode(QLineEdit::Normal);
        m_label.setPixmap(m_on.pixmap(m_pixmap_size));
      } else if (event->type() == QEvent::MouseButtonRelease) {
        m_control->setEchoMode(QLineEdit::Password);
        m_label.setPixmap(m_off.pixmap(m_pixmap_size));
      }
      return(super::eventFilter(obj, event));
    }
private:
  QLineEdit *m_control;
  QLabel     m_label;
  QIcon      m_on;
  QIcon      m_off;
  QSize      m_pixmap_size;
};

现在，而不是...

QAction *myAction = passwordLineEdit->addAction(QIcon(":/eyeOff.png"), QLineEdit::TrailingPosition);

使用...

eye_spy eye_spy(passwordLineEdit);
passwordLineEdit->addAction(&eye_spy, QLineEdit::TrailingPosition);

似乎可以提供所需的行为。

在Qt

2 个答案: