diff --git a/src/ui/qml/ContactList.qml b/src/ui/qml/ContactList.qml
index ddccb04b..1811fa69 100644
--- 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
new file mode 100644
index 00000000..c31b44e7
--- /dev/null
+++ 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
index 1146eb98..a586358b 100644
--- 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
index 1c7ddfbe..81db5ff1 100644
--- a/src/ui/qml/qml.qrc
+++ b/src/ui/qml/qml.qrc
@@ -24,6 +24,7 @@
AboutPreferences.qml
MessageDialogWrapper.qml
StartupStatusPage.qml
+ EmptyContactsHint.qml
plus.png