更新美化界面目录

.settings/org.eclipse.core.resources.prefs

@@ -71,10 +71,16 @@ encoding//\u7A97\u53E3/\u65E0\u8FB9\u6846\u81EA\u5B9A\u4E49\u6807\u9898\u680F\u7
 encoding//\u7A97\u53E3/\u65E0\u8FB9\u6846\u81EA\u5B9A\u4E49\u6807\u9898\u680F\u7A97\u53E3/\u65E0\u8FB9\u6846\u81EA\u5B9A\u4E49\u6807\u9898\u680F\u7A97\u53E3.py=utf-8
 encoding//\u7A97\u53E3/\u6D88\u606F\u5BF9\u8BDD\u6846\u5012\u8BA1\u65F6\u5173\u95ED.py=utf-8
 encoding//\u7A97\u53E3/\u7A97\u53E3\u91CD\u542F.py=utf-8
+encoding//\u7F8E\u5316/Effect/AnimationShadowEffect.py=utf-8
+encoding//\u7F8E\u5316/Effect/\u56FE\u7247\u6309\u94AE\u8F93\u5165\u6846\u9634\u5F71.py=utf-8
 encoding//\u7F8E\u5316/QLabel/\u5706\u5F62\u56FE\u7247.py=utf-8
-encoding//\u7F8E\u5316/\u81EA\u5B9A\u4E49QWidget\u7684QSS\u6837\u5F0F/CustomPaintWidget.py=utf-8
-encoding//\u7F8E\u5316/\u81EA\u5B9A\u4E49QWidget\u7684QSS\u6837\u5F0F/CustomWidget.py=utf-8
-encoding//\u7F8E\u5316/\u81EA\u5B9A\u4E49QWidget\u7684QSS\u6837\u5F0F/test.py=utf-8
+encoding//\u7F8E\u5316/QProgressBar/Metro\u8FDB\u5EA6\u6761.py=utf-8
+encoding//\u7F8E\u5316/QProgressBar/\u6C34\u6CE2\u7EB9\u8FDB\u5EA6\u6761/ProgressBar.py=utf-8
+encoding//\u7F8E\u5316/QProgressBar/\u6C34\u6CE2\u7EB9\u8FDB\u5EA6\u6761/\u6C34\u6CE2\u7EB9\u8FDB\u5EA6\u6761.py=utf-8
+encoding//\u7F8E\u5316/QSlider/PaintQSlider.py=utf-8
+encoding//\u7F8E\u5316/QWidget/CustomPaintWidget.py=utf-8
+encoding//\u7F8E\u5316/QWidget/CustomWidget.py=utf-8
+encoding//\u7F8E\u5316/QWidget/QWidget\u6837\u5F0F\u6D4B\u8BD5.py=utf-8
 encoding//\u83DC\u5355/\u83DC\u5355\u591A\u9009\u4E0D\u5173\u95ED.py=utf-8
 encoding//\u8868\u683C/QTableView/\u8868\u683C\u5185\u5BB9\u590D\u5236.py=utf-8
 encoding//\u8868\u683C/QTableWidget/\u6570\u636E\u5E93\u67E5\u8BE2\u663E\u793A\u8868\u683C/main.py=utf-8

美化/Effect/图片按钮输入框阴影.py

@@ -30,7 +30,7 @@ class Window(QWidget):
         layout = QHBoxLayout(self)
 
         # 绿色边框
-        labelGreen = QLabel(self, pixmap=QPixmap('1.jpg').scaled(100, 100))
+        labelGreen = QLabel(self, pixmap=QPixmap('Images/1.jpg').scaled(100, 100))
         layout.addWidget(labelGreen)
         aniGreen = AnimationShadowEffect(Qt.darkGreen, labelGreen)
         labelGreen.setGraphicsEffect(aniGreen)
@@ -40,7 +40,7 @@ class Window(QWidget):
         labelRed = QLabel(self)
         labelRed.setMinimumSize(100, 100)
         labelRed.setMaximumSize(100, 100)
