QT中 窗口部件的 背景图片 的设置

2023-05-16

分类: QT 2013-04-08 11:06  359人阅读  评论(0)  收藏  举报

目录(?)[+]

如何设置对话框的自定义的背景颜色?  

2010-03-14 14:34:11|  分类: Linux 、windows |  标签: |字号 订阅

1:重写paintEvent()事件。在该事件中用画笔QPainter的方式画整个背景。

2:用调色板QPalette。
      1定义一个QPalette对象
       2设置QPalette对象的背景属性(颜色或图片)
        3设置 autoFillBackground属性为真
        4最后设置QWidget对象的Palette

    ( 下边代码中:ptr为指向要设置的widget的指针。)

    (1):
       QWidget  *ptr =new QWidget  ;
      QPalette palette;
        palette.setBrush(QPalette::Background,QBrush(Qt::red));
        ptr->setPalette(palette);
        ptr->setAutoFillbackground(true);
  QWidget ->show();
        该方法中: 如果只有前三句是不会生效的。必须加上最后ptr->setAutoFillbackground(true)才生效!

    (2):QPalette palette = ptr->palette();

           palette.setBrush(QtPalette::Background,QBrush(Qt::red));

           ptr->setPalette(palette);

           ptr->setAutoFillbackground(true);

        

               该方法中:比前一种方法的改进之处是:因为palette()这个函数在QWidget体系和 QGraphicsWidget体系中都有,所以:上述代码可以在这两种体系中通用!

     (3)QPalette palette = ptr->palette();

             palette->setBrush(QPalette::Active,QPalette::Window,QBrush(....))

         ptr->setPalette(palette);

         ptr->setAutoBackground(true);                           

        

             推荐用这种方法,大家可以查看一下

             QPalette::setBrush ( ColorGroup group, ColorRole role, const QBrush & brush )  

             这个重载函数的声明,这个函数可以设置很多东西!其第二个参数指定要设置的角色!这里举几个例  子:  如果ptr指向的是一个QListWidget或者QTextEdit对象,则将第二个参数设置 成 :QPalette::Text,则是设置其中文字的颜色,如果是QPalette::BrightText,则是设置当被选中时:文字的颜色,而Palette::Bright则是设置选中时高亮背景的颜色或者图片。因为该函数可               以设置的角色众多,所以功能也相对强大!

     (4)用样式表。

             ptr->setStyleSheet("background-color:yellow;");  //设置背景颜色

         ptr->setStyleSheet("background-image:url(:/folder/aa.bmp);"); //设置背景图片

此外,还有一些很有意思的方法,比如用setHtml(),insetHtml()这种用HTML语言的方式来指定的等等,大家可以多查查帮助文档搜索一下~~
 

Qt中设置widget背景颜色/图片的注意事项(使用样式表 setStyleSheet())

    这个函数我一直很喜欢使用,因为只要写一句就可以实现效果,比其他方法都简单,但是其却有一个很值得注意的地方,也就是这个地方让我大吃苦头。

    亦即:①:该函数只能用于设置有父窗口的子窗口的背景!如果一个窗口没有子窗口,则无法使用该函数来设置背景颜色或图                             片!!

             ②:同时:对于一个父窗口而言:如果我们用setStyleShette设置了其样式,而对于其子窗口:如果没有用同样的函数来设                    置的话, 则其子窗口的样式和其父窗口完全一致,亦即:其集成了自己父窗口的样式!

             ③:延伸:对顶层窗口(没有父窗口),其有若干个子窗口,则当我们用setStyleShette来设置这个顶层窗口的样式后,依据①可知:该父窗口本身没有任何变化,亦即设置没有生效;而其子窗口:只要子窗口本身没有用setStyleShette来设置自己的样式表,则其就是用的自己父窗口的样式表!!

MainWin::MainWin()

iButton = new QPushButton(this);

iLabel = new QLabel(iButton);

QPalette palette;

palette.setBrush(iLabel->backgroundRole(),QBrush(QImage(":/bmp/1257253475842.jpg")));

iLabel->setPalette(palette);

iLabel->setAutoFillBackground(true);

}

总结:

     1:不要在顶层窗口(无父类的窗口)中使用setStyleSheet() ,否则其一父窗口的背景不会改变,其次其子窗口的背景设置方法变得局限唯一,不能再使用其它方法!

     2:如果一个一般窗口(非顶层窗口)还有子窗口,那最好不要使用setStyleSheet()来设置其背景颜色,因为虽然此时该窗口的背景设置是生效的,但是其子窗口的背景设置也变得局限唯一,只能使用setStyleSheet,而不能使用其它方法!  当然:你如果就是只想使用这种方法,那也完全可以!!

     说白了就是:不要再MainWindow中使用setStyleSheet()!

      而上边之所以强调拓宽子窗口设置背景的方法范围,这是因为:如果只能用setStyleSheet样式表来设置背景图片的话,该图片是无法缩放的,如果其大小与widget窗口大小不相符,则我们无法用程序来实现图片的缩放,除非我们直接处理图片使其大小与widget窗口相符; 而如果不局限于用setStyleSheet样式表来设置的话,我们可以选择用QPalette调色版,其内部setBrush()之前,我们完全可以先对图片进行scale缩放再刷到窗口上,这样就避免直接去处理图片,灵活性强一点!



关于(4)用样式表。找到了一篇博文来详细讲解:

分类: QT转载 2010-08-17 17:10  7738人阅读  评论(5)  收藏  举报
qt url 2010

 在Qt中设置widget背景颜色或者图片方法很多种:重写paintEvent() , 调色板QPalette , 样式表setStyleSheet等等。

      但是各种方法都有其注意事项,如果不注意则很容易陷入麻烦中。

