带有自定义按钮的QLineEdit

Question

我需要实现一个具有工具按钮的LineEdit小部件，并将其放置在文本区域的右端。我知道两种方法，但这两种解决方案都不好看。

1) 将工具按钮作为QLineEdit的子部件添加，并处理resizeEvent以正确定位它们。主要缺点是如果文本太长，则可能出现在工具按钮下面。

2) 另一种解决方案是将行编辑器和按钮放在框架中，并覆盖样式以隐藏lineEdits框架并使QFrame看起来像QLineEdit。

我需要最佳方式来实现这样的小部件。同时，我的小部件应该具有样式感知能力。

- ArmanHunanyan

---

你想在QLineEdit中添加多个QToolButton吗？ - Maxim Makhun

现在我只需要添加一个，但将来可能会有两个或更多。 - ArmanHunanyan

我在下面发布了我的解决方案。那里使用了ResizeEvent。此外，您可以使用QSS样式化QLineEdit，因此我认为这将是一个足够的起点。 - Maxim Makhun

Answer 1

从Qt 5.2开始，可以使用QLineEdit::addAction(...)插入自定义按钮。（Qt文档）

例如（假设我们在MyClass的定义内部）：

QLineEdit *myLineEdit = new QLineEdit(this);
QAction *myAction = myLineEdit->addAction(QIcon("test.png"), QLineEdit::TrailingPosition);
connect(myAction, &QAction::triggered, this, &MyClass::onActionTriggered);

- Moritz Jasper

---

这个。此外还有清除按钮的便利性（setClearButtonEnabled）。 - peppe

我在PyQt5上尝试了这个实现，它可以工作！但是图标大小可能无法扩展！ - Tuhin Mitra

Answer 2

原始博客文章已经消失了，但Trolltech曾经发布了一个Qt 4的清除按钮示例。

结果

没有文本的行编辑：

带有一些文本的行编辑（按钮出现）：

文本输入框充满文字（不会遮盖按钮）：

源代码

lineedit.h

/****************************************************************************
**
** Copyright (c) 2007 Trolltech ASA <[e-mail]>
**
** Use, modification and distribution is allowed without limitation,
** warranty, liability or support of any kind.
**        
****************************************************************************/

#ifndef LINEEDIT_H
#define LINEEDIT_H

#include <QLineEdit>

class QToolButton;

class LineEdit : public QLineEdit
{
    Q_OBJECT

public:
    LineEdit(QWidget *parent = 0);

protected:
    void resizeEvent(QResizeEvent *);

private slots:
    void updateCloseButton(const QString &text);

private:
    QToolButton *clearButton;
};

#endif // LIENEDIT_H

lineedit.cpp

/****************************************************************************
**
** Copyright (c) 2007 Trolltech ASA <[e-mail]>
**
** Use, modification and distribution is allowed without limitation,
** warranty, liability or support of any kind.
**
****************************************************************************/

#include "lineedit.h"
#include <QToolButton>
#include <QStyle>

LineEdit::LineEdit(QWidget *parent)
    : QLineEdit(parent)
{
    clearButton = new QToolButton(this);
    QPixmap pixmap("fileclose.png");
    clearButton->setIcon(QIcon(pixmap));
    clearButton->setIconSize(pixmap.size());
    clearButton->setCursor(Qt::ArrowCursor);
    clearButton->setStyleSheet("QToolButton { border: none; padding: 0px; }");
    clearButton->hide();
    connect(clearButton, SIGNAL(clicked()), this, SLOT(clear()));
    connect(this, SIGNAL(textChanged(const QString&)), this, SLOT(updateCloseButton(const QString&)));
    int frameWidth = style()->pixelMetric(QStyle::PM_DefaultFrameWidth);
    setStyleSheet(QString("QLineEdit { padding-right: %1px; } ").arg(clearButton->sizeHint().width() + frameWidth + 1));
    QSize msz = minimumSizeHint();
    setMinimumSize(qMax(msz.width(), clearButton->sizeHint().height() + frameWidth * 2 + 2),
                   qMax(msz.height(), clearButton->sizeHint().height() + frameWidth * 2 + 2));
}

void LineEdit::resizeEvent(QResizeEvent *)
{
    QSize sz = clearButton->sizeHint();
    int frameWidth = style()->pixelMetric(QStyle::PM_DefaultFrameWidth);
    clearButton->move(rect().right() - frameWidth - sz.width(),
                      (rect().bottom() + 1 - sz.height())/2);
}

void LineEdit::updateCloseButton(const QString& text)
{
    clearButton->setVisible(!text.isEmpty());
}

- Marek R

---

这些“链接并运行”的答案有什么用？！目标页面的链接都已失效，这个答案已经变得无用了。请不要只提供链接；也要解释解决方案。链接会失效。 - Shravan

@ThePeacefulCoder确实。这就是为什么仅有链接的答案不好的原因。我从wayback机器中提取了链接的内容，并将重要部分添加到了帖子中。 - cgmb

Answer 3

我曾经为此实施了这样的解决方案：

// LineEdit.h

#ifndef LINEEDIT_H
#define LINEEDIT_H

#include <QLineEdit>

class QToolButton;

class LineEdit : public QLineEdit
{
    Q_OBJECT

public:
    LineEdit(QWidget *parent = 0);

protected:
    void resizeEvent(QResizeEvent *);

private:
    QToolButton *furfurIcon;
};

#endif // LINEEDIT_H

// LineEdit.cpp

#include "lineedit.h"
#include <QToolButton>
#include <QStyle>

LineEdit::LineEdit(QWidget *parent)
    : QLineEdit(parent)
{
    furfurIcon = new QToolButton(this);

    QPixmap pixmap(":/root/your_icon");
    furfurIcon->setIcon(QIcon(pixmap));
    furfurIcon->setIconSize(pixmap.size());
    furfurIcon->setCursor(Qt::ArrowCursor);
    furfurIcon->setStyleSheet("QToolButton"
                              "{"
                              "border: none; padding: 0px;"
                              "}");

    setStyleSheet(QString("QLineEdit"
                          "{"
                          "border: 1px solid;"
                          "border-color: rgb(148, 168, 199);"
                          "border-radius: 10px;"
                          "background: white;"
                          "padding-left: %1px;"
                          "}").arg(furfurIcon->sizeHint().width() - 4));

    setMinimumSize(0, 25);
}

void LineEdit::resizeEvent(QResizeEvent *)
{
    QSize sz = furfurIcon->sizeHint();
    furfurIcon->move(rect().left(), (rect().bottom() + 1 - sz.height()) / 2);
}

QToolButton的位置在resizeEvent中处理。如果有多个，您需要调整它们的坐标。此外，您可以修改它以使用布局。这里没有文本重叠。

- Maxim Makhun

---

这种方法在PyQt5中对我有效！ - Tuhin Mitra