-        labelRed.setStyleSheet('border-image: url(1.jpg);border-radius: 50px;')
+        labelRed.setStyleSheet('border-image: url(Images/1.jpg);border-radius: 50px;')
         layout.addWidget(labelRed)
         aniRed = AnimationShadowEffect(Qt.red, labelGreen)
         labelRed.setGraphicsEffect(aniRed)

美化/QCalendarWidget/README.md

@@ -1,10 +0,0 @@
-# QCalendarWidget 日历控件 QSS 美化样式
-
-主要改变顶部背景颜色和高度，上下月按钮、月份选择、年选择、菜单
-
-详细美化都在代码里的QSS中注释了
-
-效果图：
-
-### [CalendarWidget.py](CalendarWidget.py)
-![CalendarWidget](ScreenShot/CalendarWidget.gif)

美化/QFileSystemModel/README.md

@@ -1,11 +0,0 @@
-# QFileSystemModel 自定义图标
-
-使用QFileSystemModel.setIconProvider(QFileIconProvider)来设置图标提供类
-
-通过重写QFileIconProvider的icon方法来决定返回什么样的图标
-
-见需求 [Issues#2](https://github.com/892768447/PyQt/issues/2)
-
-截图
-
-![1](ScreenShot/1.png)

美化/QMessageBox/README.md

@@ -1,11 +0,0 @@
-# 消息提示框的按钮和图标美化
-
-### [1.方案一](方案一/)
- - 1.1 该方案使用dialogbuttonbox-buttons-have-icons: 1; 开启自带的图标样式
- - 1.2 再利用dialog-xx-icon: url(); 来设置自定义的图标, 具体参考[list-of-icons](http://doc.qt.io/qt-5/stylesheet-reference.html#list-of-icons)
- - 1.3 缺点 部分按钮图标无效，无法自定义不同按钮的颜色
- 
-### [2.方案二](方案二/)
- - 2.1 采用样式表中的属性选择器 QPushButton[text="xxx"] 可以根据按钮中的文字来区分
- - 2.2 在利用属性样式qproperty-icon: url();来设置自定义图标
- - 2.3 解决方案一的缺点

美化/QSlider/README.md

@@ -1,10 +0,0 @@
-# QSlider美化
-
-### 简单说明
- - 1.通过QSS美化
- - 2.通过paintEvent绘制
-
-截图
-
-![1](ScreenShot/1.gif)
-![1](ScreenShot/2.gif)

美化/README.md

@@ -1,6 +1,76 @@
 # 界面美化
 
-## QPushButton
+## [QCalendarWidget](QCalendarWidget/)
+
+对日历控件的部分控件进行QSS美化，顶部背景颜色和高度，上下月按钮、月份选择、年选择、菜单
+[CalendarWidget.py](QCalendarWidget/CalendarWidget.py)
+
+![截图](QCalendarWidget/ScreenShot/CalendarWidget.gif)
+
+## [QFileSystemModel](QFileSystemModel/)
+
+修改`QFileSystemModel`的文件类型图标
+
+使用`QFileSystemModel.setIconProvider(QFileIconProvider)`来设置图标提供类
+
+通过重写`QFileIconProvider`的`icon`方法来决定返回什么样的图标
+
+见需求 [Issues#2](https://github.com/PyQt5/PyQt/issues/2)
+
+![截图](QFileSystemModel/ScreenShot/FileSystemModel.png)
+
+## [QLabel](QLabel/)
+
+### 1. [圆形图片](QLabel/圆形图片.py)
+
+使用`QPainter`的`setClipPath`方法结合`QPainterPath`对图片进行裁剪从而实现圆形图片。
+
+![截图](QLabel/ScreenShot/圆形图片.png)
+
+## [QMessageBox](QMessageBox/)
+
+美化按钮以及增加图片显示
+
+### 1. [方案一](QMessageBox/方案一)
+1. 该方案使用`dialogbuttonbox-buttons-have-icons: 1;`开启自带的图标样式
+2. 再利用`dialog-xx-icon: url();`来设置自定义的图标, 具体参考[list-of-icons](http://doc.qt.io/qt-5/stylesheet-reference.html#list-of-icons)
+3. 缺点 部分按钮图标无效，无法自定义不同按钮的颜色
+
+![截图](QMessageBox/方案一/ScreenShot/information.png)
+
+### 2. [方案二](QMessageBox/方案二)
+1. 采用样式表中的属性选择器`QPushButton[text="xxx"]`可以根据按钮中的文字来区分
+2. 在利用属性样式`qproperty-icon: url();`来设置自定义图标
+3. 解决方案一的缺点
+
+![截图](QMessageBox/方案二/ScreenShot/information.png)
+
+## [QProgressBar](QProgressBar/)
+
+各种进度条的美化和自定义
+
+### 1. [简单样式表美化](QProgressBar/简单样式表美化.py)
+主要改变背景颜色、高度、边框、块颜色、边框、圆角
+
+![截图](QProgressBar/ScreenShot/简单样式表美化.gif)
+
+### 2. [水波纹进度条](QProgressBar/水波纹进度条/)
+
+![截图](QProgressBar/水波纹进度条/ScreenShot/水波纹进度条.gif)
+
+### 3. [圆圈进度条](QProgressBar/圆圈进度条.py)
+
+![截图](QProgressBar/ScreenShot/圆圈进度条.gif)
+
+### 4. [百分比进度条](QProgressBar/百分比进度条.py)
+
+![截图](QProgressBar/ScreenShot/百分比进度条.gif)
+
+### 5. [Metro进度条](QProgressBar/Metro进度条.py)
+
+![截图](QProgressBar/ScreenShot/Metro进度条.gif)
+
+## [QPushButton](QPushButton/)
 
 ### 1. [按钮常见样式](QPushButton/按钮常见样式.py)
 
@@ -22,10 +92,34 @@
 
     ![截图](QPushButton/按钮进度动画/ScreenShot/按钮底部线条动画.gif)
 
-## QLabel
+## [QScrollBar](QScrollBar/)
 
-1. [圆形图片](QLabel/圆形图片.py)
+使用QSS和图片对滚动条进行美化
 
-    使用`QPainter`的`setClipPath`方法结合`QPainterPath`对图片进行裁剪从而实现圆形图片。
+![截图](QScrollBar/ScreenShot/1.jpg)![截图](QScrollBar/ScreenShot/2.jpg)
 
-    ![截图](QLabel/ScreenShot/圆形图片.png)
+## [QSlider](QSlider/)
+
+### 1. [通过QSS美化](QSlider/QssQSlider.py)
+![截图](QSlider/ScreenShot/QssQSlider.gif)
+
+### 2. [paintEvent绘制](QSlider/PaintQSlider.py)
+![截图](QSlider/ScreenShot/PaintQSlider.gif)
+
+## [Effect](Effect/)
+特效
+
+### 1. [图片按钮输入框阴影](Effect/图片按钮输入框阴影.py)
+1.通过`setGraphicsEffect`设置控件的边框阴影
+2.继承`QGraphicsDropShadowEffect`实现增加动态属性`radius`
+3.通过`QPropertyAnimation`属性动画不断改变`radius`的值并调用`setBlurRadius`更新半径值
+
+![截图](Effect/ScreenShot/图片按钮输入框阴影.gif)
+
+## [QWidget](QWidget/)
+解决继承后的QWidget无法设置样式
+
+ - 1.重写paintEvent
+ - 2.设置Qt.WA_StyledBackground属性
+
+![截图](QWidget/ScreenShot/QWidget样式测试.png)

美化/各类进度条/MetroLineProgress.py

@@ -1,196 +0,0 @@
-#!/usr/bin/env python
-# -*- coding: utf-8 -*-
-
-"""
-Created on 2018年9月5日
-@author: Irony
-@site: https://pyqt5.com, https://github.com/892768447
-@email: 892768447@qq.com
-@file: MetroLineProgress
-@description: 
-"""
-from PyQt5.QtCore import QSequentialAnimationGroup, pyqtProperty,\
-    QPauseAnimation, QPropertyAnimation, QParallelAnimationGroup,\
-    QObject, QSize, Qt, pyqtSignal, QRectF
-from PyQt5.QtGui import QPainter, QColor
-from PyQt5.QtWidgets import QWidget, QVBoxLayout
-
-
-__Author__ = """By: Irony
-QQ: 892768447
-Email: 892768447@qq.com"""
-__Copyright__ = 'Copyright (c) 2018 Irony'
-__Version__ = 1.0
-
-
-class CircleItem(QObject):
-
-    X = 0  # x坐标
-    Opacity = 1  # 透明度0~1
-    valueChanged = pyqtSignal()
-
-    @pyqtProperty(float)
-    def x(self) -> float:
-        return self.X
-
-    @x.setter
-    def x(self, x: float):
-        self.X = x
-        self.valueChanged.emit()
-
-    @pyqtProperty(float)
-    def opacity(self) -> float:
-        return self.Opacity
-
-    @opacity.setter
-    def opacity(self, opacity: float):
-        self.Opacity = opacity
-
-
-def qBound(miv, cv, mxv):
-    return max(min(cv, mxv), miv)
-
-
-class MetroLineProgress(QWidget):
-
-    Radius = 5  # 半径
-    Color = QColor(24, 189, 155)  # 圆圈颜色
-    BackgroundColor = QColor(Qt.transparent)  # 背景颜色
-
-    def __init__(self, *args, radius=5, color=QColor(24, 189, 155),
-                 backgroundColor=QColor(Qt.transparent), **kwargs):
-        super(MetroLineProgress, self).__init__(*args, **kwargs)
-        self.Radius = radius
-        self.Color = color
-        self.BackgroundColor = backgroundColor
-        self._items = []
-        self._initAnimations()
-
-    @pyqtProperty(int)
-    def radius(self) -> int:
-        return self.Radius
-
-    @radius.setter
-    def radius(self, radius: int):
-        if self.Radius != radius:
-            self.Radius = radius
-            self.update()
-
-    @pyqtProperty(QColor)
-    def color(self) -> QColor:
-        return self.Color
-
-    @color.setter
-    def color(self, color: QColor):
-        if self.Color != color:
-            self.Color = color
-            self.update()
-
-    @pyqtProperty(QColor)
-    def backgroundColor(self) -> QColor:
-        return self.BackgroundColor
-
-    @backgroundColor.setter
-    def backgroundColor(self, backgroundColor: QColor):
-        if self.BackgroundColor != backgroundColor:
-            self.BackgroundColor = backgroundColor
-            self.update()
-
-    def paintEvent(self, event):
-        super(MetroLineProgress, self).paintEvent(event)
-        painter = QPainter(self)
-        painter.setRenderHint(QPainter.Antialiasing)
-        painter.fillRect(self.rect(), self.BackgroundColor)
-        painter.setPen(Qt.NoPen)
-
-        for item, _ in self._items:
-            painter.save()
-            color = self.Color.toRgb()
-            color.setAlphaF(item.opacity)
-            painter.setBrush(color)
-            # 5<= radius <=10
-            radius = qBound(self.Radius, self.Radius / 200 *
-                            self.height(), 2 * self.Radius)
-            diameter = 2 * radius
-            painter.drawRoundedRect(
-                QRectF(
-                    item.x / 100 * self.width() - diameter,
-                    (self.height() - radius) / 2,
-                    diameter, diameter
-                ), radius, radius)
-            painter.restore()
-
-    def _initAnimations(self):
-        for index in range(5):  # 5个小圆
-            item = CircleItem(self)
-            item.valueChanged.connect(self.update)
-            # 串行动画组
-            seqAnimation = QSequentialAnimationGroup(self)
-            seqAnimation.setLoopCount(-1)
-            self._items.append((item, seqAnimation))
-
-            # 暂停延迟动画
-            seqAnimation.addAnimation(QPauseAnimation(150 * index, self))
-
-            # 加速,并行动画组1
-            parAnimation1 = QParallelAnimationGroup(self)
-            # 透明度
-            parAnimation1.addAnimation(QPropertyAnimation(
-                item, b'opacity', self, duration=400, startValue=0, endValue=1.0))
-            # x坐标
-            parAnimation1.addAnimation(QPropertyAnimation(
-                item, b'x', self, duration=400, startValue=0, endValue=25.0))
-            seqAnimation.addAnimation(parAnimation1)
-            ##
-
-            # 匀速
-            seqAnimation.addAnimation(QPropertyAnimation(
-                item, b'x', self, duration=2000, startValue=25.0, endValue=75.0))
-
-            # 加速,并行动画组2
-            parAnimation2 = QParallelAnimationGroup(self)
-            # 透明度
-            parAnimation2.addAnimation(QPropertyAnimation(
-                item, b'opacity', self, duration=400, startValue=1.0, endValue=0))
-            # x坐标
-            parAnimation2.addAnimation(QPropertyAnimation(
-                item, b'x', self, duration=400, startValue=75.0, endValue=100.0))
-            seqAnimation.addAnimation(parAnimation2)
-            ##
-
-            # 暂停延迟动画
-            seqAnimation.addAnimation(
-                QPauseAnimation((5 - index - 1) * 150, self))
-
-        for _, animation in self._items:
-            animation.start()
-
-    def sizeHint(self):
-        return QSize(100, self.Radius * 2)
-
-
-class Window(QWidget):
-
-    def __init__(self, *args, **kwargs):
-        super(Window, self).__init__(*args, **kwargs)
-        self.resize(800, 600)
-        layout = QVBoxLayout(self, spacing=0)
-        layout.setContentsMargins(0, 0, 0, 0)
-        layout.addWidget(MetroLineProgress(self))
-        layout.addWidget(MetroLineProgress(self, radius=10))
-        layout.addWidget(MetroLineProgress(self, styleSheet="""
-            qproperty-color: rgb(255, 0, 0);
-        """))
-        layout.addWidget(MetroLineProgress(self, styleSheet="""
-            qproperty-color: rgb(0, 0, 255);
-            qproperty-backgroundColor: rgba(180, 180, 180, 180);
-        """))
-
-
-if __name__ == '__main__':
-    import sys
-    from PyQt5.QtWidgets import QApplication
-    app = QApplication(sys.argv)
-    w = Window()
-    w.show()
-    sys.exit(app.exec_())

美化/各类进度条/README.md

@@ -1,13 +0,0 @@
-# 各类进度条
-
-### [1.CircleProgressBar](CircleProgressBar.py)
-
-![CircleProgressBar](ScreenShot/1.gif)
-
-### [2.PercentProgressBar](PercentProgressBar.py)
-
-![PercentProgressBar](ScreenShot/2.gif)
-
-### [3.MetroLineProgress](MetroLineProgress.py)
-
-![MetroLineProgress](ScreenShot/3.gif)

美化/自定义QWidget的QSS样式/README.md

@@ -1,10 +0,0 @@
-# 自定QWidget 设置QSS样式
-
-由于自定义QWidget 会导致QSS无效
-这里通过两个方法来实现
-
- - 1.重写paintEvent
- - 2.设置Qt.WA_StyledBackground属性
-
-# 截图
-![截图](ScreenShot/1.png)

美化/边框动画阴影/README.md

@@ -1,10 +0,0 @@
-# QGraphicsDropShadowEffect动态边框阴影动画
-
-### 简单说明
- - 1.通过setGraphicsEffect设置控件的边框阴影
- - 2.继承QGraphicsDropShadowEffect实现增加动态属性radius
- - 3.通过QPropertyAnimation属性动画不断改变radius的值并调用setBlurRadius更新半径值
-
-截图
-
-![1](ScreenShot/1.gif)