让QComboBox文字居中,本以为很简单,结果搞了一个小时左右,记录一下。
这个功能其实不太难,如果愿意写一些如重写类等比较“麻烦”的步骤,可以容易做到,但明明一个看起来简单的功能非要搞的这么复杂,有点不太能接受,于是较劲搞了一会,觉得还是记录一下,防止再遇到这个问题。
QComboBox实现文字居中,说白了就是自定义QComboBox,只不过简单一些,但思路是一样的。
QComboBox一共分为四个部分,我们按照要实现的效果逐一实现:
1.展示当前选中项的部分:可以通过void QComboBox::setLineEdit(QLineEdit *edit)函数,设置一个自定义的行编辑器来替代现有的展示控件,这样我们只需要自定义这个QLineEdit就可以了。
2.下拉列表:当我们选择项的时候,下拉列表就会展开,可以通过void QComboBox::setView(QAbstractItemView *itemView)函数,使用一个View替代现有的下拉列表,这是我们需要去自定义或者美化这个view。(注意如果setView函数要使用的是Widget方便类,那么首先需要设置该Widget相关的model,示例见下面代码)
而view的美化,除了Qt自己提供的QSS特性之外,我们也可以通过设置Delegate的方式自己完成对item的绘制,自由度很高。
3.右上角的下拉框:这部分可以通过QSS设置,即设置QComboBox的子控drop-down,这个子控件默认处于QComboBox的右边,是个矩形,drop-down内部又有一个子控件down-arrow,专门用于绘制下拉按钮,默认位于drop-down的右上角。
4.下拉按钮:通过QSS设置QComboBox的子控件down-arrow。
思路有了之后,就很简单了,某些QSS即使不太熟悉,也可以找一些例子参考,照猫画虎即可。
下面是文字居中的代码:
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
QStringList items;
items << "offline" << "student" << "teacher" << "manager";
QListWidget *listWidget = new QListWidget(this);
for(int i = 0;i < items.count();++i)
{
QListWidgetItem *item = new QListWidgetItem(items.at(i));
item->setTextAlignment(Qt::AlignCenter);
listWidget->addItem(item);
}
ui->comboBox->setModel(listWidget->model());
ui->comboBox->setView(listWidget);
QLineEdit *lineEdit = new QLineEdit;
lineEdit->setReadOnly(true);
lineEdit->setAlignment(Qt::AlignCenter);
ui->comboBox->setLineEdit(lineEdit);
ui->comboBox->setStyleSheet("QComboBox {"
"color:black;"
"background-color:white;"
"outline:0px;"
"border:0px;"
"}"
"QComboBox::down-arrow{"
"right:3px;"
"image:url('subscriptLogin.png');"
"}"
"QComboBox:drop-down {"
"outline:0px;"
"border:0px;"
" }"
);
}