1:setStyleSheet()

     这个函数我一直很喜欢使用,因为只要写一句就可以实现效果,比其他方法都简单,但是其却有一个很值得注意的地方,也就是这个地方让我大吃苦头。

    亦即:①:该函数只能用于设置有父窗口的子窗口的背景!如果一个窗口没有子窗口,则无法使用该函数来设置背景颜色或图                             片!!

             ②:同时:对于一个父窗口而言:如果我们用setStyleShette设置了其样式,而对于其子窗口:如果没有用同样的函数来设                    置的话, 则其子窗口的样式和其父窗口完全一致,亦即:其集成了自己父窗口的样式!

             ③:延伸:对顶层窗口(没有父窗口),其有若干个子窗口,则当我们用setStyleShette来设置这个顶层窗口的样式后,依据①可知:该父窗口本身没有任何变化,亦即设置没有生效;而其子窗口:只要子窗口本身没有用setStyleShette来设置自己的样式表,则其就是用的自己父窗口的样式表!!

     例如:

     主窗口(没有父类)为MainWin

MainWin::MainWin()

{

this->setStyleSheet("background-image:url(:/bmp/IMG_0345.JPG)");

iButton = new QPushButton(this);

iLabel = new QLabel(iButton);

}

    运行一下,效果如下:

 亦即:虽然我们设置的是顶层的父窗口,但是该样式却是在其子窗口中生效,而顶层父窗口没有任何变化! 这验证了①。

修改一下上例代码:

MainWin::MainWin()

{

this->setStyleSheet("background-image:url(:/bmp/IMG_0345.JPG)");

iButton = new QPushButton(this);

iLabel = new QLabel(iButton);

iLabel->setStyleSheet("background-image:url(:/bmp/1257253475842.jpg)");

}

       则运行效果如下:

 可见:子窗口只有调用setStyleSheet()设置了自己的样式后才可以隔断父窗口的样式,否则其将是用父窗口的样式。

       再修改一下代码:

MainWin::MainWin()

{

iButton = new QPushButton(this);

iButton ->setStyleSheet("background-image:url(:/bmp/IMG_0345.JPG)");

iLabel = new QLabel(iButton);

}

运行一下,效果如下:

可见:设置有父窗口的子窗口时:setStyleSheet()一定生效!!!

  后来我又思考了一个问题,那就是:对于顶层父窗口,如果我setStyleSheet()设置了样式表,而对其子窗口,我用其他方法,比如用QPalette调色板来设置背景图片/颜色,这时子窗口的背景到底是由继承自父窗口的样式表决定呢还是由子窗口本身的QPalette调色板决定呢?

再次修改代码:

MainWin::MainWin()

{

this->setStyleSheet("background-image:url(:/bmp/IMG_0345.JPG)");

iButton = new QPushButton(this);

iLabel = new QLabel(iButton);

QPalette palette;

palette.setBrush(iLabel->backgroundRole(),QBrush(QImage(":/bmp/1257253475842.jpg")));

iLabel->setPalette(palette);

iLabel->setAutoFillBackground(true);

}

此段代码中我用QPalette来设置子窗口的背景图片,看下到底是样式表还是调色板生效,效果如下

 

 

由此可见:一旦顶层窗口设置了样式表,则其子窗口无论用什么方法来设置背景(只能用同样方式setStyleSheet来设置更改),都会不生效!!!

那如果不是顶层窗口而仅仅是一般窗口设置了样式表呢?再次修改代码:

MainWin::MainWin()

{

iButton = new QPushButton(this);

iButton ->setStyleSheet("background-image:url(:/bmp/IMG_0345.JPG)");

iLabel = new QLabel(iButton);

QPalette palette;

palette.setBrush(iLabel->backgroundRole(),QBrush(QImage(":/bmp/1257253475842.jpg")));

iLabel->setPalette(palette);

iLabel->setAutoFillBackground(true);

}

运行效果同上,这说明:不管是顶层窗口还是一般窗口,只要用setStyleSheet设置了样式表,则其子窗口用其它方式设置背景颜色/图片均不生效,只能用同样方式setStyleSheet来设置更改!!!

为了验证上边的结论,再次修改代码:

MainWin::MainWin()

iButton = new QPushButton(this);

iLabel = new QLabel(iButton);

QPalette palette;

palette.setBrush(iLabel->backgroundRole(),QBrush(QImage(":/bmp/1257253475842.jpg")));

iLabel->setPalette(palette);

iLabel->setAutoFillBackground(true);

}

运行一下:

 

此时调色板才生效,这也间接证明了上述结论。

==========================================================================

总结:

     1:不要在顶层窗口(无父类的窗口)中使用setStyleSheet() ,否则其一父窗口的背景不会改变,其次其子窗口的背景设置方法变得局限唯一,不能再使用其它方法!

     2:如果一个一般窗口(非顶层窗口)还有子窗口,那最好不要使用setStyleSheet()来设置其背景颜色,因为虽然此时该窗口的背景设置是生效的,但是其子窗口的背景设置也变得局限唯一,只能使用setStyleSheet,而不能使用其它方法!  当然:你如果就是只想使用这种方法,那也完全可以!!

     说白了就是:不要再MainWindow中使用setStyleSheet()!

      而上边之所以强调拓宽子窗口设置背景的方法范围,这是因为:如果只能用setStyleSheet样式表来设置背景图片的话,该图片是无法缩放的,如果其大小与widget窗口大小不相符,则我们无法用程序来实现图片的缩放,除非我们直接处理图片使其大小与widget窗口相符; 而如果不局限于用setStyleSheet样式表来设置的话,我们可以选择用QPalette调色版,其内部setBrush()之前,我们完全可以先对图片进行scale缩放再刷到窗口上,这样就避免直接去处理图片,灵活性强一点!

 

本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/NRC_DouNingBo/archive/2010/05/07/5565212.aspx

 

关于使用setStyleShee来设定窗口样式的文章,参看

http://blog.csdn.net/xie376450483/archive/2010/10/07/5925723.aspx



======关于样式表的语法(用法)==========

样式表语法:
样式表语法基本和HTML CSS语法一致。
样式表包含了样式规则序列,样式规则有一个<selector>和<declaration>组成,<selector>指定哪些窗口将会被这些规则影响,<declaration>指定哪些属性将会被设定在窗口上,例如
QPushButton{color:red}
在上面的,规则中,QPushButton是<selector>,{color:red}是<declaration>,这个规则指定QPushButton和他的子类将使用红色作为前景颜色,就是字体颜色,并且对大小写没有分别,对于

