QML: recoloring fragment shader (recolor monochrome icons in runtime)

fingerprint.svg

recolorshader.qml

import QtQuick 2.4

Item {
  width: 320
  height: 640

  Image {
    id: img
    source: 'fingerprint.svg'
    sourceSize.width: 320
  }

  ShaderEffect {
    id: shader

    anchors.top: img.bottom
    anchors.left: img.left

    width: 320
    height: 320

    property variant source: img
    property color color: "#4caf50"

    fragmentShader: "
      uniform lowp sampler2D source;
      uniform highp vec4 color;
      uniform lowp float qt_Opacity;
      varying highp vec2 qt_TexCoord0;
      void main() {
        lowp vec4 tex = texture2D(source, qt_TexCoord0);
        gl_FragColor = vec4(color.r, color.g, color.b, tex.a) * qt_Opacity;
      }
    "
  }

  SequentialAnimation
  {
    running: true
    loops: Animation.Infinite
    ColorAnimation {
      target: shader
      property: "color"
      to: "#b71c1c"
      duration: 1000
    }
    ColorAnimation {
      target: shader
      property: "color"
      to: "#4caf50"
      duration: 1000
    }
  }

}