diff --git a/tests/languages/en.ts b/tests/languages/en.ts
index bff3b1a10..1a69fee4b 100644
--- a/tests/languages/en.ts
+++ b/tests/languages/en.ts
@@ -112,4 +112,23 @@
CANCEL
+
+ searchContact
+
+ searchContactPlaceholder
+ Search contact
+
+
+ selectAllContacts
+ All
+
+
+ selectConnectedContacts
+ Connected
+
+
+ addContact
+ ADD CONTACT
+
+
diff --git a/tests/languages/fr.ts b/tests/languages/fr.ts
index b8e00eb17..48f232e9b 100644
--- a/tests/languages/fr.ts
+++ b/tests/languages/fr.ts
@@ -112,4 +112,23 @@
ANNULER
+
+ searchContact
+
+ searchContactPlaceholder
+ Rechercher contact
+
+
+ selectAllContacts
+ Tous
+
+
+ selectConnectedContacts
+ Connectés
+
+
+ addContact
+ AJOUTER CONTACT
+
+
diff --git a/tests/linphone.pro b/tests/linphone.pro
index 927c46f77..a17dda657 100644
--- a/tests/linphone.pro
+++ b/tests/linphone.pro
@@ -21,6 +21,8 @@ TRANSLATIONS = \
lupdate_only{
# Each component folder must be added explicitly.
SOURCES = \
+ ui/components/collapse/*.qml \
+ ui/components/contact/*.qml \
ui/components/dialog/*.qml \
ui/components/form/*.qml \
ui/components/misc/*.qml \
diff --git a/tests/resources.qrc b/tests/resources.qrc
index b24185f1a..e0d5fa590 100644
--- a/tests/resources.qrc
+++ b/tests/resources.qrc
@@ -5,20 +5,26 @@
languages/fr.qm
+ ui/components/collapse/Collapse.qml
+ ui/components/contact/Avatar.qml
ui/components/dialog/DialogDescription.qml
ui/components/dialog/DialogPlus.qml
- ui/components/form/Collapse.qml
- ui/components/form/DialogButton.qml
+ ui/components/form/DarkButton.qml
ui/components/form/DialogCheckBox.qml
+ ui/components/form/ExclusiveButtons.qml
+ ui/components/form/LightButton.qml
+ ui/components/form/SmallButton.qml
ui/components/form/ToolBarButton.qml
ui/components/form/TransparentComboBox.qml
ui/components/misc/Contact.qml
ui/components/misc/MenuEntry.qml
+ ui/components/scrollBar/ForceScrollBar.qml
ui/components/select/SelectContact.qml
ui/views/mainWindow/home.qml
ui/views/mainWindow/mainWindow.qml
+ ui/views/mainWindow/searchContact.qml
ui/views/manageAccounts.qml
ui/views/newCall.qml
diff --git a/tests/ui/components/form/Collapse.qml b/tests/ui/components/collapse/Collapse.qml
similarity index 96%
rename from tests/ui/components/form/Collapse.qml
rename to tests/ui/components/collapse/Collapse.qml
index 69e471ed9..d6e2bd9b9 100644
--- a/tests/ui/components/form/Collapse.qml
+++ b/tests/ui/components/collapse/Collapse.qml
@@ -1,5 +1,4 @@
import QtQuick 2.7
-import QtQuick.Controls 2.0
// ===================================================================
diff --git a/tests/ui/components/contact/Avatar.qml b/tests/ui/components/contact/Avatar.qml
new file mode 100644
index 000000000..3cd001690
--- /dev/null
+++ b/tests/ui/components/contact/Avatar.qml
@@ -0,0 +1,24 @@
+import QtQuick 2.7
+
+Rectangle {
+ property string username
+ property string image
+
+ color: '#8F8F8F'
+ radius: 20
+
+ Text {
+ anchors.centerIn: parent
+ text: (function () {
+ var spaceIndex = username.indexOf(' ')
+ var firstLetter = username.charAt(0)
+
+ if (spaceIndex === -1) {
+ return firstLetter
+ }
+
+ return firstLetter + username.charAt(spaceIndex + 1)
+ })()
+ color: '#FFFFFF'
+ }
+}
diff --git a/tests/ui/components/dialog/DialogDescription.qml b/tests/ui/components/dialog/DialogDescription.qml
index bd459aafd..37f9470c9 100644
--- a/tests/ui/components/dialog/DialogDescription.qml
+++ b/tests/ui/components/dialog/DialogDescription.qml
@@ -1,5 +1,7 @@
import QtQuick 2.7
+// ===================================================================
+// Description content used by dialogs.
// ===================================================================
Item {
diff --git a/tests/ui/components/dialog/DialogPlus.qml b/tests/ui/components/dialog/DialogPlus.qml
index e68d51062..e1e20b422 100644
--- a/tests/ui/components/dialog/DialogPlus.qml
+++ b/tests/ui/components/dialog/DialogPlus.qml
@@ -2,12 +2,15 @@ import QtQuick 2.7
import QtQuick.Layouts 1.3
import QtQuick.Window 2.2
+// ===================================================================
+// Helper to build quickly dialogs.
// ===================================================================
Window {
default property alias contents: content.data // Required.
property alias buttons: buttons.data // Required.
property alias descriptionText: description.text // Optionnal.
+
property bool centeredButtons // Optionnal.
modality: Qt.WindowModal
diff --git a/tests/ui/components/form/DialogButton.qml b/tests/ui/components/form/DarkButton.qml
similarity index 100%
rename from tests/ui/components/form/DialogButton.qml
rename to tests/ui/components/form/DarkButton.qml
diff --git a/tests/ui/components/form/ExclusiveButtons.qml b/tests/ui/components/form/ExclusiveButtons.qml
new file mode 100644
index 000000000..e039d71d3
--- /dev/null
+++ b/tests/ui/components/form/ExclusiveButtons.qml
@@ -0,0 +1,48 @@
+import QtQuick 2.7
+
+// ===================================================================
+
+Row {
+ property alias text1: button1.text
+ property alias text2: button2.text
+
+ property bool button1IsSelected: true
+
+ signal buttonChanged (int button)
+
+ spacing: 8
+
+ SmallButton {
+ anchors.verticalCenter: parent.verticalCenter
+ backgroundColor: button1IsSelected
+ ? '#8E8E8E'
+ : (button1.down
+ ? '#FE5E00'
+ : '#D1D1D1'
+ )
+ id: button1
+ onClicked: {
+ if (!button1IsSelected) {
+ button1IsSelected = true
+ buttonChanged(1)
+ }
+ }
+ }
+
+ SmallButton {
+ anchors.verticalCenter: parent.verticalCenter
+ backgroundColor: !button1IsSelected
+ ? '#8E8E8E'
+ : (button2.down
+ ? '#FE5E00'
+ : '#D1D1D1'
+ )
+ id: button2
+ onClicked: {
+ if (button1IsSelected) {
+ button1IsSelected = false
+ buttonChanged(2)
+ }
+ }
+ }
+}
diff --git a/tests/ui/components/form/LightButton.qml b/tests/ui/components/form/LightButton.qml
new file mode 100644
index 000000000..fe09cfff1
--- /dev/null
+++ b/tests/ui/components/form/LightButton.qml
@@ -0,0 +1,9 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+
+// ===================================================================
+
+DarkButton {
+ backgroundColor: '#D1D1D1'
+ textColor: '#5A585B'
+}
diff --git a/tests/ui/components/form/SmallButton.qml b/tests/ui/components/form/SmallButton.qml
new file mode 100644
index 000000000..3205543f3
--- /dev/null
+++ b/tests/ui/components/form/SmallButton.qml
@@ -0,0 +1,24 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+
+// ===================================================================
+
+Button {
+ property alias backgroundColor: background.color
+
+ background: Rectangle {
+ color: button.down ? '#FE5E00' : '#8E8E8E'
+ id: background
+ implicitHeight: 22
+ radius: 10
+ }
+ contentItem: Text {
+ color:'#FFFFFF'
+ font.pointSize: 8
+ horizontalAlignment: Text.AlignHCenter
+ id: text
+ text: button.text
+ verticalAlignment: Text.AlignVCenter
+ }
+ id: button
+}
diff --git a/tests/ui/components/scrollBar/ForceScrollBar.qml b/tests/ui/components/scrollBar/ForceScrollBar.qml
new file mode 100644
index 000000000..7a424d171
--- /dev/null
+++ b/tests/ui/components/scrollBar/ForceScrollBar.qml
@@ -0,0 +1,17 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+
+// ===================================================================
+
+ScrollBar {
+ background: Rectangle {
+ color: '#F4F4F4'
+ }
+ contentItem: Rectangle {
+ color: scrollBar.pressed ? '#5E5E5F' : '#C5C5C5'
+ implicitHeight: 100
+ implicitWidth: 8
+ radius: 10
+ }
+ id: scrollBar
+}
diff --git a/tests/ui/views/mainWindow/home.qml b/tests/ui/views/mainWindow/home.qml
index 303612033..ccd167bba 100644
--- a/tests/ui/views/mainWindow/home.qml
+++ b/tests/ui/views/mainWindow/home.qml
@@ -4,8 +4,6 @@ import QtQuick.Layouts 1.3
import 'qrc:/ui/components/form'
-// ===================================================================
-
ColumnLayout {
spacing: 0
@@ -32,10 +30,8 @@ ColumnLayout {
font.pointSize: 11
}
- DialogButton {
- backgroundColor: '#D1D1D1'
+ LightButton {
text: qsTr('invitContact')
- textColor: '#5A585B'
}
}
@@ -50,10 +46,8 @@ ColumnLayout {
font.pointSize: 11
}
- DialogButton {
- backgroundColor: '#D1D1D1'
+ LightButton {
text: qsTr('addContact')
- textColor: '#5A585B'
}
}
}
diff --git a/tests/ui/views/mainWindow/mainWindow.qml b/tests/ui/views/mainWindow/mainWindow.qml
index 0eac26d30..c82acca78 100644
--- a/tests/ui/views/mainWindow/mainWindow.qml
+++ b/tests/ui/views/mainWindow/mainWindow.qml
@@ -2,6 +2,7 @@ import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
+import 'qrc:/ui/components/collapse'
import 'qrc:/ui/components/form'
import 'qrc:/ui/components/misc'
@@ -59,7 +60,7 @@ ApplicationWindow {
// User actions.
ToolBarButton {
onClicked: {
- var component = Qt.createComponent('qrc:/ui/views/newCall.qml');
+ var component = Qt.createComponent('qrc:/ui/views/manageAccounts.qml');
if (component.status !== Component.Ready) {
console.debug('Window not ready.')
if(component.status === Component.Error) {
@@ -141,7 +142,7 @@ ApplicationWindow {
Loader {
Layout.fillHeight: true
Layout.fillWidth: true
- source: 'qrc:/ui/views/mainWindow/home.qml'
+ source: 'qrc:/ui/views/mainWindow/searchContact.qml'
}
}
}
diff --git a/tests/ui/views/mainWindow/searchContact.qml b/tests/ui/views/mainWindow/searchContact.qml
new file mode 100644
index 000000000..ebe83e04e
--- /dev/null
+++ b/tests/ui/views/mainWindow/searchContact.qml
@@ -0,0 +1,217 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.3
+
+import 'qrc:/ui/components/contact'
+import 'qrc:/ui/components/form'
+import 'qrc:/ui/components/scrollBar'
+
+ColumnLayout {
+ spacing: 2
+
+ // Search bar.
+ Item {
+ Layout.fillWidth: true
+ Layout.preferredHeight: 50
+ anchors.left: parent.left
+ anchors.leftMargin: 18
+ anchors.right: parent.right
+ anchors.rightMargin: 18
+
+ RowLayout {
+ anchors.verticalCenter: parent.verticalCenter
+ height: 30
+ spacing: 20
+ width: parent.width
+
+ TextField {
+ Layout.fillWidth: true
+ Layout.preferredHeight: parent.height
+ background: Rectangle {
+ color: '#EAEAEA'
+ }
+ placeholderText: qsTr('searchContactPlaceholder')
+ }
+
+ ExclusiveButtons {
+ Layout.preferredHeight: parent.height
+ text1: qsTr('selectAllContacts')
+ text2: qsTr('selectConnectedContacts')
+ }
+
+ LightButton {
+ Layout.preferredHeight: parent.height
+ text: qsTr('addContact')
+ }
+ }
+ }
+
+ // Contacts list.
+ Rectangle {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ color: '#F5F5F5'
+
+ ListView {
+ ScrollBar.vertical: ForceScrollBar { }
+ anchors.fill: parent
+ boundsBehavior: Flickable.StopAtBounds
+ clip: true
+ highlightRangeMode: ListView.ApplyRange
+ spacing: 1
+
+ // TODO: Remove, use C++ model instead.
+ model: ListModel {
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Isabella Ahornton'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Mary Boreno'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'disconnected'
+ $username: 'Cecelia Cyler'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'absent'
+ $username: 'Daniel Elliott'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'do_not_disturb'
+ $username: 'Effie Forton'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'do_not_disturb'
+ $username: 'Agnes Hurner'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'disconnected'
+ $username: 'Luke Leming'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Olga Manning'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Isabella Ahornton'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Mary Boreno'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'disconnected'
+ $username: 'Cecelia Cyler'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'absent'
+ $username: 'Daniel Elliott'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'do_not_disturb'
+ $username: 'Effie Forton'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'do_not_disturb'
+ $username: 'Agnes Hurner'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'disconnected'
+ $username: 'Luke Leming'
+ }
+ ListElement {
+ $image: ''
+ $presence: 'connected'
+ $username: 'Olga Manning'
+ }
+ }
+ delegate: Rectangle {
+ color: '#FFFFFF'
+ height: 50
+ id: contact
+ width: parent.width
+
+ Item {
+ anchors.verticalCenter: parent.verticalCenter
+ height: 30
+ width: parent.width
+
+ RowLayout {
+ anchors.fill: parent
+ anchors.leftMargin: 15
+ anchors.rightMargin: 15
+ spacing: 15
+
+ // Avatar.
+ Avatar {
+ Layout.fillHeight: parent.height
+ Layout.preferredWidth: 30
+ image: $image
+ username: $username
+ }
+
+ // Presence.
+ Item {
+ Layout.fillHeight: parent.height
+ Layout.preferredWidth: 20
+
+ Image {
+ anchors.fill: parent
+ fillMode: Image.PreserveAspectFit
+ source: 'qrc:/imgs/led_' + $presence + '.svg'
+ }
+ }
+
+ // Username.
+ Item {
+ Layout.fillHeight: parent.height
+ Layout.fillWidth: true
+
+ Text {
+ anchors.fill: parent
+ clip: true
+ color: '#5A585B'
+ font.weight: Font.DemiBold
+ text: $username
+ verticalAlignment: Text.AlignVCenter
+
+ MouseArea {
+ anchors.fill: parent
+ hoverEnabled: true
+ onEntered: contact.state = 'hover'
+ onExited: contact.state = ''
+ }
+ }
+ }
+
+ // Actions.
+ // TODO.
+ }
+ }
+
+ states: State {
+ name: 'hover'
+ PropertyChanges { target: contact; color: '#D1D1D1' }
+ }
+ }
+ }
+ }
+}
diff --git a/tests/ui/views/manageAccounts.qml b/tests/ui/views/manageAccounts.qml
index 80d79c792..bacc8dda2 100644
--- a/tests/ui/views/manageAccounts.qml
+++ b/tests/ui/views/manageAccounts.qml
@@ -4,6 +4,7 @@ import QtQuick.Layouts 1.3
import 'qrc:/ui/components/dialog'
import 'qrc:/ui/components/form'
+import 'qrc:/ui/components/scrollBar'
DialogPlus {
descriptionText: qsTr('manageAccountsDescription')
@@ -11,7 +12,7 @@ DialogPlus {
minimumWidth: 480
title: qsTr('manageAccountsTitle')
- buttons: DialogButton {
+ buttons: DarkButton {
text: qsTr('validate')
}
@@ -20,6 +21,7 @@ DialogPlus {
anchors.fill: parent
ListView {
+ ScrollBar.vertical: ForceScrollBar { }
anchors.fill: parent
boundsBehavior: Flickable.StopAtBounds
clip: true
diff --git a/tests/ui/views/newCall.qml b/tests/ui/views/newCall.qml
index 65157beaa..18d673459 100644
--- a/tests/ui/views/newCall.qml
+++ b/tests/ui/views/newCall.qml
@@ -11,7 +11,7 @@ DialogPlus {
minimumWidth: 420
title: qsTr('newCallTitle')
- buttons: DialogButton {
+ buttons: DarkButton {
text: qsTr('cancel')
}