Qt界面优化:Qt窗体控件设置
一、效果图
1.鼠标移动点击效果
2. Qt托盘效果
相信大家在使用QQ,微信,网易云等应用时,会发现他们在关闭界面后,会最小化到右下方,生成一个小图标,点击该图标后,便又会弹出相关界面,此即为托盘效果。
如下图所示,关闭界面后,所做软件不会直接关闭,会在右下方生成一个小图标,双击后,会重新打开该界面,右击,会弹出菜单栏,可进行关闭、最大化和最小化等操作,同时,我也加入了一个弹窗按钮,单击该图标,会弹出相关的通知,如下图2所示。
二、使用步骤
1. 背景图片的添加
.h部分(添加到私有属性中):
QLabel * bglabel;
.cpp部分:
//背景图片的添加
bglabel=ui->label;
bglabel ->setPixmap(QPixmap(":images//background.png"));//此处为你要添加的图片路径
bglabel ->setScaledContents(true);
.cpp第二行为你要添加的图片的路径,我这里添加的路径结果目录为pro同级目录中的images文件中的background.png图片。
.ui界面:将label控件添加到窗体中,右击,选择放到后面选项,即可实现背景的更改(如果添加的label被控件遮挡,需要将控件设置为透明,才可完全显示出来)。
注:也可以通过更改样式表来改变控件,如背景,字体颜色,渐变等,但背景添加效果与使用label,通过代码来实现相比,略显逊色。
2. 控件样式的更改
Qt控件样式的更改,可以通过两种方法实现,一种为直接通过ui界面中右击控件,选择更改样式表来实现控件颜色,背景,渐变,字体样式,颜色等的更改。
还可以通过如下图的代码来实现相关的控件优化:
.cpp部分:
//控件的透明化
ui->tabWidget->setStyleSheet("background-color:rgba(0,0,0,0);");
//tabWidget为你想要修改的控件的名称
//按钮的美化
ui->pushButton->setStyleSheet(
//正常状态样式
"QPushButton{"
"background-color:#E4F2F8;"//设置按钮背景色
"border-radius:10px;"//设置圆角半径
"}"
"QPushButton:hover{"
"background-color:#999999;"//设置按钮点击时的背景颜色
"color:white;"
"}");
//设置字体颜色
3. Qt窗体透明化
.cpp部分:
setWindowOpacity(0.85); //0.85为透明度所占比,数字越小,透明度越低
4. Qt托盘的添加
.h部分:
private:
QSystemTrayIcon *SysIcon;
QAction *min; //最小化
QAction *max; //最大化
QAction *restor; //恢复
QAction *quit; //退出
QMenu *menu;
void closeEvent(QCloseEvent * event);
public slots:
void on_activatedSysTrayIcon(QSystemTrayIcon::ActivationReason reason);
.cpp部分
//托盘
menu = new QMenu(this);
menu->setStyleSheet("background-color:rgba(255,255,255);");
QIcon icon(":images//CalenderLogo.png");
SysIcon = new QSystemTrayIcon(this);
SysIcon->setIcon(icon);
SysIcon->setToolTip("YXSmarter");
min = new QAction("窗口最小化",this);
connect(min,&QAction::triggered,this,&MainWindow::hide);
max = new QAction("窗口最大化",this);
connect(max,&QAction::triggered,this,&MainWindow::showMaximized);
restor = new QAction("恢复原来的样子",this);
connect(restor,&QAction::triggered,this,&MainWindow::showNormal);
quit = new QAction("退出",this);
connect(quit,&QAction::triggered,qApp,&QApplication::quit);
connect(SysIcon,&QSystemTrayIcon::activated,this,&MainWindow::on_activatedSysTrayIcon);
menu->addAction(min);
menu->addAction(max);
menu->addAction(restor);
menu->addSeparator(); //分割
menu->addAction(quit);
SysIcon->setContextMenu(menu);
SysIcon->show();
close();
函数实现部分
void MainWindow::closeEvent(QCloseEvent * event){ //关闭事件
if(SysIcon->isVisible())
{
this->hide();
event->ignore();
}
else {
event->accept();
}
}
void MainWindow::on_activatedSysTrayIcon(QSystemTrayIcon::ActivationReason reason)
{ //对托盘中的菜单项的事件处理
switch (reason) {
case QSystemTrayIcon::Trigger:
SysIcon->showMessage("YXSmarter","欢迎使用云曦智划!");
break;
case QSystemTrayIcon::DoubleClick:
this->show();
break;
default:
break;
}
}
5. Qt去边框的添加
.cpp部分
this->setWindowFlags(Qt::FramelessWindowHint | Qt::WindowSystemMenuHint | Qt::WindowMinimizeButtonHint);
窗体可拖动
.h部分:
private:
void mouseMoveEvent(QMouseEvent *event);
void mousePressEvent(QMouseEvent *event);
void mouseReleaseEvent(QMouseEvent *event);
QPoint z;
.cpp部分
void MainWindow::mouseMoveEvent(QMouseEvent *event)
{
QWidget::mouseMoveEvent(event);
QPoint y =event->globalPos(); //鼠标相对于桌面左上角的位置,鼠标全局位置
QPoint x =y-this->z;
this->move(x);
}
void MainWindow::mousePressEvent(QMouseEvent *event)
{
QWidget::mousePressEvent(event);
QPoint y =event->globalPos(); //鼠标相对于桌面左上角,鼠标全局位置
QPoint x =this->geometry().topLeft(); //窗口左上角相对于桌面位置,窗口位置
this-> z =y-x ;//定值不变
}
void MainWindow::mouseReleaseEvent(QMouseEvent *event)
{
QWidget::mouseReleaseEvent(event);
this->z=QPoint();
}
总结
以上是部分Qt关于界面优化的部分,所有相关的Qt界面优化的部分,均在下方专栏——Qt界面优化中,大家如果感兴趣可以进行观看并使用,希望通过这些文章能够使大家的Qt软件更加美观和完美 !!!
另,如果大家有时间的话,也可以在个人主页中的专栏部分,查看我的Qt实战专栏与Qt功能优化专栏哦,里面分别存放有Qt相关的实战软件和相对实用的附属功能,大家感兴趣可以看看(๑><๑)
另附Qt实战:云曦聊天室篇和Qt功能优化:Qt链接外部程序两篇相关文章,大家可以下滑到文章下方专栏处,查看相关专栏中的其它文章,希望能帮助到大家,感谢大家支持~( ̄▽ ̄~)~