Show a small prompt to the add contact dialog on first run

kolodziej · Feb 22, 2014 · 53358c6 · 53358c6
1 parent af67fed
commit 53358c6
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 0 deletions.
diff --git a/src/ui/qml/ContactList.qml b/src/ui/qml/ContactList.qml
@@ -19,6 +19,7 @@ ScrollView {
     ]
 
     property QtObject selectedContact: contactsModel.contact(contactListView.currentIndex)
+    property ListView view: contactListView
 
     ListView {
         id: contactListView

diff --git a/src/ui/qml/EmptyContactsHint.qml b/src/ui/qml/EmptyContactsHint.qml
@@ -0,0 +1,34 @@
+import QtQuick 2.0
+import QtQuick.Controls 1.0
+import QtQuick.Layouts 1.0
+
+Rectangle {
+    id: emptyContactsHint
+    x: -width + (targetButton.width / 2) + 15
+    y: parent.height + 14
+    width: text.contentWidth + 8
+    height: text.contentHeight + 8
+    color: "#c4e7ff"
+
+    property Item targetButton
+    property int maximumWidth
+
+    Rectangle {
+        rotation: 45
+        width: 10
+        height: 10
+        x: parent.width - 20
+        y: -5
+        color: parent.color
+    }
+
+    Label {
+        id: text
+        text: "Click to add contacts"
+        wrapMode: Text.Wrap
+        width: maximumWidth - 16
+        x: 4
+        y: 4
+    }
+}
+
diff --git a/src/ui/qml/main.qml b/src/ui/qml/main.qml
@@ -38,6 +38,7 @@ ApplicationWindow {
 
     toolBar: ToolBar {
         RowLayout {
+            id: toolBarLayout
             width: parent.width
 
             TorStateWidget { }
@@ -48,9 +49,19 @@ ApplicationWindow {
             }
 
             ToolButton {
+                id: addContactButton
                 action: addContactAction
                 implicitHeight: 24
                 implicitWidth: 24
+
+                Loader {
+                    id: emptyState
+                    active: contactList.view.count == 0
+                    sourceComponent: EmptyContactsHint {
+                        targetButton: addContactButton
+                        maximumWidth: toolBarLayout.width
+                    }
+                }
             }
 
             ToolButton {
@@ -139,4 +150,5 @@ ApplicationWindow {
         id: contactList
         anchors.fill: parent
     }
+
 }
diff --git a/src/ui/qml/qml.qrc b/src/ui/qml/qml.qrc
@@ -24,6 +24,7 @@
         <file>AboutPreferences.qml</file>
         <file>MessageDialogWrapper.qml</file>
         <file>StartupStatusPage.qml</file>
+        <file>EmptyContactsHint.qml</file>
     </qresource>
     <qresource prefix="/ui/icons">
         <file>plus.png</file>