Question

信息：Qt 4.8，Qt Designer

我正在努力设置组合框下拉文本项目的填充。我的理解是整个事情是QComboBox小部件，下拉部分是QListView。但我无法确定用于更改下拉列表中文本项的样式的css选择器。

我希望悬停项目的背景颜色一直延伸，而不是留下5px的边距。文本本身排列很好，只是左边的白色间隙让我烦恼。

如果我能删除突出显示项目周围的虚线边框，我也会很棒。

我想我只是没有使用正确的项目选择器。我尝试过QListView :: item和QListViewItem。这是我的CSS应用于组合框。

QComboBox{
border:                 none;
background-color:   rgb(87, 96, 134);
color:                      rgb(255, 255, 255);
font-weight:            bold;
padding:                    5px 

}

QComboBox::drop-down{
    border:                 none;
    background-color:   rgb(87, 96, 134);
    color:                      rgb(255, 255, 255);
    font-weight:            bold;
    padding:                    0px;
}

QComboBox::down-arrow{
    image:                      url(:/icons/combobox_down_arrow.png);
    padding-right:          5px;
}

QListView{
    border:                 none;
    color:                      rgb(87, 96, 134);
    background-color:   rgb(255, 255, 255);
    font-weight:            bold;
    selection-background-color: rgb(47, 175, 178);
    show-decoration-selected: 1;
    margin-left:                -10px;
    padding-left    :           15px;
}

QListView::item:hover{

    background-color:   rgb(47, 175, 178);
    border:                 none;
}

思想？

Answer 1

通过设置未记录的属性outline，可以仅使用CSS删除dotter边框：

QComboBox QAbstractItemView {
    outline: none;
}

QListView也可以在此选择器中使用。此示例中使用了QAbstractItemView，因为它是QListView的基类。请注意，此属性不是针对每个项目设置的，而是针对项目的外部容器设置的。

还有其他方法可以使用编码删除虚线边框，例如QT - CSS: decoration on focus

看起来需要更改代码以使用填充具有更好的灵活性。 QComboBox根据QAbstractItemDelegate使用自己的QItemDelegate私有实现。但是，其他控件使用QStyledItemDelegate （QStyledItemDelegate vs. QItemDelegate）。这就是为什么项目（QListView::item）的CSS选择器对QComboBox项没有影响的原因。

源代码中有以下注释及解释：

请注意，此课程故意不使用QStyledItemDelegate
Vista不会将新主题用于组合框，可能会有使用新课程的其他副作用

如果以上评论不存在问题，可以将QStyledItemDelegate设置为QComboBox个对象：

QComboBox *combobox = new QComboBox;
combobox->setItemDelegate(new QStyledItemDelegate(combobox));

现在，不再需要属性selection-background-color。可以自定义::item：

QComboBox QAbstractItemView::item {
    border: none;
    padding-left: 5px;
}

QComboBox QAbstractItemView::item:selected {
    background: rgb(47, 175, 178);
    padding-left: 5px;
}

请注意，要设置填充，还需要提供（例如）至少边框或背景属性以及填充。否则，不考虑填充属性。

使用选择器::item:selected代替:hover，因为也可以通过键盘选择项目。

尽管记录了可以为QComboBox设置自定义视图，但这并不是那么简单。 QComboBox也可以包含分隔符项。如果QComboBox中没有分隔项，则上述解决方案可以正常工作。要处理分隔符，项目委托也应该知道它们。

可以继承QStyledItemDelegate并从QComboBoxDelegate的Qt私有实现中复制所需的函数。那解决方案不是很好。对于新的Qt版本，它可能不可移植。 Qt5中QComboBoxDelegate的实现与Qt4不兼容。但是，Qt5可以与Qt4实现一起使用，所以这个类可以从Qt4中获取。 QItemDelegate基类替换为QStyledItemDelegate：

class ComboBoxDelegateStyled : public QStyledItemDelegate { Q_OBJECT public: ComboBoxDelegateStyled(QObject *parent, QComboBox *cmb) : QStyledItemDelegate(parent), mCombo(cmb) {} static bool isSeparator(const QModelIndex &index) { return index.data(Qt::AccessibleDescriptionRole).toString() == QLatin1String("separator"); } protected: void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const { if (isSeparator(index)) { QRect rect = option.rect; if (const QStyleOptionViewItemV3 *v3 = qstyleoption_cast<const QStyleOptionViewItemV3*>(&option)) if (const QAbstractItemView *view = qobject_cast<const QAbstractItemView*>(v3->widget)) rect.setWidth(view->viewport()->width()); QStyleOption opt; opt.rect = rect; mCombo->style()->drawPrimitive(QStyle::PE_IndicatorToolBarSeparator, &opt, painter, mCombo); } else { QStyledItemDelegate::paint(painter, option, index); } } QSize sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const { if (isSeparator(index)) { int pm = mCombo->style()->pixelMetric(QStyle::PM_DefaultFrameWidth, 0, mCombo); return QSize(pm, pm); } return QStyledItemDelegate::sizeHint(option, index); } private: QComboBox *mCombo; };

将QComboBox子类化为使用ComboBoxDelegateStyled：
是有意义的
class ComboBoxStyled : public QComboBox { public: explicit ComboBoxStyled(QWidget *parent = 0) : QComboBox(parent) { setItemDelegate(new ComboBoxDelegateStyled(this, this)); } };

现在可以使用课程ComboBoxStyled代替QComboBox。它支持组合框分隔符绘图，并且还支持::item的CSS。

用于自定义QComboBox分隔符的类似解决方案：how to add stylesheet for separator in QCombobox

<强> PyQt的

以上行为对PyQt有效。可以使用outline删除虚线边框，并设置样式项委托以自定义CSS ::item：

styledComboBox = QtGui.QComboBox() delegate = QtGui.QStyledItemDelegate() styledComboBox.setItemDelegate(delegate)

在这种情况下，组合框分隔符显示为没有文本的常规项。也可以创建自定义委托来处理分隔符。

样式QtComboBox，QListViewItem - 设置文本填充

1 个答案: