zoukankan      html  css  js  c++  java
  • Qt之界面实现技巧-- 窗体显示,绘制背景,圆角,QSS样式

    转自 --》 http://blog.sina.com.cn/s/blog_a6fb6cc90101dech.html

    总结一下,在开发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;

    10px;

    border-radius:5px;

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

    }

    Qt之界面实现技巧

    5、QCheckBox:

    QCheckBox{

    spacing: 2px; 

    }

    QCheckBox::indicator {

    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;

      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之界面实现技巧
     

    一般也可以使用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  指按钮窗口部件的前景色


      以上是遇到的常用但有资料较少的组件的样式,注重细节才能做出好的产品!

      有待完善。。。

  • 相关阅读:
    hdu 5795 A Simple Nim 博弈sg函数
    hdu 5724 Chess 博弈sg+状态压缩
    hdu 3094 A tree game 树上sg
    2017"百度之星"程序设计大赛
    hdu 6134 Battlestation Operational 莫比乌斯反演
    HDU 6143 Killer Names DP+快速密
    HDU 6107 Typesetting 倍增
    HDU 6096 String 排序 + 线段树 + 扫描线
    HDU 6086 Rikka with String AC自动机 + DP
    HDU 6073 Matching In Multiplication dfs遍历环 + 拓扑
  • 原文地址:https://www.cnblogs.com/xj626852095/p/3648100.html
Copyright © 2011-2022 走看看