qml/examples/shadereffect-pixelated.qml

0001 import QtQuick 2.7
0002 import QtQuick.Controls 2.3
0003
0004 Rectangle {
0005     color: "red"
0006     anchors.fill: parent
0007
0008     ShaderEffect {
0009         id: shader
0010         Image {
0011             id: profilePic
0012             source: "https://farm8.staticflickr.com/7861/46451042134_cb4cefce18_b.jpg"
0013             visible: false
0014         }
0015         property var src: profilePic
0016         property var numberOfPixels: 10
0017         width: 400
0018         height: width
0019         anchors.centerIn: parent
0020
0021         Timer {
0022             interval: 120; running: true; repeat: true
0023             onTriggered: parent.numberOfPixels = parent.numberOfPixels < 500 ?
0024                 parent.numberOfPixels + 10 : 10
0025         }
0026
0027         vertexShader: "
0028             uniform highp mat4 qt_Matrix;
0029             attribute highp vec4 qt_Vertex;
0030             attribute highp vec2 qt_MultiTexCoord0;
0031             varying highp vec2 coord;
0032             void main() {
0033                 coord = qt_MultiTexCoord0;
0034                 gl_Position = qt_Matrix * qt_Vertex;
0035             }
0036         "
0037         fragmentShader: "
0038             #ifdef GL_ES
0039                 precision mediump float;
0040             #endif
0041
0042             varying highp vec2 coord;
0043             uniform sampler2D src;
0044             uniform lowp float qt_Opacity;
0045             uniform int numberOfPixels;
0046
0047             void main() {
0048                 // We use scale and floor to perform an round method with n precision
0049                 float scale = float(numberOfPixels);
0050                 gl_FragColor = texture2D(src, floor(coord*scale)/scale)*qt_Opacity;
0051             }
0052         "
0053     }
0054 }