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