1. 程式人生 > >QT之介面實現技巧

QT之介面實現技巧

一、主介面

1、視窗 最小化 最大化 關閉按鈕、顯示狀態自定義

setWindowFlags(Qt::CustomizeWindowHint);

setWindowFlags(Qt::WindowCloseButtonHint); //只要關閉按鈕

setWindowFlags(Qt::WindowFlags type)

Qt::FrameWindowHint:沒有邊框的視窗

Qt::WindowStaysOnTopHint:  //總在最上面的視窗

Qt::CustomizeWindowHint:  //自定義視窗標題欄,以下標誌必須與這個標誌一起使用才有效,否則視窗將有預設的標題欄

Qt::WindowTitleHint  //顯示視窗標題欄

Qt::WindowSystemMenuHint  //顯示系統選單

Qt::WindowMinimizeButtonHint  //顯示最小化按鈕

Qt::WindowMaximizeButtonHint  //顯示最大化按鈕

Qt::WindowMinMaxButtonsHint  //顯示最小化按鈕和最大化按鈕

Qt::WindowCloseButtonHint  //顯示關閉按鈕

2、隱藏工作列顯示

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

3、關閉按鈕實現的功能

hide(); //進行介面隱藏,但是顯示托盤,可通過點選托盤實現介面的重新顯示

quit(); //退出系統

4、繪製背景圖片並且實現圓角效果

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畫素

 }

5、設定應用程式的字型

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

QApplication::setFont(font);

6、設定元件字型

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);  //設定對齊方式

7、超連結

QLabel *url_label = new QLabel();

url_label->setOpenExternalLinks(true);//這句比較關鍵,也可以通過連線linkActivated訊號到自定義槽函式中開啟

url_label->setText(tr(“Google”));

8、開啟本地檔案(夾)

QDesktopServices::openUrl(QUrl::fromLocalFile(local_file));

9、顯示視窗並激活/提升

showNormal();
raise();
activateWindow();

10、設定滾動條值
textEdit->verticalScrollBar()->setValue(0); //滾動到最頂層
textEdit->verticalScrollBar()->setValue(textEdit->verticalScrollBar()->maximum()); //滾動到最底層
二、全屏顯示與還原

關於這個問題,當做一個大的標題來討論,因為比起其它小技巧要稍微複雜一些!

全屏顯示:

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

(包括設定下拉箭頭、下拉選項高度等)、
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);}”);

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;

}

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;

}

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);

}

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;

}

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 指按鈕視窗部件的前景色