SlippedImgWidget

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

@@ -36,6 +36,7 @@ encoding//\u52A8\u753B\u7279\u6548/\u53F3\u952E\u83DC\u5355\u52A8\u753B.py=utf-8
 encoding//\u52A8\u753B\u7279\u6548/\u6DE1\u5165\u6DE1\u51FA.py=utf-8
 encoding//\u53F3\u4E0B\u89D2\u5F39\u51FA\u6846/WindowNotify.py=utf-8
 encoding//\u56FE\u7247\u52A0\u8F7D/LoadImage.py=utf-8
+encoding//\u56FE\u7247\u52A0\u8F7D/SlippedImgWidget.py=utf-8
 encoding//\u56FE\u7247\u52A0\u8F7D/res_rc.py=utf-8
 encoding//\u56FE\u7247\u52A0\u8F7D/xpmres.py=utf-8
 encoding//\u591A\u7EBF\u7A0B\u4F7F\u7528/inheritQThread.py=utf-8

README.md

@@ -37,6 +37,7 @@
  
     1. - [ ☆！ QSplitter 分割条重写 来添加按钮](分割窗口的分割条重写/)
     1. - [ QLabel 图片加载 gif动画](图片加载/)
+    1. - [ 一个图片显示小特效](图片加载/)
     1. - [ ComboBox 下拉选择级联--省、市、县 json 数据 ](下拉选择联动/)
     1. - [ ComboBox 自定义下拉 listitem ](partner_625781186/13.combo_listwidget/)
     1. - [ 仿QQ设置面板](仿QQ设置面板/)

图片加载/README.md

@@ -1,25 +1,32 @@
-# 图片加载测试
-
-### [Python3.4.4 or Python3.5][PyQt5]
-
-### 分别通过3中情况加载图片文件和显示gif图片
-
-1. 通过QPixmap("xxx.jpg")加载
-2. 通过pyrcc5转换res.qrc为res_rc.py文件，可以直接import加载
- - 转换命令pyrcc5 res.qrc -o res_rc.py
- - import res_rc
- - 此时可以通过QPixmap(":/images/head.jpg")来加载
-3. 通过rcc命令转成为二进制文件res.rcc
- - 转换命令tools/rcc.exe -binary res2.qrc -o res.rcc
- - 这里把资源前缀修改下(/myfile),见res2.qrc文件
- - 通过QResource.registerResource("res.rcc")注册
- - 此时可以通过QPixmap(":/myfile/images/head.jpg")来加载
-4. 通过xpm数组加载
- - 通过工具tools/Image2XPM.exe来转换
- - 这里把转换的xpm数组直接放到py文件中当做一个变量
- - 见xpmres.py中的image_head
- - 此时可以通过QPixmap(image_head)来加载
-5. 通过QMovie加载gif图片
-
-# 截图
-![截图](ScreenShot/1.gif)
+# 图片加载测试
+
+### [Python3.4.4 or Python3.5][PyQt5]
+
+### 一、通过3种方式加载图片文件和显示gif图片
+
+1. 通过QPixmap("xxx.jpg")加载
+2. 通过pyrcc5转换res.qrc为res_rc.py文件，可以直接import加载
+ - 转换命令pyrcc5 res.qrc -o res_rc.py
+ - import res_rc
+ - 此时可以通过QPixmap(":/images/head.jpg")来加载
+3. 通过rcc命令转成为二进制文件res.rcc
+ - 转换命令tools/rcc.exe -binary res2.qrc -o res.rcc
+ - 这里把资源前缀修改下(/myfile),见res2.qrc文件
+ - 通过QResource.registerResource("res.rcc")注册
+ - 此时可以通过QPixmap(":/myfile/images/head.jpg")来加载
+4. 通过xpm数组加载
+ - 通过工具tools/Image2XPM.exe来转换
+ - 这里把转换的xpm数组直接放到py文件中当做一个变量
+ - 见xpmres.py中的image_head
+ - 此时可以通过QPixmap(image_head)来加载
+5. 通过QMovie加载gif图片
+
+# 截图
+![截图](ScreenShot/1.gif)
+
+
+### 二、仿网页中的一个图片特效
+[SlippedImgWidget.py](SlippedImgWidget.py)
+
+# 截图
+![SlippedImgWidget](ScreenShot/2.gif)

图片加载/SlippedImgWidget.py

@@ -0,0 +1,80 @@
+#!/usr/bin/env python
+# -*- coding: utf-8 -*-
+
+"""
+Created on 2018年10月18日
+@author: Irony
+@site: https://pyqt5.com https://github.com/892768447
+@email: 892768447@qq.com
+@file: SlippedImgWidget
+@description: 
+"""
+from PyQt5.QtGui import QPixmap, QPainter
+from PyQt5.QtWidgets import QWidget
+
+
+__Author__ = """By: Irony
+QQ: 892768447
+Email: 892768447@qq.com"""
+__Copyright__ = "Copyright (c) 2018 Irony"
+__Version__ = "Version 1.0"
+
+
+class SlippedImgWidget(QWidget):
+
+    def __init__(self, bg, fg, *args, **kwargs):
+        super(SlippedImgWidget, self).__init__(*args, **kwargs)
+        # 开启鼠标跟踪
+        self.setMouseTracking(True)
+        # 背景
+        self.bgPixmap = QPixmap(bg)
+        # 前景
+        self.pePixmap = QPixmap(fg)
+        # 最小尺寸(背景右边和下方隐藏10个像素)
+        size = self.bgPixmap.size()
+        self.setMinimumSize(size.width() - 10, size.height() - 10)
+        self.setMaximumSize(size.width() - 10, size.height() - 10)
+        # 分成10份用于鼠标移动判断
+        self.stepX = size.width() / 10
+        self.stepY = size.height() / 10
+        # 偏移量
+        self._offsets = [-4, -4, -4, -4]  # 背景(-4,-4),前景(-4,-4)
+
+    def mouseMoveEvent(self, event):
+        super(SlippedImgWidget, self).mouseMoveEvent(event)
+        pos = event.pos()
+
+        # 偏移量
+        offsetX = 5 - int(pos.x() / self.stepX)
+        offsetY = 5 - int(pos.y() / self.stepY)
+        self._offsets[0] = offsetX
+        self._offsets[1] = offsetY
+        self._offsets[2] = offsetX
+        self._offsets[3] = offsetY
+        # 刷新
+        self.update()
+
+    def paintEvent(self, event):
+        super(SlippedImgWidget, self).paintEvent(event)
+        # 绘制图形
+        painter = QPainter(self)
+        painter.setRenderHint(QPainter.Antialiasing)
+        # 左上角偏移5个像素画背景图片
+        painter.drawPixmap(
+            -5 + self._offsets[0],
+            -5 + self._offsets[1], self.bgPixmap)
+        # 右下角偏移5个像素画前景图片
+        painter.drawPixmap(
+            self.width() - self.pePixmap.width() + 5 - self._offsets[2],
+            self.height() - self.pePixmap.height() + 5 - self._offsets[3],
+            self.pePixmap
+        )
+
+
+if __name__ == '__main__':
+    import sys
+    from PyQt5.QtWidgets import QApplication
+    app = QApplication(sys.argv)
+    w = SlippedImgWidget('images/bg.png', 'images/fg.png')
+    w.show()
+    sys.exit(app.exec_())