color,ColoR,COLOR是一样的。
几个<selector>可以同时被列出,使用逗号","来分开各个<selector>,例如:
QPushButton, QLineEdit, QComboBox { color: red }
<declaration>部分是一对 属性:值  对,用{}来括起来,使用分号来分开各个属性,例如
QPushButton { color: red; background-color: white }

可以参看Qt Style Sheets Reference来查看部件以及样式表的属性列表

 

关于样式表的级联属性
看下面代码的不同
 btn1->setStyleSheet("QPushButton{color:red}"); //设定前景颜色,就是字体颜色
 btn1->setStyleSheet("QPushButton{background:yellow}"); //设定背景颜色为红色

btn1->setStyleSheet("QPushButton{color:red;background:yellow}");
第一个代码只能显示黄色背景,第二个确实红色字体,黄色背景,
所以当设定一个部件时候,要在同一个>setStyleSheet()中完全写出来。

 

 

源代码示例:

 

Dialog::Dialog(QWidget *parent) :
    QDialog(parent),
    ui(new Ui::Dialog)
{
    ui->setupUi(this);
    this->setWindowFlags(this->windowFlags()&Qt::WindowMaximizeButtonHint&Qt::WindowMinimizeButtonHint); //为对话框添加上最大化和最小化按钮
//    layout=new QBoxLayout(this);
    layout1=new QGridLayout(this);
    btn1=new QPushButton(this);
    btn1->setStyleSheet("QPushButton{color:red;background:yellow}"); //设定前景颜色,就是字体颜色
//    btn1->setStyleSheet("QPushButton{background:yellow}");
    btn1->setText("Button1");

    btn2=new QPushButton(this);
    btn2->setStyleSheet("QPushButton{color:red;background-color:rgb(200,155,100)}"); //使用rgb来设定背景颜色
    btn2->setText("Button2");

     btn3=new QPushButton(this);
     btn3->setStyleSheet("QPushButton{background-image:url(image/1.png);background-repeat: repeat-xy;background-position: center;background-attachment: fixed;background-attachment: fixed;background-attachment: fixed;;background-clip: padding}");
     //设定按钮的背景图片,background-repeat可以设定背景图片的重复规则,这里设定仅在xy方向都重复,所以图片会被重复一次
     //background-position用来设定图片的位置,是左(left)还是右(right),还是在中间(center),是上(top)还是底部(bottom)
     //background-attachment用来这定背景图片是否卷动或者和窗口大小相匹配,默认是卷动的
     btn3->setText("Button3");

     btn4=new QPushButton(this);
     btn4->setStyleSheet("QPushButton{border: 3px solid red;border-radius:8px}"); //设定边框宽度以及颜色
     //可以使用border-top,border-right,border-bottom,border-left分别设定按钮的上下左右边框,
     //同样有border-left-color, border-left-style, border-left-width.等分别来设定他们的颜色,样式和宽度
     //border-image用来设定边框的背景图片。
     //border-radius用来设定边框的弧度。可以设定圆角的按钮
     btn4->setText("Button4");

     //字体设定
     //font-family来设定字体所属家族,
     //font-size来设定字体大小
     //font-style来设定字体样式
     //font-weight来设定字体深浅
     //height用来设定其高低
     //selection-color用来设定选中时候的颜色
     edit1=new QLineEdit(this);
     edit1->setStyleSheet("QLineEdit{font: bold italic large /"Times New Roman/";font-size:25px;color:rgb(55,100,255);height:50px;border:4px solid rgb(155,200,33);border-radius:15px;selection-color:pink}");

     //父窗口的设定
     //icon-size来设定图片大小
     this->setWindowIcon(QIcon("image/1.png"));
      this->setStyleSheet("QWidget{background:write url(image/2.png);icon-size:20px 5px}");  //设定整个对话框的背景颜色
//      this->setStyleSheet("QWidget{icon-size:20px 5px}");
    layout1->addWidget(btn1,0,0);
    layout1->addWidget(btn2,0,1);
    layout1->addWidget(btn3,1,0);
    layout1->addWidget(btn4,1,1);
     layout1->addWidget(edit1,2,0);
}


运行结果如下:

 

-------------如果还想进一步了解关于样式表的语法(用法)--------------

进入该网址:使用Qt Style Sheets制作UI特效


使用Qt Style Sheets制作UI特效

引言

作为一套GUI框架,Qt是非常强大的。(注:Qt 不仅是一套优秀的GUI框架,同时也是一套出色的应用程序框架)。
在UI的制作方面Qt为广大开发者提供了一套强大而易用的工具,她就是——Qt Style Sheets。
本文将向大家举例介绍如何使用Qt Style Sheets制作个性化的UI界面。例子程序(stylesheetDemo)可通过本文末尾所附链接下载。

UI涉及的东西非常庞杂,Qt Style Sheets也包含许许多多的内容,因此本文并不试图对Qt Style Sheets进行系统的理论性的详解,那需要数十倍于本文的篇幅。本文仅通过几个例子,将大家引入Qt Style Sheets的大门,以后如有更多需求大家直接在Qt Assistant中查询Qt Style Sheets并且结合自己写的程序进行测试就可以了。

测试设备

Nokia N8

预备知识

Style sheets 是由一系列的style rules组成的。一条style rule 由选择器selector和声明declaration这两部分构成。selector说明这条规则在哪些widgets上起作用,declaration说明要在这些widgets上设置什么属性properties。例如:


QPushButton, QLineEdit  { color: red; background-color: white }  

在上面这条style rule中QPushButton, QLineEdit 是两个选择器,中间用逗号连接。 { color: red; background-color: white }是声明declaration,大括号里面是一系列的 property: value对,中间用分号连接。这条规则指出对QPushButton和QLineEdit 以及他们的子类需要使用红色作为其前景色,并使用白色作为其背景色。
Qt widgets所支持的所有属性列表请查阅List of Properties


Tab1:QLineEdit QGroupBox QRadioButton QCheckBox QLabel(使用qss文件)

例子程序的UI结构非常简单,只有两部分,上方是一个有三个tab页面的QTabWidget,下面是一个QPushButton。
下面我们先来制作TabWidget的第一个页面Tab1。先看一下效果图:
图一:
Tab1 1.jpg


