关于QLineEdit右侧添加图标（点击查看密码，点击隐藏密码）如何优化图标的位置呢？

lwei2 2021-05-18 07:59:10

各位大佬，请问QLineEdit右侧添加图标，点击查看密码，点击隐藏密码时，为啥如下代码显示的右侧图标会向下拉长呢？有什么办法可以让它显示正常或好看一些吗？
具体代码如下：
class pwdLineEdit : public QLineEdit
{
Q_OBJECT
public:
explicit pwdLineEdit(QWidget *parent = nullptr);
~pwdLineEdit();

signals:

public slots:

};

//pwdLineEdit
pwdLineEdit::pwdLineEdit(QWidget *parent)
:QLineEdit(parent)
{
setStyleSheet("QLineEdit{background:transparent;border-image:url(:/res/pwd/lineEditBkg.png);border-style:solid;color:#003DA6;padding-left: +8px;border-color:#232423;font:11px ""SimHei"";}"
"QLineEdit:hover{border: 1px solid #014099;}"
"QLineEdit:focus{border: 1px solid #014099;}"
"QLineEdit:hover{border: 1px solid #014099;}"
"QLineEdit QPushButton {width: 16px;height: 16px;qproperty-flat: true;margin-right: 4px;border: none;border-width: 0;border-image: url(:/res/pwd/password_hide.png) 0 0 0 0 stretch stretch;background: transparent;}"
"QLineEdit QPushButton::checked {border-image: url(:/res/pwd/password_show.png) 0 0 0 0 stretch stretch;}");
setEchoMode(QLineEdit::Password);
QPushButton* button = new QPushButton();
button->setCursor(Qt::PointingHandCursor);
button->setCheckable(true);
connect(button, &QPushButton::toggled, [this](bool checked) {
if (checked)
{
setEchoMode(QLineEdit::Normal);
}
else
{
setEchoMode(QLineEdit::Password);
}
});

QHBoxLayout* layout = new QHBoxLayout();
layout->addStretch();
layout->addWidget(button);
layout->setContentsMargins(0, 0, 0, 0);
setLayout(layout);
}

pwdLineEdit::~pwdLineEdit()
{

}

具体效果图如下：

...全文

22593 13 打赏收藏转发到动态举报

写回复

用AI写文章

13 条回复

切换为时间正序

请发表友善的回复…

发表回复

这是一个正经昵称 2021-05-25

打赏
举报

引用 7 楼 lwei2 的回复:

[quote=引用 5 楼这是一个正经昵称的回复:][quote=引用 4 楼 lwei2 的回复:][quote=引用 3 楼这是一个正经昵称的回复:][quote=引用 2 楼 lwei2 的回复:][quote=引用 1 楼这是一个正经昵称的回复:]不要用border-image 那个跟着控件大小走的。要么就把button大小固定成图片的比例。

大佬，刚刚试过了，把button固定成为:/res/pwd/password_show.png或:/res/pwd/password_hide.png，好像没有多大变化，和截图中的效果一样。那个border-image背景图这个暂时不能更换了，因为项目需求限定了这个背景图片。。。[/quote]

我的意思是指定button的fixdsize 或者用seticon和seticonsize 没让你固定用一个图片或者换图片 border-image会把图绘制的跟控件一样大[/quote] 大佬，border-image这个背景是不能改了，项目要求。至于你说的button的fixSize应该是setFixedSize这个吧。好像不怎么管用！！！[/quote] 好家伙项目要求必须用border-image设置背景？我大概知道你们应用场景了

非得把控件放布局里的话你可以试试把按钮放一个QWIdget上再把QWiget放布局里，然后控制按钮大小。[/quote] 大佬，我这样写的，你看有啥不对吗？感觉和截图中差不多。还劳烦再指点一下： installEventFilter(this); setEchoMode(QLineEdit::Password); QWidget *pWidget = new QWidget(); QPushButton *button = new QPushButton(pWidget); button->setCursor(Qt::PointingHandCursor); button->setCheckable(true); connect(button, &QPushButton::toggled, [this](bool checked) { if (checked) { setEchoMode(QLineEdit::Normal); } else { setEchoMode(QLineEdit::Password); } }); QHBoxLayout* layout = new QHBoxLayout(); layout->addStretch(); layout->addWidget(button); layout->setContentsMargins(0, 0, 0, 0); setLayout(layout); 这个图标，能不能向左移动一些距离，因为太靠右了，看起来感觉不是很好。。。。[/quote]

lwei2 2021-07-26

@这是一个正经昵称大佬，又碰到一个小问题，想请教一下，就是这个QLineEdit输入的字符串一定长度后，可能会覆盖到最右端的图标，有什么办法可以避免这种问题出现吗？

这是一个正经昵称 2021-07-27

@lwei2 padding-right

lwei2 2021-07-27

@这是一个正经昵称多谢大佬，我用setTextMargins这个也可以做到。我试试你说的方法！

1条回复

lwei2 2021-05-25

打赏
举报

引用 8 楼这是一个正经昵称的回复:

[quote=引用 7 楼 lwei2 的回复:][quote=引用 5 楼这是一个正经昵称的回复:][quote=引用 4 楼 lwei2 的回复:][quote=引用 3 楼这是一个正经昵称的回复:][quote=引用 2 楼 lwei2 的回复:][quote=引用 1 楼这是一个正经昵称的回复:]不要用border-image 那个跟着控件大小走的。要么就把button大小固定成图片的比例。

之前的意思是，你可以拿button放widget上，然后把widget放布局里，这样widget会被拉伸，button的大小和位置会被固定，图标自然不会变形。但是问题是按钮是固定位置，实际上并不一定在LineEdit的垂直中心。所以你可以把widget换成一个垂直Layout，其上中下分3层，分别是Stretch，button，Stretch。另外我要是你，我根本不会用这个布局，这个控件直接获取resize事件然后动态调整button位置就完事了。一般自己写一些布局的东西灵活运用。[/quote] 多谢大佬耐心指点，我尝试过你说的方法：把widget换成一个垂直Layout，不过图标突然变到左侧了，可能是我对布局这个概念理解的不够深，目前还做到灵活。故，我只是做了以下修改：layout->setContentsMargins(5, -5, 15, -15);。还是很感谢你的帮忙。

lwei2 2021-05-24

打赏
举报

引用 5 楼这是一个正经昵称的回复:

[quote=引用 4 楼 lwei2 的回复:][quote=引用 3 楼这是一个正经昵称的回复:][quote=引用 2 楼 lwei2 的回复:][quote=引用 1 楼这是一个正经昵称的回复:]不要用border-image 那个跟着控件大小走的。要么就把button大小固定成图片的比例。

lwei2 2021-05-21

打赏
举报

引用 5 楼这是一个正经昵称的回复:

[quote=引用 4 楼 lwei2 的回复:][quote=引用 3 楼这是一个正经昵称的回复:][quote=引用 2 楼 lwei2 的回复:][quote=引用 1 楼这是一个正经昵称的回复:]不要用border-image 那个跟着控件大小走的。要么就把button大小固定成图片的比例。

非得把控件放布局里的话你可以试试把按钮放一个QWIdget上再把QWiget放布局里，然后控制按钮大小。[/quote] 大佬，还是很感谢你的回复，我会再试试的。

这是一个正经昵称 2021-05-21