Display vertical scrollbar in Settings dialogs that scroll

interface/resources/qml/hifi/audio/Audio.qml

@@ -44,7 +44,6 @@ Rectangle {
         return (root.parent !== null) && root.parent.objectName == "loader";
     }
 
-
     property bool isVR: AudioScriptingInterface.context === "VR"
     property real rightMostInputLevelPos: root.width
     //placeholder for control sizes and paddings
@@ -128,7 +127,8 @@ Rectangle {
             anchors.top: flickView.top;
             anchors.right: flickView.right;
             anchors.bottom: flickView.bottom;
-            anchors.rightMargin: -verticalScrollWidth; //compensate flickView's right margin
+            anchors.rightMargin: 2
+
             background: Item {
                 implicitWidth: verticalScrollWidth;
                 Rectangle {

interface/resources/qml/hifi/tablet/tabletWindows/TabletPreferencesDialog.qml

@@ -9,6 +9,7 @@
 //
 
 import QtQuick 2.5
+import QtQuick.Controls 2.2
 
 import "."
 import "./preferences"
@@ -33,7 +34,10 @@ Item {
     property bool gotoPreviousAppFromScript: false
 
     property var tablet;
-  
+
+    readonly property real verticalScrollWidth: 10
+    readonly property real verticalScrollShaft: 8
+
     function saveAll() {
         dialog.forceActiveFocus();  // Accept any text box edits in progress.
 
@@ -103,6 +107,43 @@ Item {
             height: parent.height
             contentWidth: parent.width
             contentHeight: getSectionsHeight();
+
+            anchors.top: main.top
+            anchors.bottom: main.bottom
+
+            ScrollBar.vertical: ScrollBar {
+                policy: ScrollBar.AlwaysOn
+                parent: scrollView.parent
+                anchors.top: scrollView.top
+                anchors.right: scrollView.right
+                anchors.bottom: scrollView.bottom
+                anchors.rightMargin: 2
+
+                background: Item {
+                    implicitWidth: verticalScrollWidth
+                    Rectangle {
+                        color: hifi.colors.darkGray30;
+                        radius: 4
+                        anchors {
+                            fill: parent
+                        }
+                    }
+                }
+                contentItem: Item {
+                    implicitWidth: verticalScrollShaft
+                    Rectangle {
+                        radius: verticalScrollShaft/2
+                        color: hifi.colors.white30
+                        anchors {
+                            fill: parent
+                            leftMargin: 1  // Finesse size and position.
+                            topMargin: 1
+                            bottomMargin: 1
+                        }
+                    }
+                }
+            }
+
             Column {
                 width: 480
                 Component {
@@ -183,7 +224,7 @@ Item {
                 for (var i = 0; i < sections.length; i++) {
                     totalHeight += sections[i].height + sections[i].getPreferencesHeight();
                 }
-                var bottomPadding = 170;
+                var bottomPadding = 30;
                 return (totalHeight + bottomPadding);
             }
         }