图二:
Tab1 2.jpg


这张是没有使用StyleSheet的样子:
1.jpg


Tab1中使用到了五种控件。如果控件较多或比较复杂,我们可以通过使用qss文件来设置Style Sheet。首先我们新建一个文本文档,后缀名改为qss,然后用文本编辑器比如记事本打开它,将我们设置的Style Sheets写进去然后保存就可以了。本例程创建的qss文件叫stylesheetDemo.qss,于是我们在程序中只需要写如下几行代码就可以使我们写在qss文件中的Style Sheets起作用:


QFile file(":/qss/stylesheetDemo.qss");
file.open(QFile::ReadOnly);
QTextStream filetext(&file);
QString stylesheet = filetext.readAll();
ui->tab->setStyleSheet(stylesheet);

程序中stylesheetDemo.qss已加入到资源文件,其中ui->tab就是TabWidget中的第一个tab页面。


下面是stylesheetDemo.qss的内容:


QGroupBox {
background-image: url(:/pics/background.png);
border-radius: 30px;
}
 
QLabel {
color: gray;
}
 
QLineEdit {
background: qradialgradient(cx:0, cy:0, radius: 1,
fx:0.5, fy:0.5, stop:0 white, stop:1 rgba(0,190,0, 60%));
border-radius: 9px;
}
 
 
 
QCheckBox:checked {
color: green;
}
 
QCheckBox::indicator {
width: 25px;
height: 25px;
}
 
QCheckBox::indicator:checked {
image: url(:/pics/checkbox.gif);
}
 
 
 
QRadioButton{
spacing: 10
}
 
QRadioButton::indicator {
width: 25px;
height: 25px;
}
 
QRadioButton:checked {
color: rgb(230,115, 0);
}
 
QRadioButton::indicator:checked {
image: url(:/pics/radioButton.png);
}

其中border-radius指的是边框四角的半径,这一属性可以制作出弧形的边框。

background-image属性设置控件的背景图片。
background-color 设置控件的背景色,我们这里对QLineEdit使用了渐变的颜色,这里利用了Qt提供的qradialgradient
一个冒号说明的是状态,例如“:checked”指的是当此控件被checked的时候。
双冒号说明的是子控件,例如“::indicator”指的是 QCheckBox、QRadioButton、QAbstractItemView 或者是可以被选中的 QMenu item或QGroupBox的indicator。

这里需要注意的是,由于QRadioButton和QCheckBox在Symbian上的实现有一点缺憾,就是他们在获得焦点的时候,其新的背景颜色会完全覆盖掉控件,用户就看不到控件了。因此我们需要去掉他们获得焦点的能力:


ui->checkBox->setFocusPolicy(Qt::NoFocus);
ui->checkBox_2->setFocusPolicy(Qt::NoFocus);
ui->radioButton->setFocusPolicy(Qt::NoFocus);
ui->radioButton_2->setFocusPolicy(Qt::NoFocus);

Tab2:QTextBrowser (在代码中setStyleSheet)

程序中对TextBrowser设置了一种透明的背景颜色,并且是像彩虹一样逐渐变化的颜色。这主要是利用了qlineargradient。下面分别是竖屏和横屏状态下Tab2的效果图:

图三:

Tab2 1.jpg


图四:
Tab2 2.jpg


这张是没有使用StyleSheet的样子:
2.jpg

我们这里直接在代码中对textBrowser设置StyleSheet:


    ui->textBrowser->setStyleSheet("\
color: rgb(127, 0, 63);\
background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 1, \
stop: 0 rgba(255, 0, 0, 30%), stop: 0.2 rgba(255, 128, 0, 30%), stop: 0.4 rgba(255, 255, 0, 30%), \
stop: 0.6 rgba(0, 255, 0, 30%), stop: 0.8 rgba(0, 128, 255, 30%), stop: 1 rgba(128, 0, 255, 30%)); \
selection-color: white;\
selection-background-color: rgb(191, 31, 127);\
border: 2px groove gray;\
border-radius: 30px;\
padding: 2px 4px;"
);


Tab3:QWebView

QWebView也是可以通过Qt Style Sheets的方式在一定程度上修改网页呈现在用户面前的样子。
例程中对WebView设置了完全透明的背景色,下面是效果图:
图五:
Tab3 1.jpg


图六:
Tab3 2.jpg


图七:
Tab3 3.jpg


这张是没有使用StyleSheet的样子:
3.jpg


ui->webView->setStyleSheet("border: 1px groove gray; border-radius: 5px; background-color: rgba(255, 193, 245, 0%); ");  

这里要注意,这样设置只对本身透明的网页是有效的,如果网页自己设置了白色背景,则我们还是看不到透明的效果。

还要额外说明一点,如果不对webView的border属性进行设置,而使用QWebView在N8上的默认实现,则网页中的Button是黑色的背景,Button上的字是看不清的。
要想完全使网页按照我们自定义的样式进行显示(渲染),最根本的解决办法是我们修改Webkit,从而渲染出我们需要的样子。

QPushButton QTabWidget

对比图一和图二,我们会发现exit按钮按下和没有按下时的背景、文字颜色和文字位置都是不一样的,其中背景是通过border-image实现的,文字的位置是通过padding来控制的。


    ui->ExitpushButton->setStyleSheet("\
QPushButton {\
color: white;\
border-image: url(:/pics/button.png);\
border-width: 12px;\
padding: -12px 0px;\
min-height: 25px;\
min-width: 60px;\
}\
QPushButton:pressed {\
color: lightgray;\
border-image: url(:/pics/button-pressed.png); \
padding-top: -10px;\
padding-bottom: -16px;\
}\
"
);


对于三个tab标签的样式是这样设置的,其中!selected表示没有选中,margin-top: 5px;会使得选中的tab比没选中的高5个像素。


    ui->tabWidget->setStyleSheet("\
QTabBar::tab {\
color: rgb(84,2,119);\
background-image: url(:/pics/wood.jpg); \
border: 2px solid rgb(68,66,64);\
border-bottom-color: rgb(68,66,64); \
border-top-left-radius: 20px;\
border-top-right-radius: 20px;\
max-height: 21px;\
min-width: 8ex;\
padding: 2px;\
} \
QTabWidget::tab-bar {\
alignment: center;\
} \
QTabBar::tab:!selected {\
margin-top: 5px; \
}\
QTabBar::tab:selected {\
color: rgb(255,0,128); \
}\
"
);

