Qt界面技巧

一、主界面

1、无边框

   setWindowFlags(Qt::FramelessWindowHint)

2、界面始终位于顶部位置

   setWindowFlags(Qt::WindowStaysOnTopHint)

3、任务栏图标点击时进行显示/不显示切换

   setWindowFlags(Qt::WindowMinimizeButtonHint)

4、隐藏任务栏显示

   setWindowFlags(Qt::Tool | Qt::X11BypassWindowManagerHint)

5、关闭按钮实现的功能

   hide(); //进行界面隐藏,但是显示托盘,可通过点击托盘实现界面的重新显示

   quit(); //退出系统

6、绘制背景图片并且实现圆角效果

   void LoginDialog::paintEvent(QPaintEvent *)

   {

   QPainter painter(this);
   QBrush brush;
   brush.setTextureImage(QImage(background_image)); //背景图片
   painter.setBrush(brush);
   painter.setPen(Qt::black);  //边框色
   painter.drawRoundedRect(this->rect(), 5, 5); //圆角5像素

   }

7、设置应用程序的字体

   QFont font("Courier", 10, QFont::Normal, false);

   QApplication::setFont(font);

8、设置组件字体
   QFont font = this->font();
   font.setFamily("Courier");  //字体名称
   font.setPixelSize(16);  //字体点大小
   font.setPointSize(18);  //字体像素大小
   font.setBold(true);  //是否加粗
   font.setItalic(true);  //是否斜体
   font.setUnderline(true);  //是否下划线
   this->setFont(font);

   字体风格,包括类型、大小、是否加粗、是否斜体等!

   也可以使用:setStyleSheet("text-align:center; font-size:18px; font-weight:bold; font-style:Courier; color:white; ");

   setAlignment(Qt::AlignCenter);  //设置对齐方式


二、全屏显示与还原

   关于这个问题,当做一个大的标题来讨论,因为比起其它小技巧要稍微复杂一些!

   全屏显示:

1、遮挡任务栏:

   showFullScreen()、showMaximized()这两个都可以!

2、不遮挡任务栏:

   void MainWidget::showMaximize()

   {

   //若已经最大化

   if(is_max)

   {

   //恢复界面位置,并设置按钮图标为最大化图标,提示“最大化”

   this->setGeometry(location);

   max_button->setIcon(QIcon("maxbtn"));

  max_button->setToolTip(tr("max"));

   } 

   else 

   {

   //设定当前界面的位置,还原时使用

   location = this->geometry();

   //获取桌面位置,设置为最大化,并设置按钮图标为还原图标,提示“还原”

   QDesktopWidget *desk = QApplication::desktop();

   this->setGeometry(desk->availableGeometry());

  max_button->setIcon(QIcon("restorbtn"));

  max_button->setToolTip(tr("restor"));

   }

   is_max = !is_max;

}

   注意:窗口既然可以最大化,当然还要进行还原,is_max为一个bool值变量,表示窗口是否最大化,初始值为false。location为桌面的位置,每次最大化开始先记录当前的位置,等待还原时候使用。


三、QSS样式

1、QComboBox:

combo_box->setStyleSheet("QComboBox{border:1px solid gray;}"
  "QComboBox QAbstractItemView::item{height:25px;}"
  "QComboBox::down-arrow{image:url(:/icon/arrowdown);}"
  "QComboBox::drop-down{border:0px;}");
 combo_box->setView(new QListView());

Qt之界面实现技巧(包括设置下拉箭头、下拉选项高度等)、


2、QSpinBox:

spin_box->setStyleSheet("QSpinBox{border:1px solid gray;}"
  "QSpinBox::up-button{image:url(:/icon/arrow_up);}"
  "QSpinBox::down-button{image:url(:/icon/arrow_down);}");

 Qt之界面实现技巧


3、QMenu:

 QMenu{

padding:5px;

   background:white;

border:1px solid gray;

 }

 QMenu::item{

padding:0px 40px 0px 30px;

height:25px;

 }

 QMenu::item:selected:enabled{

   background:lightgray;

   color:white;

 }

  QMenu::item:selected:!enabled{

   background:transparent;

 }

 QMenu::separator{

   height:1px;

   background:lightgray;

margin:5px 0px 5px 0px;

 }

Qt之界面实现技巧

4、QSlider:

QSlider::groove:horizontal{

border:0px;

height:4px;

}  

QSlider::sub-page:horizontal{

   background:white;

}  

QSlider::add-page:horizontal{

   background:lightgray;

} 

QSlider::handle:horizontal{

background:white;

width:10px;

border-radius:5px;

margin:-3px 0px -3px 0px;

}

Qt之界面实现技巧

5、QCheckBox:

QCheckBox{

spacing: 2px; 

}

QCheckBox::indicator {

width: 20px;

height: 20px;

}

QCheckBox::indicator:unchecked {

image: url(:/login/checkbox);

}

QCheckBox::indicator:unchecked:hover {

image: url(:/login/checkbox_hover);

}

QCheckBox::indicator:unchecked:pressed {

image: url(:/login/checkbox_press);

}

QCheckBox::indicator:checked {

image: url(:/login/checkbox_selected);

}

QCheckBox::indicator:checked:hover {

image: url(:/login/checkbox_selected_hover);

}

QCheckBox::indicator:checked:pressed {

image: url(:/login/checkbox_selected_press);

}

Qt之界面实现技巧

6、QScrollBar:

QScrollBar{

background:transparent;

  width: 10px;

}

QScrollBar::handle{

background:rgb(180, 180, 180, 150);

}

QScrollBar::handle:hover{

background:rgb(150, 150, 150, 180);

}

QScrollBar::add-page{

background:transparent;

}

QScrollBar::sub-page{

background:transparent; 

}

QScrollBar::sub-line{

background:transparent;

}

QScrollBar::add-line{

background:transparent;

}

Qt之界面实现技巧
 

7、QStatusBar

QStatusBar::item{

border: 0px;

}

 //不存在分隔线


一般也可以使用QPalette

QPalette palette;  

palette.setBrush(QPalette::WindowText, QBrush(Qt::white));  

check_box->setPalette(palette);  


check_box->setStyleSheet("color:white");


调色板类QPalette提供了颜色角色(color roles)的概念,指当前界面中颜色的职责,通过枚举变量

QPalette::ColorRole来定义,比较常用的角色有:

QPalette::Window  通常指窗口部件背景色

QPalette::WindowText  通常指窗口部件的前景色

QPalette::Base  指文本的背景色(QTextEdit、QLineEdit等)

QPalette::Text  与QPalette::Base一块使用,指文本输入窗口部件前景色

QPalette::Button   指按钮窗口部件的背景色

QPalette::ButtonText  指按钮窗口部件的前景色

原文链接:[url]http://blog.sina.com.cn/s/blog_a6fb6cc90101dech.html[/url]