[Qt] 界面美化 [2013-06-17更新](转载)

- 经验总结

1. 可用对话框(QDialog)模拟类似Android中toast的效果。


- 设置程序界面风格

在main函数中
QApplication::setStyle("windows");
QApplication::setStyle("windowsxp");
QApplication::setStyle("motif");
QApplication::setStyle("cde");
QApplication::setStyle("macintosh");
QApplication::setStyle("plastique");

风格可以是 "windows", "motif", "cde", "plastique", "windowsxp", "macintosh"


- 设置窗口样式

setWindowFlags(flags)

flags:
Qt::WindowContextHelpButtonHint
Qt::FramelessWindowHint               // 去掉标题栏
Qt::CustomizeWindowHint
Qt::WindowTitleHint                   // 只有标题栏,没有窗口控制按钮
Qt::WindowSystemMenuHint
Qt::WindowCloseButtonHint
Qt::WindowMaximizeButtonHint
Qt::WindowMinimizeButtonHint
Qt::SubWindow
Qt::Desktop
Qt::SplashScreen
Qt::ToolTip
Qt::Tool

// 没有标题栏图标、没有任何按钮,只有标题
Qt::CustomizeWindowHint | Qt::WindowTitleHint

用法一:
clientMainWindow::clientMainWindow(QWidget *parent) :
    QMainWindow(parent, Qt::WindowCloseButtonHint)
{
    ...
}

用法二:
clientMainWindow::clientMainWindow(QWidget *parent) :
    QMainWindow(parent )
{
    ...
    this->setWindowFlags(Qt::WindowCloseButtonHint);
    ...
}


- 窗口在屏幕居中显示

#include <QDesktopWidget>

方法一:
w.move((QApplication::desktop()->width() - w.width()) / 2,
       (QApplication::desktop()->height() - w.height()) / 2);

方法二:
QDesktopWidget *desktop = QApplication::desktop();     // = qApp->desktop() 也可以
w.move((desktop->width() - this->width()) / 2,  (desktop->height() - this->height()) / 2);

注:w 为Qt窗口对象(如QMainWindow、QDialog等)


- 修改UI程序在桌面的起始位置

在程序中加入如下代码即可:
w.move(x, y);     // 屏幕左上角为(0, 0),x、y为相对于(0, 0)的偏移值

// w为Qt窗口对象(可以是QMainWindow、QDialog等)


- 去掉标题栏左侧的图标

1. 创建透明图标
    使用PhotoShop创建一个透明的图标
    参考设置:

大小:1 X 1 px
        名称:logo.png

2. 添加图标到工程
    1) 在工程目录下创建“res”目录,将logo.png拷贝到此目录
    2) 在工程中添加一个资源文件,命名为“icon.qrc”
    3) 在icon.qrc中添加一个前缀(此处为“res”),在该前缀下添加一个文件,把logo.png添加进来
    4) 为logo.png设置别名(此处把别名设为与文件名相同,即“logo.png”)
    注意:在工程中调用时使用的是别名。

3. 设置窗口图标
    QWidget.setWindowIcon(QIcon(":res/logo.png"));
    注意:“res”为资源文件(.qrc)中的前缀,“logo.png”为logo.png的别名,不要遗漏了前面的“:”

4. 测试
    完成上述操作后,重新构建工程并执行即可看到效果


- 鼠标指针

1. 隐藏指针
#include <QWSServer>
...
QWSServer::setCursorVisible(FALSE);                  // 添加在MainWindow的构造函数中

2. 设置指针样式
QApplication::setOverrideCursor(Qt::WaitCursor);     // 设置指针为等待状态(漏斗状)
QApplication::restoreOverrideCursor();               // 还原鼠标指针为默认


- 修改控件样式

1. QLabel

ui->label->setText("<b><font color=blue size=30>test!</font></b>");   // 修改QLabel文字样式

ui->label->setPixmap(QPixmap(":res/logo_png"));       // 显示图片

ui->label->setScaledContents(true);                   // 图片适应label大小(在显示图片前调用)

ui->label->setWordWrap(true);                         // 自动换行(生效前提:内容包含中文或间隔符,如空格)

2. QLineEdit
// 无边框,背景透明
ui->lineEdit->setStyleSheet("QLineEdit{border-width:0;border-style:outset}");

3. QPushButton

ui->pb->setStyleSheet("background:red");       // 改变QPushButton颜色
* 其他可用的颜色还有 yellow、blue、green、black、white等。

4. QDockWidget
QWidget* titleWidget = new QWidget(this);
ui->dockWidget->setTitleBarWidget(titleWidget);       // 隐藏标题栏

! 清除所有样式
ui->pb->setStyleSheet("");

or

ui->pb->styleSheet().clear();

! 去掉控件焦点

widget->setFocusPolicy(Qt::NoFocus);


- 半透明窗体

1. 制作一张半透明背景图片(PNG格式,调节适当的透明度)
2. 加入如下代码:
this->move(0, 0);                                        // 定位窗体显示位置
this->setWindowFlags(Qt::FramelessWindowHint);           // 必须设置为这种窗体风格
this->setAttribute(Qt::WA_TranslucentBackground);        // 设置“透明背景”属性

注意:若使用上述方法不能将窗体设置为Qt::FramelessWindowHint风格,则可尝试下述方式:
BNumPad::BNumPad(QWidget *parent) :
    QDialog(parent, Qt::FramelessWindowHint),
    ui(new Ui::BNumPad)
{
    ...
}


-  在文本框中显示图标

