温故而知新---PyQt5学习笔记系列---我有BUFF你怕不怕！

wei_Y

虽然在Qss中没有成吨的buff可以让你媲美RMB战士(当然有也不能媲美RMB战士 )！
但是日常刷本还是可以哒。
好啦，让我们加起buff嗑上药无情的战起来！

0.  加BUFF前的准备。
如果你用的sublime text 3作为编辑器，那么打开qss文件时他的关联形式是平常文本，没有语法高亮也木有ctrl+/这么简便的注释方式。简直让人不能忍。
有两种方法解决这个问题。
第一种:





第二种:
在sublime text 3 的目录下选择 data/packages/
创建一个XXX.sublime-settings
XXX为你想让他关联的文件名，比如我想让他关联到CSS，我就创建一个CSS.sublime-settings。
然后里面写上。

{
        "extensions":
        [
                "qss",
                "css"
        ]
}
想关联哪个就写哪个。
呃，写多个这样的文件都指定同一个后缀没测试过会以哪种关联，闲的没事可以试试。注意缩进！
 其实第二种就是第一种的手动版！

1.  一些零散的属性。

width:      15px;        设置其宽，对窗口测试无效- -，不知道为啥。且对有一些布局里的东西也有时候没有效果。
height:        20px;        设置其高，同上。
以上可以用
max/min-来写最大和最小可接受的长度。一般用在滚动条上。

border:        0px  solid black;
设置边框: 像素 样式 颜色。
padding: 0px;
设置内边距: 像素。
margin:
设置外边距: 同上
spacing:
设置控件间隔: 同上
以上四个都可以加
-top/bottom/left/right
来单独设置某一边。
-top/bottom/left/right-color
单独设置某一边的颜色

设置圆角:
border-radius: 0px;
设置其边框半径，具体怎么设置看情况写px。px＜width的一半，因为是半径。

设置字体父类:
font-family: "微软雅黑";
设置字体颜色:
color: red;
设置字体是否加粗:
font-weight: bold/100/200;
设置字体风格:
font-style: italic oblique;
这俩都是斜体，没看出有啥区别。
设置字体大小:
font-size: 15px;

其他的查手册~~。


2. 呐，开始加BUFF！
先创建一个普通的小按钮。

        self.btn_1 = QPushButton('我是测试按钮~~~。',self)
        self.btn_1.setObjectName('button1')
        self.btn_1.move(300, 300)

在qss中不知道咋设置位置，只好用move了。
QSS中先写写看。

QPushButton#button1{
    width: 300px;
    height: 15px;
    color: white;
    background: black;
    font-weight: bold;
}

在他没有buff的情况下，无论我们点他，摁他，还是敲他。(好像都一个样- -。)他都不会有变化，甚至怀疑到低点没点他。
so，加上第一个buff。

QPushButton#button1:hover{
    color: red;
}

:hover表示鼠标经过时的样式，可以只改变需要变化的，其他不设置即为何上面一样。

再来第二个buff。

QPushButton#button1:pressed{
        color: yellow;
}

:pressed表示鼠标点击时的样式。



我们新增一个QPushbutton，设置名字是button2
样式表改一下

QPushButton#button1, QPushButton#button2{
    width: 300px;
    height: 15px;
    color: white;
    background: black;
    font-weight: bold;
}

QPushButton#button1:hover, QPushButton#button2:hover{
    color: red;
}

QPushButton#button1:pressed, QPushButton#button2:pressed{
    color: yellow;
}

注意一个很奇葩的问题，如果写成

QPushButton#button1:hover, QPushButton#button2:pressed{
    color: red;
}

QPushButton#button1:pressed, QPushButton#button2:hover{
    color: yellow;
}

这样，那么QPushButton#button2:pressed这个设置会被吃掉，没有效果，但是反过来或者重新再下面设置就可以。不知道啥原因。

第三发buff。

QPushButton#button1:focus, QPushButton#button2:focus{
    color: gray;
}

:focus设置选中后的样式，如果设置了此项pressed就看不出效果来了。


其实还有很多很多的buff，呃，没有都用过所以栗子就举不出来了，用到的时候查手册吧~~。
我是手册: 点我

PS. 有问题请回帖说一下，我会认真改正。

lightninng

教练：我想学做动图~~
教练：我想学Qss~~
教练：我想学....

wei_Y

lightninng 发表于 2015-5-17 13:55
教练：我想学做动图~~
教练：我想学Qss~~
教练：我想学....

1. 百度gif制作器。
2. 百度qt找文档。
3. 百度 谷粉搜搜。
3.1  谷粉搜 …….

lightninng

wei_Y 发表于 2015-5-17 14:03
1. 百度gif制作器。
2. 百度qt找文档。
3. 百度 谷粉搜搜。

qt自带的东西做点简单的小东西还行，真想做的好看，素材啊，Qss这种东西都得花心思弄啊~~

wei_Y

lightninng 发表于 2015-5-17 14:08
qt自带的东西做点简单的小东西还行，真想做的好看，素材啊，Qss这种东西都得花心思弄啊~~

嗯啊，看css做的特效放到qss上有些用不了。。只能翻文档。。关键还是英语，而且还没中文的。。

lightninng

wei_Y 发表于 2015-5-17 14:12
嗯啊，看css做的特效放到qss上有些用不了。。只能翻文档。。关键还是英语，而且还没中文的。。

学吧，学计算机不学英语，好多新东西都学的慢~

wei_Y

lightninng 发表于 2015-5-17 14:15
学吧，学计算机不学英语，好多新东西都学的慢~

嗯啊。

liangbo

学习学习，支持支持

pihulj

坚持

mrjliu

恭喜楼主，我也是新手，慢慢加油！