Add QmlInvertedImage

zhengtianzuo · zhengtianzuo · commit 071e96e94c48 · 2017-11-02T10:45:23.000+08:00
diff --git a/QmlInvertedImage/1.png b/QmlInvertedImage/1.png
diff --git a/QmlInvertedImage/QmlInvertedImage.pro b/QmlInvertedImage/QmlInvertedImage.pro
@@ -0,0 +1,13 @@
+#-------------------------------------------------
+#
+# Copyright (C) 2003-2103 CamelSoft Corporation
+#
+#-------------------------------------------------
+
+QT += qml quick
+
+CONFIG += c++11
+
+SOURCES += main.cpp
+
+RESOURCES += qml.qrc
diff --git a/QmlInvertedImage/main.cpp b/QmlInvertedImage/main.cpp
@@ -0,0 +1,20 @@
+﻿/*!
+ *@file main.cpp
+ *@brief 程序主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+int main(int argc, char *argv[])
+{
+    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
+    QGuiApplication app(argc, argv);
+
+    QQmlApplicationEngine engine;
+    engine.load(QUrl(QLatin1String("qrc:/main.qml")));
+
+    return app.exec();
+}
diff --git a/QmlInvertedImage/main.qml b/QmlInvertedImage/main.qml
@@ -0,0 +1,53 @@
+﻿/*!
+ *@file main.qml
+ *@brief 主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+import QtGraphicalEffects 1.0
+
+ApplicationWindow {
+    visible: true
+    width: 400
+    height: 320
+    title: qsTr("Qml倒影")
+    color: "#AAAAAA"
+
+    Image {
+        id: img
+        width: 128
+        height: 128
+        anchors.top: parent.top
+        anchors.topMargin: 16
+        anchors.horizontalCenter: parent.horizontalCenter
+        source: "qrc:/1.png"
+
+        ShaderEffect {
+            height: parent.height
+            width: parent.width
+            anchors.top: parent.bottom
+            anchors.left: parent.left
+
+            property variant source: img
+            property size sourceSize: Qt.size(0.5 / img.width, 0.5 / img.height)
+
+            fragmentShader: "
+                varying highp vec2 qt_TexCoord0;
+                uniform lowp sampler2D source;
+                uniform lowp vec2 sourceSize;
+                uniform lowp float qt_Opacity;
+                void main() {
+                    lowp vec2 tc = qt_TexCoord0 * vec2(1, -1) + vec2(0, 1);
+                    lowp vec4 col = 0.25 * (texture2D(source, tc + sourceSize)
+                                            + texture2D(source, tc- sourceSize)
+                                            + texture2D(source, tc + sourceSize * vec2(1, -1))
+                                            + texture2D(source, tc + sourceSize * vec2(-1, 1))
+                                           );
+                    gl_FragColor = col * qt_Opacity * (1.0 - qt_TexCoord0.y) * 0.5;
+                }"
+        }
+    }
+}
diff --git a/QmlInvertedImage/qml.qrc b/QmlInvertedImage/qml.qrc
@@ -0,0 +1,6 @@
+<RCC>
+    <qresource prefix="/">
+        <file>main.qml</file>
+        <file>1.png</file>
+    </qresource>
+</RCC>
diff --git a/QmlInvertedImage/show.jpg b/QmlInvertedImage/show.jpg
diff --git a/QtQuickExamples.pro b/QtQuickExamples.pro
@@ -35,4 +35,5 @@ SUBDIRS += QmlWinExtras
 SUBDIRS += QmlCalendar
 SUBDIRS += QmlCanvasText
 SUBDIRS += QmlKey
-SUBDIRS += QmlLoader
+SUBDIRS += QmlLoader
+SUBDIRS += QmlInvertedImage
diff --git a/README.md b/README.md
@@ -162,3 +162,8 @@ QmlLoader: QmlLoader
 
 ![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlLoader/show.gif?raw=true)
 
+
+QmlInvertedImage: Qml倒影
+
+![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlInvertedImage/show.jpg?raw=true)
+
