QT 实现 Toolbar 的全局颜色选择框 与按钮自定义演示选择


实现效果

初学QT 发现果真是强大的不行,原来我都是用MFC 虽然有异曲同工之妙 ,但是感觉跨平台的QT更加精髓一些,下面,我们来实现一个全局的自定义颜色选择工具栏,效果如下,主要由一组互斥的 CheckBox 和 一个单独的自定义 Qpushbutton 构成。

在这里插入图片描述


实现过程

调整 工具栏

我们首先在主窗口布局的工具栏中 ,给工具栏增加我们自己写的,自定义选择框函数,
并且由分隔符 隔开


void ASAP::setupUi()
{
  if (this->objectName().isEmpty()) {
      this->setObjectName(QStringLiteral("ASAP"));
  }
  this->resize(1037, 786);
  this->setTabPosition(Qt::DockWidgetArea::LeftDockWidgetArea, QTabWidget::East);
  this->setTabPosition(Qt::DockWidgetArea::RightDockWidgetArea, QTabWidget::West);
  
我们代码

mainToolBar->addSeparator();
// 添加 全局颜色选择框
mySetcolorToolbar(mainToolBar);
mainToolBar->addSeparator();


horizontalLayout_2->addWidget(pathologyView);
this->setCentralWidget(centralWidget);
}

设置工具栏按钮

这一步主要是构建一组互斥的Qcheckbox 和一个单独的自定义颜色选择按钮


void ASAP::mySetcolorToolbar(QToolBar *mainToolBar){
	// add Global color selection check box

	QLabel *plabel = new QLabel;
	plabel->setText(QString::fromLocal8Bit("线框颜色:"));
	mainToolBar->addWidget(plabel);
	
	// 默认颜色
	my_qSlistColorName << "#FF0000" << "#00B050" << "#000000" << "#0070C0"<<"#FFC000"<<"#7030A0";

	m_pButtonGroup = new QButtonGroup(this);
	
	// 设置互斥
	m_pButtonGroup->setExclusive(true);
	foreach(QString str_color, my_qSlistColorName) {
	
		QCheckBox *pButton = new QCheckBox(this);

		// 设置文本
		pButton->setText(QString::fromLocal8Bit("  "));

		// 设置qss 样式,背景颜色,线框颜色,选中小图标
		QString strCheckBoxStyle = QString(
			"QCheckBox::indicator{ width: 18px; height: 18px;border-radius:4px;background-color:#FFFFFF;border: 2px solid %1;}"
			"QCheckBox::indicator:checked{image: url(:/ASAP_icons/gou.png);}").arg(str_color);
		cout << strCheckBoxStyle.toStdString().data() << endl;
		pButton->setStyleSheet(strCheckBoxStyle);

		m_pButtonGroup->addButton(pButton);
		mainToolBar->addWidget(pButton);
		
	}
	
	
	// 连接信号槽 buttonClicked 点击 stateChanged 状态更改
	connect(m_pButtonGroup, SIGNAL(buttonClicked(QAbstractButton*)), this, SLOT(onColorChooseButtonClicked(QAbstractButton*)));

	m_pPushButton = new QPushButton(this);
	// 设置 自定义 颜色 按钮
	m_pPushButton->setText(QString::fromLocal8Bit("..."));
	QString strPushButtonStyle = QString(
	"QPushButton{ width: 20px; height: 20px;min-width: 20px;border: 1px ;  background-color:#FFFFFF;}"
	"QPushButton:pressed{background-color:#c44237; }");
	m_pPushButton->setStyleSheet(strPushButtonStyle);
	mainToolBar->addWidget(m_pPushButton);

	 //连接信号槽 
	connect(m_pPushButton, SIGNAL(clicked()), this, SLOT(onColorCustomButtonClicked()));


}

设置勾选框样式

这里查了很多资料,设置样式的时候非常的不方便试验了很多次。

下面这个样式为圆角矩形,背景颜色为白色,并且包含宽高等信息。

// 设置qss 样式,背景颜色,线框颜色,选中小图标
		QString strCheckBoxStyle = QString(
			"QCheckBox::indicator{ width: 18px; height: 18px;border-radius:4px;background-color:#FFFFFF;border: 2px solid %1;}"
			"QCheckBox::indicator:checked{image: url(:/ASAP_icons/gou.png);}").arg(str_color);
		cout << strCheckBoxStyle.toStdString().data() << endl;
		pButton->setStyleSheet(strCheckBoxStyle);

默认勾选

当然,我们还可以在 按钮设置好样式之后,添加之前,对整体的一组Qcheckbox设置一个默认的勾选项目

// 默认勾选红色
		if (str_color == QString::fromLocal8Bit("#FF0000")){
			pButton->setChecked(true);
		}

