QComboBox下拉菜单中有分隔符Separator时的样式设置

本文介绍了如何在Qt中使用QComboBox创建下拉框,并设置带有分隔符的样式,重点讲解了自定义MStyledItemDelegate来美化分隔符。通过实例展示了如何设置背景、字体、颜色及透明度,适用于UI开发者。
摘要由CSDN通过智能技术生成
	QHBoxLayout* lay = new QHBoxLayout(this);
		
	//	创建测试用的下拉框对象
	QComboBox* cbo = new QComboBox(this);
	lay->addWidget(cbo, 0, Qt::AlignTop | Qt::AlignHCenter);
	
	//	添加测试用的数据
	cbo->addItem("the 1st data");
	cbo->insertSeparator(1);			//	添加的分割符
	cbo->addItem("the 2nd data");
	cbo->addItem("the 3rd data");
	cbo->insertSeparator(3);
	cbo->addItem("the 4th data");
	cbo->addItem("the 5th data");
	cbo->addItem("the 6th data");
	cbo->insertSeparator(6);
	cbo->addItem("the 7th data");
	cbo->addItem("the 8th data");
	cbo->addItem("the 9th data");
	cbo->addItem("the 10th data");
	cbo->insertSeparator(10);
	cbo->addItem("the 11th data");
	cbo->addItem("the 12th data");
	cbo->addItem("the 13th data");
	cbo->addItem("the 14th data");
//	先给整体窗口添加一个背景颜色
	this->setStyleSheet(QString("QWidget#%1{background-color: #0b1127}").arg(this->objectName()));

	//	开始设置下拉框的样式
	QString strStyle(
		"QComboBox{ border-image:url(:/image/comboBox.png); font-family: \"Noto Sans S Chinese\"; font-size:16px; color: #ffffff; padding-left: 16px;}"
		"QComboBox::drop-down{ background: transparent; } "
		"QComboBox QFrame{border-image: url(:/image/cboDropFrame.png);}"
		"QComboBox QAbstractItemView{  padding-left: 8px; outline:0px; color: #ffffff; font-size:14px; font-family: \"Noto Sans S Chinese\"; } "
		"QComboBox QAbstractItemView::item { height: 16px; margin-top: 8px; margin-bottom:8px; } "
		"QComboBox QAbstractItemView::item:selected, QAbstractItemView::item:hover { background-color: rgba(0, 188, 212, 0.4); } "
		"QScrollBar::vertical{ background:transparent; margin: 0px 0px 0px 0px; width: 6px; }"
		"QScrollBar::handle:vertical{ background-color:#00BCD4; border-radius:3px; }"
		"QScrollBar::add-line:vertical{ height: 0px; }"
		"QScrollBar::sub-line:vertical{ height: 0px; }"
		"QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical{background: transparent;}"
		);
	cbo->setStyleSheet(strStyle);
	cbo->setMinimumSize(QPixmap(":/image/comboBox.png").size());	//	修改下拉框的最小大小
	//	下面这句可以让下拉菜单应用上样式表的样式
//	cbo->setItemDelegate(new QStyledItemDelegate());		//	但是这个样式代理类不能让分隔符变得好看,需要自己继承他自定义分隔符的样式
	cbo->setItemDelegate(new MStyledItemDelegate());		//	当有分割符时,使用这个自定义的样式代理
	//	下面两句可以设置下拉菜单背景透明
	cbo->view()->parentWidget()->setWindowFlags(Qt::Popup | Qt::FramelessWindowHint);
	cbo->view()->parentWidget()->setAttribute(Qt::WA_TranslucentBackground);

自定义的样式样式代理类

MStyledItemDelegate::MStyledItemDelegate(QObject *parent /*= 0*/) : QStyledItemDelegate(parent)
{
	//	给分隔符设置默认颜色
	clrSeparator = QColor("#00BCD4");
}

void MStyledItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
	if (isSeparator(index)) {
		QRect rect = option.rect;
		if (const QAbstractItemView *view = qobject_cast<const QAbstractItemView*>(option.widget))
			rect.setWidth(view->viewport()->width());
		QStyleOption opt;
		opt.rect = rect;
		QPoint pt1(rect.left(), rect.top() + rect.height() / 2);
		QPoint pt2(rect.right(), pt1.y());
		painter->save();
		painter->setPen(clrSeparator);
		painter->drawLine(pt1, pt2);
		painter->restore();
	}
	else {
		QStyledItemDelegate::paint(painter, option, index);
	}
}

QSize MStyledItemDelegate::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
	if (isSeparator(index)) {
		int pm = 1;		//	自定义分隔符高度为1px
		return QSize(pm, pm);
	}
	return QStyledItemDelegate::sizeHint(option, index);
}

bool MStyledItemDelegate::isSeparator(const QModelIndex &index)
{
	return index.data(Qt::AccessibleDescriptionRole).toString() == QLatin1String("separator");
}

在这里插入图片描述

 在这里插入图片描述

参考

QComboBox下拉菜单中有分隔符Separator时的样式设置 

要在Qt中的QComboBox下拉菜单中渲染树形数据,你需要使用`QTreeWidget`或自定义模型(如`QStandardItemModel`)配合`QAbstractItemView`。以下是一个基本步骤: 1. **创建模型**: 使用`QStandardItemModel`存储树形数据,每个节点可以是`QStandardItem`。 ```cpp QStandardItem *rootItem = new QStandardItem("根节点"); // 创建子节点 QList<QStandardItem*> children; for (const auto& childData : yourTreeData) { QStandardItem *child = new QStandardItem(childData.key()); // 添加更多层级 if (!childData.children().empty()) { for (const auto& grandChild : childData.children()) { QStandardItem *grandChildItem = new QStandardItem(grandChild.key()); child->appendRow(grandChildItem); } } children.append(child); } rootItem->appendRows(children); ``` 2. **设置模型到QComboBox**: 将模型绑定到QComboBox,使其显示为树形视图。 ```cpp QComboBox comboBox; comboBox.setModel(rootItem); // 如果你想让整个树结构可见,这里使用模型 ``` 3. **选择/展开/折叠功能**: 对于下拉菜单的交互,你可以添加事件处理程序来处理点击或按键的展开、折叠和选择操作。例如,可以通过监听`QAbstractItemView::activated()`信号来选中并展开特定节点。 ```cpp comboBox.view()->pressed.connect([](const QModelIndex &index) { if (index.isValid() && index.model()->isExpandable(index)) { index.model()->expand(index); } }); ``` 4. **可能的样式调整**: 为了美化显示,你可能需要自定义`QTreeView`的样式或者使用`QComboBox`的`currentText`属性来更新其他UI元素。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值