【QT】QT UI 美化

2014年05月15日  C++  评论 0 条  阅读 518 次

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

- 设置程序界面风格

在main函数中

1 2 3 4 5 6

QApplication::setStyle( "windows" ); QApplication::setStyle( "windowsxp" ); QApplication::setStyle( "motif" ); QApplication::setStyle( "cde" ); QApplication::setStyle( "macintosh" ); QApplication::setStyle( "plastique" );

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

- 设置窗口样式

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

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

// 没有标题栏图标、没有任何按钮，只有标题

1	Qt::CustomizeWindowHint | Qt::WindowTitleHint

用法一：

1 2 3 4 5

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

用法二：

1 2 3 4 5 6 7

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

- 窗口在屏幕居中显示

1	#include <QDesktopWidget>

方法一：

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

方法二：

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

注：w 为Qt窗口对象（如QMainWindow、QDialog等）

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

在程序中加入如下代码即可：

1 2	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. 设置窗口图标

1	QWidget.setWindowIcon(QIcon( ":res/logo.png" ));

    注意：“res”为资源文件（.qrc）中的前缀，“logo.png”为logo.png的别名，不要遗漏了前面的“:”

4. 测试

    完成上述操作后，重新构建工程并执行即可看到效果

- 鼠标指针

1. 隐藏指针

1 2 3 4 5 6

#include <QWSServer> ... QWSServer::setCursorVisible(FALSE);                   // 添加在MainWindow的构造函数中 2. 设置指针样式 QApplication::setOverrideCursor(Qt::WaitCursor);      // 设置指针为等待状态（漏斗状） QApplication::restoreOverrideCursor();                // 还原鼠标指针为默认

- 修改控件样式

 

1 2 3 4 5

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

// 无边框，背景透明

1	ui->lineEdit->setStyleSheet( "QLineEdit{background-color: rgba(0,0,0,0);border-width:0;border-style:outset}" );

3. QPushButton

1	ui->pb->setStyleSheet( "background:red" );        // 改变QPushButton颜色

* 其他可用的颜色还有 yellow、blue、green、black、white等。

1 2 3 4 5 6 7

4. QDockWidget QWidget* titleWidget =  new  QWidget( this ); ui->dockWidget->setTitleBarWidget(titleWidget);        // 隐藏标题栏 ! 清除所有样式 ui->pb->setStyleSheet( "" ); or ui->pb->styleSheet().clear();

! 去掉控件焦点

1	widget->setFocusPolicy(Qt::NoFocus);

- 半透明窗体

1. 制作一张半透明背景图片（PNG格式，调节适当的透明度）

2. 加入如下代码：

1 2 3

this ->move(0, 0);                                         // 定位窗体显示位置 this ->setWindowFlags(Qt::FramelessWindowHint);            // 必须设置为这种窗体风格 this ->setAttribute(Qt::WA_TranslucentBackground);         // 设置“透明背景”属性

注意：若使用上述方法不能将窗体设置为Qt::FramelessWindowHint风格，则可尝试下述方式：

1 2 3 4 5 6

BNumPad::BNumPad(QWidget *parent) :      QDialog(parent, Qt::FramelessWindowHint),      ui( new  Ui::BNumPad) {      ... }

-  在文本框中显示图标

1. 用一个 QFrame/QLabel 显示图标，将其置于QLineEdit上方。

2. 设置QLineEdit属性。

1	ui->lineEdit->setTextMargins(21, 0, 0, 0);      // 将图标置于QLineEdit左侧的设置方法

- 启动界面示例

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

#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(); }