最后横竖屏背景图片的切换也是通过stylesheet实现的:


void MainWindow::resizeEvent ( QResizeEvent * event )
{
enum ScreenMode currentscreenMode;
if(size().height()> size().width())
currentscreenMode = Portrait;
else
currentscreenMode = Landscape;
 
if (currentscreenMode!=scmode)
{
scmode = currentscreenMode;
switch(scmode)
{
case Portrait:
this->setStyleSheet("QMainWindow{ background-image: url(:/pics/bgPortrait.jpg)}");
break;
case Landscape:
this->setStyleSheet("QMainWindow{ background-image: url(:/pics/bgLandscape.jpg)}");
break;
default:
break;
}
}
}

 =====pushbutton边框的设置详解====

Qt Component Style Sheet

说明:Qt Style Sheets支持以CSS的格式来定制和修改控件的外观。

以下为一些常用格式:


1 通用属性

一 边框

1 Border

编号

属性

示例值

适用组件

使用示例

1

Border

2px solid #8f8f91

所有控件

border: 10px solid #8f8f91;

基本语法:border :border-width || border-style || border-color

border : 宽度 样式 颜色;

说明:该属性是复合属性。请参阅各参数对应的属性。

border-top  border-right  border-bottom  border-left同上。


实例:pushButton[i]->setStyleSheet("QPushButton{border-width:40px; border-style:none; border-color:red; border-radius:8px;background-color:yellow;color:red;}");//author-lin       border : border-width || border-style || border-color (border : 宽度  样式(none为无边框,当无边框时,其他两项是怎么设置都无效的)  颜色)等同于 border-width:40px; border-style:none; border-color:red;

2 border-style

编号

属性

示例值

适用组件

使用示例

2

border-style

solid

所有控件

border-style : outset

 

基本语法

border-style : none | hidden | dotted | dashed | solid |double | groove | ridge | inset | outset

语法取值

none :  默认值。无边框。不受任何指定的 border-width 值影响

hidden :  隐藏边框。IE不支持

dotted :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线

dashed :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线

solid :  实线边框

double :  双线边框。两条单线与其间隔的和等于指定的 border-width 值

groove :  根据border-color 的值画3D凹槽

ridge :  根据border-color 的值画3D凸槽

inset :  根据border-color 的值画3D凹边

outset :  根据border-color 的值画3D凸边

 

border-top-style  border-right-style  border-bottom-style border-left-style同上。

3 Border-width

编号

属性

示例值

适用组件

使用示例

3

Border-width

8px

所有控件

border-width: 8px;

基本语法

border-width : medium | thin | thick | length

语法取值

medium :  默认值。默认宽度

thin :  小于默认宽度

thick :  大于默认宽度

length :  由浮点数字和单位标识符组成的长度值。不可为负值。请参阅 长度单位

 

border-top-width  border-right-width  border-bottom-width border-left-width同上。

4 Border-color

编号

属性

示例值

适用组件

使用示例

3

border-color

#8f8f91

所有控件

border-corlor:red

基本语法:border-color :color

5 Border-radius

编号

属性

示例值

适用组件

使用示例

2

Border-radius

一般控件最大值10px

QPushButton为30px

所有控件

border-radius: 30px;

 

基本语法:border-radius:26px;

功能:圆角角度

6 border-image

编号

属性

示例值

适用组件

使用示例

2

border-image

 

所有控件

border-image: url(:/newPrefix/1.png);

 

基本语法:border-image:url(:/newPrefix/1.png);

二 背景

1 background

编号

属性

示例值

适用组件

使用示例

2

background

 

所有控件

background: white url(:/newPrefix/1.png) repeat-y fixed right top;

基本语法:

background : background-color || background-image ||background-repeat || background-attachment || background-position

2 background-color

同边框里的 Border-color

3 background-image

同边框里的 Border-image

4 background-repeat

基本语法:

background-repeat : repeat | no-repeat | repeat-x |repeat-y

语法取值

repeat :  默认值。背景图像在纵向和横向上平铺

no-repeat :  背景图像不平铺

repeat-x :  背景图像仅在横向上平铺

repeat-y :  背景图像仅在纵向上平铺

 

5 background-attachment

基本语法

background-attachment : scroll | fixed

语法取值

scroll :  默认值。背景图像是随对象内容滚动

fixed :  背景图像固定

 

6 background-position

编号

属性

示例值

适用组件

使用示例

2

background-position

center

所有控件

border-position: top

 

 

基本语法

background-position : length || length

background-position : position || position

语法取值

length :  百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位

position : top | center | bottom | left | center | right  

2 渐变色

1 角度渐变

基本格式:qconicalgradient(cx,cy,angle, stop:positionrgba(R,G,B,A))

语法取值

angle :  渐变角度,值为 0-360 度

cx: 起始X坐标,值为 0-1

cy: 起始Y坐标,值为 0-1

stop:position rgba(R,G,B,A):渐变的位置和颜色

       position 渐变位置,,值为 0-1

       R,G,B,A 分别为红,绿,黑,透明色

 

实例:

border-color: qconicalgradient(cx:0, cy:0,angle:135, stop:0 rgba(255, 255, 0, 69), stop:0.375 rgba(255, 255, 0, 69),stop:0.423533 rgba(251, 255, 0, 145), stop:0.45 rgba(247, 255, 0, 208),stop:0.477581 rgba(255, 244, 71, 130), stop:0.518717 rgba(255, 218, 71, 130),stop:0.55 rgba(255, 255, 0, 255), stop:0.57754 rgba(255, 203, 0, 130),stop:0.625 rgba(255, 255, 0, 69), stop:1 rgba(255, 255, 0, 69));

2 线性渐变

基本格式:qlineargradient(spread:type,x1, y1, x2, y2,stop:positionrgba(R,G,B,A))

语法取值

spread:type :  渐变类型 type有三种:

              pad –平铺

             repeat – 重复

             reflect – 反射

