Qt 之 Tab 键切换焦点顺序

简介

Qt的窗口部件按用户的习惯来处理键盘焦点。也就是说,其出发点是用户的焦点能定向到任何一个窗口,或者窗口中任何一个部件。

焦点获取方式比较多,例如:鼠标点击、Tab键切换、快捷键、鼠标滚轮等。

习惯性的,我们经常会使用Tab键来控制焦点顺序,比如:用户注册时,个人信息输入框焦点的切换、执行按钮焦点的切换等。

在添加部件之后,默认情况下,Tab键也是可以切换焦点的,只不过顺序往往和我们预期不一致,所以就需要自行控制了。

| 版权声明:一去、二三里,未经博主允许不得转载。

实现方式

接口说明:

  • static void QWidget::setTabOrder(QWidget * first, QWidget * second)

Puts the second widget after the first widget in the focus order.

也就是说,按下Tab键后,焦点会从第一个控件切换到第二个控件。

注意:如果第二个控件Tab顺序改变,则应该这样设置一个顺序链:

//设置a、b、c、d顺序
setTabOrder(a, b);  //a->b
setTabOrder(b, c);  //a->b->c
setTabOrder(c, d);  //a->b->c->d

而不是这样:

//错误
setTabOrder(c, d);  // c->d
setTabOrder(a, b);  // a->b 和 c->d
setTabOrder(b, c);  // a->b->c, 但不是c->d

示例

效果

这里写图片描述

源码

下面,以三个按钮和三个输入框为例,按照部件上的文本顺序来设置Tab键切换焦点的顺序,即:1 -> 2 -> 3 -> 4 -> 5 -> 6。

QPushButton *pButton1 = new QPushButton(this);
QPushButton *pButton2 = new QPushButton(this);
QPushButton *pButton3 = new QPushButton(this);

QLineEdit *pLineEdit1 = new QLineEdit(this);
QLineEdit *pLineEdit2 = new QLineEdit(this);
QLineEdit *pLineEdit3 = new QLineEdit(this);

pButton1->setText("1");
pButton2->setText("3");
pButton3->setText("5");

pLineEdit1->setText("6");
pLineEdit2->setText("4");
pLineEdit3->setText("2");

// 设置焦点切换顺序
QWidget::setTabOrder(pButton1, pLineEdit3);
QWidget::setTabOrder(pLineEdit3, pButton2);
QWidget::setTabOrder(pButton2, pLineEdit2);
QWidget::setTabOrder(pLineEdit2, pButton3);
QWidget::setTabOrder(pButton3, pLineEdit1);

QSS

QSS用于设置部件的样式,以便我们更直观地观看效果。

/**********按钮**********/
QPushButton{
        background: rgb(68, 69, 73);
        border: 1px solid rgb(45, 45, 45);
        color: rgb(230, 230, 230);
        width: 75px;
        height: 25px;
        outline: none;
}
QPushButton:hover, QPushButton:focus{
        border-color: rgb(0, 160, 230);
        background: rgb(85, 85, 85);
}
QPushButton:pressed, QPushButton:checked{
        border-color: rgb(0, 160, 230);
        background: rgb(0, 160, 230);
}

/**********输入框**********/
QLineEdit {
        border-radius: none;
        height: 25px;
        border: 1px solid rgb(45, 45, 45);
        background: rgb(57, 58, 60);
}
QLineEdit:enabled {
        color: rgb(230, 230, 230);
}
QLineEdit:enabled:hover, QLineEdit:enabled:focus {
        border-color: rgb(0, 160, 230);
        color: rgb(230, 230, 230);
}
QLineEdit:!enabled {
        color: rgb(155, 155, 155);
}

扩展

如果我们不需要为所有的部件都设置焦点切换,也就是说,只想为一部分部件设置焦点顺序。

这里写图片描述

那么,可以添加如下代码(注意:上述其它代码不作任何变动):

pButton2->setFocusPolicy(Qt::NoFocus);
pLineEdit2->setFocusPolicy(Qt::NoFocus);

Qt::FocusPolicy的作用是为部件设置焦点策略,而Qt::NoFocus可以将策略设置为无焦点。

就这样,简简单单的一个接口解决了我们的问题。有兴趣的小伙伴可以看下focusNextChild

©️2020 CSDN 皮肤主题: 技术黑板 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值