设置信号函数

这一步是在点击 的时候 设置全局颜色信息,这里有一个问题是,我怎么知道勾选框自带的颜色是什么呢?

如何获取呢?

有两个思路:

  1. 通过getcolor 进行获取,发现Qcheckbox的 border 获取不到
  2. 通过获取qss 的string 后进行截取,比较丑陋


void ASAP::onColorChooseButtonClicked(QAbstractButton *button)
{
	// 当前点击的按钮
	cout << QString("Clicked Button : %1").arg(button->text()).toStdString().data() << endl;
	// 遍历按钮,获取选中状态
	QList<QAbstractButton*> list = m_pButtonGroup->buttons();
	foreach(QAbstractButton *pButton, list)
	{
		if (pButton->isChecked()==true) {
			QString strStatus = pButton->isChecked() ? "Checked" : "Unchecked";
			cout << QString("Button : %1 is %2").arg(button->text()).arg(strStatus).toStdString().data()<<endl ;
			
			QString s_temp = pButton->styleSheet();
			cout << "  qss : " << s_temp.toStdString().data() << endl;
			// 截取qss 字符串 中的 颜色信息
			QString s_tempColor = s_temp.mid(110, 6);
			cout << "  qss color: " << s_tempColor.toStdString().data() << endl;
			QColor colortemp = QColor(s_tempColor.toUInt(NULL, 16));

			//r的rgb转化为16进制
			QString redStr = QString("%1").arg(colortemp.red(), 2, 16, QChar('0'));
			//g的rgb转化为16进制
			QString greenStr = QString("%1").arg(colortemp.green(), 2, 16, QChar('0'));
			//b的rgb转化为16进制
			QString blueStr = QString("%1").arg(colortemp.blue(), 2, 16, QChar('0'));
			QString hexStr = "#" + redStr + greenStr + blueStr;
			// 设置 全局颜色变量
			m_qGlobalColor = colortemp;
			m_strGlobalColor = hexStr;
			cout << "  GlobalColor is set to  : "<<m_strGlobalColor.toStdString().data() << endl;
			// 发送信号 修改 默认颜色
			//connect(this, SIGNAL(imageClosed()), &*extension, SLOT(onImageClosed()));
		}
		
	}
}

void ASAP::onColorCustomButtonClicked(){
	// 使用颜色选择框进行颜色设置
	QColor newColor = QColorDialog::getColor(Qt::green, this, QString::fromLocal8Bit("选择颜色"));
	
	//r的rgb转化为16进制
	QString redStr = QString("%1").arg(newColor.red(), 2, 16, QChar('0'));
	//g的rgb转化为16进制
	QString greenStr = QString("%1").arg(newColor.green(), 2, 16, QChar('0'));
	//b的rgb转化为16进制
	QString blueStr = QString("%1").arg(newColor.blue(), 2, 16, QChar('0'));
	//将各rgb的拼接在一起形成#000000
	QString hexStr = "#" + redStr + greenStr + blueStr;
	// 设置 全局颜色变量
	m_qGlobalColor = newColor;
	m_strGlobalColor = hexStr;
	cout << "  GlobalColor is set to  : " << m_strGlobalColor.toStdString().data() << endl;
}

其他调试参考

这次QT 开发还是学到了不少开发技巧, 包括cmake的使用等等

还有就是 在调试的同时进行 cmd 窗口的输出

比如添加如下内容

#ifdef _DEBUG

	AllocConsole();
	freopen("CONOUT$", "w+t", stdout);
	freopen("CONIN$", "r+t", stdin);

#else

#endif

获取全局颜色设置

进行全局的变量修改,需要使用 (static_cast<QApplication *>(QCoreApplication::instance()))

#define qApp (static_cast<QApplication *>(QCoreApplication::instance()))

传递QString, 使用时候用 QVariant::fromValue(color) 进行转型

//r的rgb转化为16进制
QString redStr = QString("%1").arg(colortemp.red(), 2, 16, QChar('0'));
//g的rgb转化为16进制
QString greenStr = QString("%1").arg(colortemp.green(), 2, 16, QChar('0'));
//b的rgb转化为16进制
QString blueStr = QString("%1").arg(colortemp.blue(), 2, 16, QChar('0'));
QString hexStr =  redStr + greenStr + blueStr;
// 设置 全局颜色变量
m_qGlobalColor = colortemp;
m_strGlobalColor = hexStr;

qApp->setProperty("m_strGlobalColor", m_strGlobalColor);

使用时候

QString chosedColorStr = "#"+qApp->property("m_strGlobalColor").value<QString>();
QColor chosedColor(chosedColorStr);

参考文献

高分辨(医学或遥感图像)处理 开源方案简介

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

shiter

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值