x1: 起始X坐标,值为 0-1

y1: 起始Y坐标,值为 0-1

x2: 结束X坐标,值为 0-1

y2: 结束Y坐标,值为 0-1

stop:position rgba(R,G,B,A):渐变的位置和颜色

       position 渐变位置,,值为 0-1

       R,G,B,A 分别为红,绿,黑,透明色

实例:

border-color:  qlineargradient(spread:pad, x1:0, y1:0, x2:1,y2:0, stop:0 rgba(134, 245, 99, 255), stop:0.514124 rgba(235, 148, 61, 255),stop:0.954802 rgba(115, 87, 128, 255));

3 辐射渐变

基本格式:qradialgradient(spread:type, x1, y1, x2, y2, radius ,stop:position rgba(R,G,B,A))

语法取值

spread:type :  渐变类型 type有三种:

              pad –平铺

             repeat – 重复

              reflect – 反射

x1: 起始X坐标,值为 0-1

y1: 起始Y坐标,值为 0-1

x2: 结束X坐标,值为 0-1

y2: 结束Y坐标,值为 0-1

radius:半径,值

stop:position rgba(R,G,B,A):渐变的位置和颜色

       position 渐变位置,,值为 0-1

       R,G,B,A 分别为红,绿,黑,透明色

 

实例:

background-color:qradialgradient(spread:repeat, cx:0.5, cy:0.5, radius:0.077, fx:0.5, fy:0.5,stop:0 rgba(0, 169, 255, 147), stop:0.497326 rgba(0, 0, 0, 147), stop:1 rgba(0,169, 255, 147));


 

 






======分割线,工作总结=====

my总结:使用 ->setStyleSheet()来改变内嵌的组件的大小

-------------工艺管理中的卷轴宽-------------------------------------------

 tableWidget->verticalScrollBar()->setStyleSheet("QScrollBar{background:rgb(255,255,0); width: 25px; ; ;}"     "{}"     " {}"     " {} "    " {}");//这个仅仅改变的是verticalScrollBar的颜色和宽度(初次)
   //tableWidget->setStyleSheet("QScrollBar{background:rgb(255,255,0); width: 25px;  ;  ;}"    "{}"     " {}"     " {} "    " {}");//这个不但改变了verticalScrollBar的颜色和宽度(初次),而且tableWidget的其他项使用了默认,所以也改变了tableWidget的其他东西;


------------输出测试中(开关输出测试)的卷轴的宽----------------------------

listWidget->setStyleSheet("QScrollBar{background:rgb(255,255,0); width: 25px;}"   "  "     "  "     "  "    "  ");


  

------------输出测试中(tabBar的高)-------------------

    tabBar = new QTabBar(this);
    //tabBar->setAutoFillBackground(true);
    this->setStyleSheet("QTabBar::tab { height: 40px;}");//3  设置tabBar的高;长是自适应的不用理;
    //tabBar->setStyleSheet("QTabBar::tab { height: 50px;}");
    //tabBar->setStyleSheet(" height: 50px");
    //tabBar->setMinimumHeight(40);//无效
    //this->tabBar->setStyleSheet("QTabBar::tab{ height: 40px;}");


-----另外需要注意的是不要混淆一个类似的函数 -----------------

tabBar->setStyle(new QCleanlooksStyle);//该函数只是设置tabBar的风格,指的是形状的微调,如变成圆润,或者变扁平等
   




=========终结版==========

(1)被刷的对象可以是任何东西;

(2)背景可以刷什么样子

背景刷成纯颜色

    QPalette Palette = label2->palette();
    Palette.setBrush(QPalette::Background,QBrush(QColor(0,255,0)));//绿色    QBrush(Qt::green)也行
    label2->setPalette(Palette);//label2刷成绿色
    label2->setAutoFillBackground(true);//label2自动覆盖背景;(上面已经设置好背景颜色为蓝色)

背景刷成渐变色(线性渐变、辐射渐变等)

线性渐变例子:

    QPalette Palette2;
    QLinearGradient gradient(QPoint(0,0),QPoint(800,480));//左上角->右下角的连线 进行线性渐变
    //改连线被模拟成1;在0的位置是黑色,在0.5的位置是白色,在1的位置是黑色;然后进行渐变;
    gradient.setColorAt(0,Qt::cyan);//
    gradient.setColorAt(0.2,Qt::magenta);//
    gradient.setColorAt(0.4,Qt::yellow);//
    gradient.setColorAt(0.6,Qt::green);
    gradient.setColorAt(1.0,Qt::darkMagenta);
    Palette2.setBrush(QPalette::Window,QBrush(gradient));//往调色板上刷色,该调色板上刷的是上面定义好的渐变色


背景刷成图片

QPalette palette;

palette.setBrush(iLabel->backgroundRole(),QBrush(QImage(":/bmp/1257253475842.jpg")));

iLabel->setPalette(palette);

iLabel->setAutoFillBackground(true);

上面的方法对 对象设置背景主要用在顶层窗口时的背景设置,当然也可以用setStyleSheet()函数实现上面一模一样的功能,而且方便,一句话就可以完成;但使用setStyleSheet()函数的弊端是它对后面以它作为父类的子类产生 连带作用,上面有说明使用setStyleSheet()的合适场合,总结就是:一定不要对顶层窗口使用该函数来设置背景颜色/图片,因为该函数设置顶层窗口的背景不生效,以它作为父类的子类的背景继承时才生效,然而要对以它作为父类的子类进行修改背景时也只能使用该函数来修改,其他方法都不生效,限制了灵活性;而使用Palette刷背景颜色的类被继承时,继承的子类不仅可以使用Palette方法来修改背景颜色还可以使用setStyleSheet()来修改背景颜色;而且该函数一般用来微调对象的长、宽,很少用来设置背景颜色/图片,使用该函数的对象都是不再被继承,不再作为其他子类的父类

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