1. 用一个 QFrame/QLabel 显示图标,将其置于QLineEdit上方。
2. 设置QLineEdit属性。
    ui->lineEdit->setTextMargins(21, 0, 0, 0);     // 将图标置于QLineEdit左侧的设置方法


- 启动界面示例

#include <QtGui/QApplication>
#include <QSplashScreen>
#include <QTimer>
#include "mainwindow.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
   
    QPixmap pixmap(":res/bg");
    QSplashScreen splash(pixmap);
    splash.show();

QTimer::singleShot(1500, &splash, SLOT(hide()));
    QTimer::singleShot(2000, &w, SLOT(show()));

return a.exec();
}

时间: 2024-11-14 03:41:36

[Qt] 界面美化 [2013-06-17更新](转载)的相关文章

Qt界面美化 QSS

目前发现在Qt-Design中右击控件,可以选择Change StyleSheet ------------------------以下总结不太对 刚接触Qt,发现Qt Design无法对每个控件进行颜色风格设置.正在纳闷如此受欢迎的开发工具,怎么会没有这种,Delphi,VB,VC,C#都具备的基本功能呢? 后来在CSDN上才知道,Qt已经走在这些工具的最前方了,把界面已经独立出来和web编程一样.web有CSS专门美化工作.而Qt也有QSS进行美化设计.完全可以不影响程序开发.而且可以直接调

Qt Creator中使用qss对界面美化没有作用(效果)的问题

最近在研究qt界面开发,发现使用qss对界面进行美化后效果不错,要比mfc效率高很多,美化效果也很出色.但是在使用qss文件对界面控件进行美化的过程中遇到了个很奇葩的问题,困惑了我好久,今晚又遇到了,感觉整个人都不好了,问题症状如下: (1)我在Qt Creator中新建了一个工程,添加qss文件及内容后运行,加载qss文件并运行程序,qss美化效果死活出不来(经检查,qss内容及加载过程都正确): (2)在Qt Creator中打开一个现有项目,该项目中含有qss文件,能正确加载,在别的电脑上

【Qt编程】基于Qt的词典开发系列&lt;三&gt;--界面美化设计

本文讲一讲界面设计,作品要面向用户,界面设计的好坏直接影响到用户的体验.现在的窗口设计基本都是扁平化的,你可以从window  XP与window 8的窗口可以明显感觉出来.当然除了窗口本身的效果,窗口中各种控件的特效也是特别重要的一环.下面讲讲我在词典软件中的一些设计:说到界面美化的设计,不得不提到美工,一个好的美工是想当的重要!软件毕竟少不了图标,而不懂美工的我,也就只能在网上使用别人的图标了. 如何得到网上的图标? 直接百度就可以了,当然还有另一种方法:就是从别人的文件中提取这些图标文件.

高仿富途牛牛-组件化(三)-界面美化

目录 一.概述 二.效果展示 三.工具箱 1.布局 2.功能详解 四.组件模板工具栏 五.其他界面美化 六.使用qss文件 七.相关文章 一.概述 今天是组件化的第三篇文章了,前两篇文章主要是以功能为主,分别讲解了 高仿富途牛牛-组件化(一)-支持页签拖拽.增删.小工具和高仿富途牛牛-组件化(二)-磁力吸附,其中也不乏有一些小的bug,不过这些都不是问题. 之前的效果展示只是为了表达意思,界面是真的丑,标准的程序员审美,哈哈哈.今天这篇文章主要是对之前的程序进行了美化,并且进行了一些bug的修改

安装Visual Studio 2013 update 2 更新包记录和新功能简单体验

昨天下载了进4个小时,将visual studio 2013 update 2 更新包和visual studio 2013 完整安装包(包含UPDATE2)的下载完成,今天抽出时间体验一下,昨天在网上看了一下英文翻译的说明,增加了一些支持和改进,我只是针对于我所看到的来操作使用一下,看看有啥变化吧.将ISO文件加载到虚拟光驱,然后开始安装更新包,界面弹出后告诉我需要大概3个多G的硬盘空间,嗨真是大啊.点击安装开始继续安装,我截个图如下 剩下是就是等着安装完成了,整个安装过程还是比较慢的,安装的

Unity3D NGUI自适应屏幕分辨率(2014/4/17更新)

原地址:http://blog.csdn.net/asd237241291/article/details/8126619 原创文章如需转载请注明:转载自 脱莫柔Unity3D学习之旅 本文链接地址:Unity3D NGUI自适应屏幕分辨率 1.UIRoot:根据高度自适应屏幕分辨率. NGUI根目录的UIRoot组件自带了根据高度自适应分辨率的功能. Scaling Style属性可选择三种不同的缩放策略. PixelPerfect 完美像素:直接显示设定好的像素.当屏幕高度低于minimum

QT界面开发-(特效)无边框窗口+背景图片

转发自邵发<C/C++系列教程>Qt界面开发 https://chuanke.baidu.com/4509752-209060.html 1.自己用代码画界面 2.用Laber控件放一张背景大图 hpp 1 #include <QtWidgets> 2 3 4 private: 5 virtual void paintEvent(QPaintEvent *event); 6 7 virtual void mouseMoveEvent(QMouseEvent * event); 8

【博客美化】06.添加QQ联系链接

博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加GitHub链接 [博客美化]06.添加QQ交谈链接 1.添加GitHub链接 进入自己的博客园->设置,将以下html代码添加到“页首Html代码” <a href="https://github.com/Jackson0714" target="_blank"

【博客美化】06.添加QQ交谈链接

博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加GitHub链接 [博客美化]06.添加QQ交谈链接 1.添加QQ交谈链接 进入自己的博客园->设置,将以下html代码添加到“博客侧边栏公告” <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=343