rounded avatar images

interface/resources/qml/hifi/avatarapp/AvatarThumbnail.qml

@@ -18,6 +18,7 @@ Item {
     ShadowImage {
         id: avatarImage
         anchors.fill: parent
+        radius: 6
     }
 
     AvatarWearablesIndicator {

interface/resources/qml/hifi/avatarapp/RoundImage.qml

@@ -0,0 +1,34 @@
+import QtQuick 2.0
+
+Item {
+
+    property alias border: borderRectangle.border
+    property alias source: image.source
+    property alias fillMode: image.fillMode
+    property alias radius: mask.radius
+
+    Image {
+        id: image
+        anchors.fill: parent
+        anchors.margins: borderRectangle.border.width
+    }
+
+    Rectangle {
+        id: mask
+        anchors.fill: image
+    }
+
+    TransparencyMask {
+        anchors.fill: image
+        source: image
+        maskSource: mask
+    }
+
+    Rectangle {
+        id: borderRectangle
+        anchors.fill: parent
+
+        radius: mask.radius
+        color: "transparent"
+    }
+}

interface/resources/qml/hifi/avatarapp/ShadowImage.qml

@@ -7,11 +7,13 @@ Item {
     property alias dropShadowRadius: shadow.radius
     property alias dropShadowHorizontalOffset: shadow.horizontalOffset
     property alias dropShadowVerticalOffset: shadow.verticalOffset
+    property alias radius: image.radius
 
-    Image {
+    RoundImage {
         id: image
         width: parent.width
         height: parent.height
+        radius: 6
     }
 
     DropShadow {

interface/resources/qml/hifi/avatarapp/TransparencyMask.qml

@@ -0,0 +1,43 @@
+import QtQuick 2.0
+
+Item {
+    property alias source: sourceImage.sourceItem
+    property alias maskSource: sourceMask.sourceItem
+
+    anchors.fill: parent
+    ShaderEffectSource {
+        id: sourceMask
+        smooth: true
+        hideSource: true
+    }
+    ShaderEffectSource {
+        id: sourceImage
+        hideSource: true
+    }
+
+    ShaderEffect {
+        id: maskEffect
+        anchors.fill: parent
+
+        property variant source: sourceImage
+        property variant mask: sourceMask
+
+        fragmentShader: {
+"
+            varying highp vec2 qt_TexCoord0;
+            uniform lowp sampler2D source;
+            uniform lowp sampler2D mask;
+            void main() {
+
+                highp vec4 maskColor = texture2D(mask, vec2(qt_TexCoord0.x, qt_TexCoord0.y));
+                highp vec4 sourceColor = texture2D(source, vec2(qt_TexCoord0.x, qt_TexCoord0.y));
+
+                if(maskColor.a > 0.0)
+                    gl_FragColor = sourceColor;
+                else
+                    gl_FragColor = maskColor;
+            }
+"
+        }
+    }
+}