QT中 窗口部件的 背景图片 的设置 的相关文章

  • gmake: No rule to make target `C:/ti/controlSUITE2_DMC Rev/device_support/f2803x/v122/DSP2803x_h的解决

    注 xff1a 此方法是在CCS8环境下的使用成功的 在使用controlSUITE的例程编译时 xff0c 工程老出现这种错误 xff0c 排查了很久 xff0c 终于找到了原因 xff0c 造成这种原因主要是CCS在安装时没有按照默认的
  • 基于51单片机的数字气压计

    1 概述 本设计是基于MPX4115的数字气压计 xff0c 硬件处理电路为大气压传感器模拟信号的采集 转换 处理和显示 xff0c 并根据相应的软件需求设计控制程序 2 硬件设计 xff08 1 xff09 硬件总体框图 气压计的硬件主要
  • 一站式开源分布式集群云真机测试平台Sonic——基于Docker方式部署sonic前后端(体验版)

    Sonic xff1a 一站式开源分布式集群云真机测试平台 xff0c 致力服务于中小企业的客户端UI测试 xff0c 永久免费 sonic官网 xff1a Sonic 开源云真机测试平台 开源不易 xff0c 请大家多多支持作者 xff0
  • Policy Gradient Algorithms

    Policy Gradient Algorithms 2019 10 02 17 37 47 This blog is from https lilianweng github io lil log 2018 04 08 policy gr
  • 基于51单片机的多功能八路抢答器

    1 功能介绍 多功能八路抢答器是基于51单片机来设计的 xff0c 除了可以实现最基本功能 8路抢答外 xff0c 还具有自动处理犯规选手 xff0c 抢答时间调整 xff0c 还可以进行答题 xff0c 计分 xff0c 并且可以查询或修
  • 基于51单片机的贪吃蛇游戏

    1 简介 本设计为一款贪吃蛇游戏 xff0c 显示器采用8 8点阵 xff0c 主控制器采用51单片机 xff0c 并通过按键实现对游戏的操作 2 贪吃蛇算法介绍 吃蛇游戏算法的实现 xff0c 即如何通过液晶屏显示蛇的移动 其实蛇看似移动
  • 基于51单片机的便携式输液点滴控制报警器

    1 简介 基于单片机输液点滴控制报警器组成 该系统主要由光电传感器检测电路 键盘 数码管显示 报警提示电路 液滴流速监测电路 电机驱动电路等组成 利用光电感器测量出液滴流速 xff0c 并将将信息返回给单片机 xff0c 单片机对流速信号与
  • PCB加工文件—Gerber文件的导出

    当我们使用软件将一个板卡的PCB图纸设计好后 xff0c 想到PCB厂家制作成电路板 简单的 xff0c 你可以把自己的设置PCB文件 PcbDoc 直接发给厂家加工 xff0c 但是有些PCB厂家会要求你提供Gerber文件 但是这个Ge
  • AD13如何导出坐标文件

    在电子行业加工生产大批量的电路板 xff0c 都是利用贴片机进行生产和制造 xff0c 在生产之前 xff0c 我们需要提供PCB的坐标文件给贴片厂家 xff0c 这样厂家才能确定每个元器件应该贴在PCB板上什么位置 所以下面我们就来讲一下
  • 基于PID算法的水箱温度控制系统

    1 概述 本设计为基于STC89C52单片机的智能水温控制系统 xff0c 控制对象以500mL陶瓷水箱为容器 xff0c 并使用PID控制算法来调整水箱中500ml纯净水的温度 水温可以在一定范围内人为设定 xff0c 并能实现在下限温度
  • 基于51单片机的数字电流电压表

    1 简述 本文介绍了基于STC89C52单片机为核心 xff0c 分别以ACS712 05芯片和串联分压电路为为电流检测和电压检测电路 xff0c 并通过AD0809数模转换芯片对电压信号进行采集和转换 xff0c 传输给单片机进行处理 x
  • OpenStack快速入门

    一 登陆OpenStack 查看用户名和密码 查看文件 用户名admin和demo 登录 页面显示 修改密码 点击设置 gt 更改密码 创建和操作虚拟机实例 xff08 一 xff09 创建虚拟机实的前提 创建虚拟机实例的前提条件 1 实例
  • vnc view远程登录Linux

    转自http blog sina com cn s blog 49c306b201011had html 尽管我们可以使用 SSH连接远程通过字符界面来操作Linux xff0c 但是对于更多熟悉图形人来说是很不方便的 xff0c 因此开启
  • 【Python基础】之装饰器

    这是我初次接触装饰器 xff0c 先从初学者的角度介绍装饰器 xff0c 关于装饰器的应用场景举例 xff0c 后面再补充 1 装饰器的作用 装饰器可以让一个函数在不做任何变动的情况下新增额外的功能 如下代码 xff0c func name
  • Sonic simple服务中设备图片、测试用例运行异常图片、失败录像路径映射配置

    使用docker ps查看容器信息 使用docker exec it a2d69c075875 sh进入容器 xff0c 并查看容器文件 相关文件夹说明 xff1a imageFiles xff1a 测试用例运行截图信息 keepFiles
  • ubuntu vmware 虚拟网络编辑 ping 外网不通问题

    内网环境在192 168 1 1 网段 虚拟机想要ssh 接入 xff0c 并且可以上网 使用桥接方式和NAT方式都可以 互ping xff0c 但是上网遇到了问题 NAT解决方法如下 xff0c 桥接方式随后再研究 NAT 模式下子网IP
  • 深入解读相机矩阵

    在这片文章里 xff0c 你将了解到以下内容 xff1a 1 相机的针孔模型 2 相机矩阵的概念 3 相机内参的含义 4 相机外参的含义 1 相机针孔模型 针孔模型是相机成像的基础模型 xff0c 是理解后续相机矩阵内容的基础 下图描述了基
  • python 循环输入,用户输入回车结束

    输入的回车会被视为空字符 xff0c 可以用a 61 61 39 39 来作为结束循环的标志 n 61 while 1 a 61 input if a 61 61 39 39 break else n append a print n
  • OpenvSwitch 子项目 OVN 功能介绍(一)

    众所周知 xff0c OpenvSwitch 以其丰富的功能和不错的性能 xff0c 已经成为 Openstack 部署中最受欢迎的虚拟交换机 由于 Openstack Neutron 的架构引入了一些性能问题 xff0c 比如 neutr
  • SDN网络中的转发数据和数据传输

    数据驱动的网络 从数据驱动的角度来看网络 xff0c 会发现一张现实中的网络存在着各种数据 设计和管理一张网络 xff0c 主要是设计数据 xff0c 存储数据 xff0c 管理数据和分析数据 网络数据的规模 复杂度和变化速度 xff0c

随机推荐

  • [云计算]OpenStack - Neutron

    Neutron在OpenStack中的位置 可以为虚拟机或者 OpenStack 组件提供网络服务 xff0c xff08 由 Nova network 独立出来的 xff09 随着需承载业务的能力的增长作为 Nova 子组件无法满足 过程
  • 后台架构师除了技术,还有97件事,你知道吗?

    对于架构师 xff0c 很多人可能觉得很笼统 架构师到底需要学习什么 xff1f 学习完哪些技术就可以到架构师的水准 在行业内的话其实并没有一个非常明确的标准 技术是一方面 xff0c 但是如果仅仅只是技术的话 xff0c 具体一名合格的架
  • Failed to read artifact descriptor for xxx.jar

    mavne 项目 pom xml 文件标红 错误如下 xff1a Failed to read artifact descriptor for xxx jar Failed to read artifact descriptor for x
  • imx6q平台上移植mt7601

    本文描述如何将MT7601 WiFi模块移植到IMX6Q开发板上 xff0c 分析移植过程中碰到的问题 xff0c 分析错误原因 xff0c 提供解决办法 一 MT7601实物图 二 验证开发板和USB MT7601硬件是否正常 步骤1 x
  • 在图片上画出标注目标框和类别python程序

    在图片上画出标注目标框和类别python程序 xff0c 还是比较简单的 xff0c 直接上一份代码 xff1a usr bin python coding UTF 8 2018 07 11 by DQ import cv2 import
  • iOS性能监控及自动化测试辅助工具对比-tidevice、py-ios-device(pyidevice)、sonic-ios-bridge(sib)

    对比项 tidevice py ios device xff08 pyidevice xff09 sonic ios bridge xff08 sib xff09 是否开源 github地址 https github com alibaba
  • git中tag与release的创建以及两者的区别

    简介 本文辨析在参与开源项目时会遇到的tag与release的概念区别与联系 xff0c 并比较两者的创建方法 定义 标签 xff08 tag xff09 是特定提交 xff08 commit 一个指针 xff0c 也就是每个tag对应一个
  • 如何评价数仓好坏

    评价一个数仓的好坏可以涉及相当多的维度 xff0c 这里简单分享一些在实习时了解到的比较看重的方面 模型合理性 一个数仓模型的诞生往往是为了满足产品提出来的业务需求 xff0c 但是如果一个模型仅仅只能做到完全为这一次需求而服务的话 xff
  • 数据倾斜的判断方法和解决方案

    数据倾斜的判断方法 首先点开任务的sparkUI界面中的Stages xff0c 对Duration一列进行排序 xff0c 观察看有没有某个stage出现运行时间远大于其它stage的情况出现 xff0c 假设有的话 xff0c 就点开D
  • 数据开发中的资源管理优化(spark运行)

    在数据开发中 xff0c 资源管理主要看关注于队列整体的CPU使用率 xff0c 内存使用率或者单个任务的CPU使用率 xff0c 内存使用率 CPU使用率 默认情况下是一个core执行一个task 如果此时CPU利用率过低 xff0c 那
  • 互联网大厂SQL真题(二)

    题目 xff1a 每天的日活数及新用户占比 新用户占比 61 当天的新用户数 当天活跃用户数 xff08 日活数 xff09 如果in time 进入时间和out time 离开时间跨天了 xff0c 在两天里都记为该用户活跃过 新用户占比
  • 互联网大厂SQL真题(三)

    题目 xff1a 近一个月发布的视频中热度最高的top3视频 问题 xff1a 找出近一个月发布的视频中热度最高的top3视频 注 xff1a 热度 61 a 视频完播率 43 b 点赞数 43 c 评论数 43 d 转发数 新鲜度 xff
  • Spark三种常见JOIN方式

    Spark join 基本原理 Spark join的基本实现流程如下图所示 xff0c Spark将参与Join的两张表抽象为流式表 StreamTable 和查找表 BuildTable xff0c 通常系统会默认设置StreamTab
  • 遛一遛8266的定时器

    一 xff1a 简述 硬件为ESP LAUNCHER开发板 使用GPIO12 要求是某一定时间指示灯状态发生改变 ESP8266定时功能的实现有两种方式 xff1a 软件定时器和硬件定时器 软件定时器的接口在 ESP8266 NONOS S
  • MYSQL8.0以上版本忘记ROOT密码

    MYSQL8 0 43 忘记Root密码 xff1a 1 以超级管理员打开cmd xff0c 关闭mysql服务2 跳过权限验证登录mysql3 在新的窗口中登录mysql4 切换到mysql xff0c 将密码置空 5 设置加密规则并更新
  • 深度学习【13】tensorflow保存graph和参数为pb文件

    from tensorflow python framework graph util import convert variables to constants graph 61 convert variables to constant
  • plsql查询数据显示为乱码解决方法

    使用plsql查询数据显示为乱码 xff1a 查看数据库编码 xff1a 通过网上搜索 xff0c 发现需要设置环境变量 xff0c 添加以下环境变量 xff1a LANG 61 zh CN GBK NLS LANG 61 34 SIMPL
  • 对抗网络之目标检测应用:A-Fast-RCNN

    对抗网络之目标检测应用 xff1a A Fast RCNN 论文 xff1a A Fast RCNN Hard Positive Generation via Adversary for Object Detection 点击下载 Caff
  • make -j20 出现以下报错: Ensure Jack server is installed and started

    如果出现的报错是 xff1a build core ninja mk 148 recipe for target 39 ninja wrapper 39 failed 综上所述 xff0c 其实就是 xff1a Android7 0 xff
  • QT中 窗口部件的 背景图片 的设置

    QT中 窗口部件的 背景图片 的设置 分类 xff1a QT 2013 04 08 11 06 359人阅读 评论 0 收藏 举报 目录 43 如何设置对话框的自定义的背景颜色 xff1f 2010 03 14 14 34 11 分类 xf