From 4d095a3316108df85ff033b64935a86f34bf967d Mon Sep 17 00:00:00 2001 From: Ronan Abhamon Date: Fri, 9 Sep 2016 17:26:53 +0200 Subject: [PATCH] feat(newCall): new newCall view --- tests/imgs/avatar.svg | 12 ++ tests/imgs/camera.svg | 15 +++ tests/imgs/phone.svg | 17 +++ tests/languages/en.ts | 18 +++ tests/languages/fr.ts | 18 +++ tests/linphone.pro | 4 +- tests/resources.qrc | 10 +- .../components/dialog/DialogDescription.qml | 4 +- tests/ui/components/dialog/DialogPlus.qml | 18 +-- .../components/form/TransparentComboBox.qml | 2 + tests/ui/components/misc/Contact.qml | 75 ++++++++++++ tests/ui/components/select/SelectContact.qml | 113 ++++++++++++++++++ tests/ui/views/mainWindow.qml | 2 +- tests/ui/views/manageAccounts.qml | 2 - tests/ui/views/newCall.qml | 27 +++++ 15 files changed, 322 insertions(+), 15 deletions(-) create mode 100644 tests/imgs/avatar.svg create mode 100644 tests/imgs/camera.svg create mode 100644 tests/imgs/phone.svg create mode 100644 tests/ui/components/misc/Contact.qml create mode 100644 tests/ui/components/select/SelectContact.qml create mode 100644 tests/ui/views/newCall.qml diff --git a/tests/imgs/avatar.svg b/tests/imgs/avatar.svg new file mode 100644 index 000000000..60ce48c8e --- /dev/null +++ b/tests/imgs/avatar.svg @@ -0,0 +1,12 @@ + + + + avatar + Created with Sketch. + + + + + + + \ No newline at end of file diff --git a/tests/imgs/camera.svg b/tests/imgs/camera.svg new file mode 100644 index 000000000..886335353 --- /dev/null +++ b/tests/imgs/camera.svg @@ -0,0 +1,15 @@ + + + + camera_default + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/tests/imgs/phone.svg b/tests/imgs/phone.svg new file mode 100644 index 000000000..127b2012e --- /dev/null +++ b/tests/imgs/phone.svg @@ -0,0 +1,17 @@ + + + + route_earpiece + Created with Sketch. + + + + + + + + + + + + \ No newline at end of file diff --git a/tests/languages/en.ts b/tests/languages/en.ts index b8847179f..fba37750c 100644 --- a/tests/languages/en.ts +++ b/tests/languages/en.ts @@ -1,6 +1,13 @@ + + SelectContact + + contactSearch + Search contact or enter SIP address + + mainWindow @@ -63,4 +70,15 @@ VALIDATE + + newCall + + newCallTitle + New call + + + cancel + CANCEL + + diff --git a/tests/languages/fr.ts b/tests/languages/fr.ts index 0c6d68f0b..3cc175a8c 100644 --- a/tests/languages/fr.ts +++ b/tests/languages/fr.ts @@ -1,6 +1,13 @@ + + SelectContact + + contactSearch + Rechercher un contact ou entrer une adresse SIP + + mainWindow @@ -63,4 +70,15 @@ VALIDER + + newCall + + newCallTitle + Nouvel appel + + + cancel + ANNULER + + diff --git a/tests/linphone.pro b/tests/linphone.pro index 6185daa39..b912b7512 100644 --- a/tests/linphone.pro +++ b/tests/linphone.pro @@ -1,4 +1,4 @@ -QT = core gui quick widgets +QT = core gui quick widgets quickcontrols2 TARGET = linphone TEMPLATE = app @@ -23,6 +23,8 @@ lupdate_only{ SOURCES = \ ui/components/dialog/*.qml \ ui/components/form/*.qml \ + ui/components/misc/*.qml \ + ui/components/select/*.qml \ ui/views/*.qml } diff --git a/tests/resources.qrc b/tests/resources.qrc index 88714d77f..6d20c1bd5 100644 --- a/tests/resources.qrc +++ b/tests/resources.qrc @@ -4,7 +4,7 @@ languages/en.qm languages/fr.qm - + ui/components/dialog/DialogDescription.qml ui/components/dialog/DialogPlus.qml ui/components/form/Collapse.qml @@ -12,10 +12,18 @@ ui/components/form/RoundButton.qml ui/components/form/ToolBarButton.qml ui/components/form/TransparentComboBox.qml + ui/components/misc/Contact.qml + ui/components/select/SelectContact.qml + + ui/views/mainWindow.qml ui/views/manageAccounts.qml + ui/views/newCall.qml + imgs/avatar.svg + imgs/camera.svg + imgs/phone.svg imgs/collapse.svg imgs/led_absent.svg imgs/led_connected.svg diff --git a/tests/ui/components/dialog/DialogDescription.qml b/tests/ui/components/dialog/DialogDescription.qml index b975e5906..69650bb74 100644 --- a/tests/ui/components/dialog/DialogDescription.qml +++ b/tests/ui/components/dialog/DialogDescription.qml @@ -1,10 +1,12 @@ import QtQuick 2.7 +// =================================================================== + Item { property alias text: description.text property alias fontSize: description.font.pointSize - height: 90 + height: text ? 90 : 25 Text { anchors.fill: parent diff --git a/tests/ui/components/dialog/DialogPlus.qml b/tests/ui/components/dialog/DialogPlus.qml index 8e82b2aec..4d6fe5204 100644 --- a/tests/ui/components/dialog/DialogPlus.qml +++ b/tests/ui/components/dialog/DialogPlus.qml @@ -2,14 +2,13 @@ import QtQuick 2.7 import QtQuick.Layouts 1.3 import QtQuick.Window 2.2 +// =================================================================== + Window { - default property alias contents: content.data - - // Optionnal description text. - property alias descriptionText: description.text - - // Required buttons. - property alias buttons: buttons.data + default property alias contents: content.data // Required. + property alias descriptionText: description.text // Optionnal. + property alias buttons: buttons.data // Required. + property bool centeredButtons // Optionnal. modality: Qt.WindowModal @@ -33,10 +32,11 @@ Window { // Buttons. Item { Layout.fillWidth: true - height: 100 + height: 60 Row { - anchors.left: parent.left + anchors.left: (!centeredButtons && parent.left) || undefined + anchors.horizontalCenter: parent.horizontalCenter anchors.leftMargin: 50 anchors.verticalCenter: parent.verticalCenter height: 30 diff --git a/tests/ui/components/form/TransparentComboBox.qml b/tests/ui/components/form/TransparentComboBox.qml index 51a2c2567..21e26e84d 100644 --- a/tests/ui/components/form/TransparentComboBox.qml +++ b/tests/ui/components/form/TransparentComboBox.qml @@ -1,6 +1,8 @@ import QtQuick 2.7 import QtQuick.Controls 2.0 +// =================================================================== + ComboBox { background: Rectangle { color: 'transparent' diff --git a/tests/ui/components/misc/Contact.qml b/tests/ui/components/misc/Contact.qml new file mode 100644 index 000000000..7d800ef03 --- /dev/null +++ b/tests/ui/components/misc/Contact.qml @@ -0,0 +1,75 @@ +import QtQuick 2.7 +import QtQuick.Layouts 1.3 + +Item { + property alias sipAddress: sipAddressText.text + property alias username: usernameText.text + property string avatar: 'qrc:/imgs/avatar.svg' // Default. + + id: contact + height: 50 + + RowLayout { + anchors.fill: parent + + // Avatar. + Image { + Layout.fillHeight: parent.height + Layout.margins: 5 + Layout.preferredWidth: 50 + fillMode: Image.PreserveAspectFit + id: avatarImage + source: contact.avatar + } + + // Sip address & username. + Column { + Layout.fillHeight: parent.height + Layout.fillWidth: true + + // Sip address. + Text { + clip: true + color: '#5A585B' + font.weight: Font.DemiBold + height: parent.height / 2 + id: sipAddressText + verticalAlignment: Text.AlignBottom + width: parent.width + } + + // Username. + Text { + clip: true + color: '#5A585B' + height: parent.height / 2 + id: usernameText + verticalAlignment: Text.AlignTop + width: parent.width + } + } + + // Actions. + Row { + Layout.fillHeight: parent.height + Layout.preferredWidth: 90 + Layout.margins: 10 + + // Call. + Image { + fillMode: Image.PreserveAspectFit + height: parent.height + source: 'qrc:/imgs/phone.svg' + width: parent.width / 2 + } + + // Camera. + Image { + fillMode: Image.PreserveAspectFit + height: parent.height + source: 'qrc:/imgs/camera.svg' + width: parent.width / 2 + } + } + } +} diff --git a/tests/ui/components/select/SelectContact.qml b/tests/ui/components/select/SelectContact.qml new file mode 100644 index 000000000..12d154a7e --- /dev/null +++ b/tests/ui/components/select/SelectContact.qml @@ -0,0 +1,113 @@ +import QtGraphicalEffects 1.0 +import QtQuick 2.7 +import QtQuick.Controls 2.0 + +import 'qrc:/ui/components/misc' + +// TODO: Contacts list. +Item { + function setPopupVisibility (visibility) { + popup.visible = popupShadow.visible = visibility + } + + function filterContacts (text) { + console.log(text) + } + + TextField { + placeholderText: qsTr('contactSearch') + background: Rectangle { + implicitHeight: 40 + border.color: '#CBCBCB' + border.width: 2 + color: '#FFFFFF' + } + id: textField + width: parent.width + + onFocusChanged: setPopupVisibility(focus) + onTextChanged: filterContacts(text) + } + + Rectangle { + anchors.top: textField.bottom + anchors.topMargin: 2 + border.color: '#9B9B9B' + color: '#EAEAEA' + height: parent.height - textField.height // Avoid overflow. + id: popup + visible: false + width: parent.width + + ListView { + anchors.fill: parent + boundsBehavior: Flickable.StopAtBounds + clip: true + highlightRangeMode: ListView.ApplyRange + id: contactsList + spacing: 0 + + // TODO: Remove, use C++ model instead. + model: ListModel { + ListElement { + _presence: 'connected' + _sipAddress: 'jim.williams.zzzz.yyyy.kkkk.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'connected' + _sipAddress: 'toto.lala.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'disconnected' + _sipAddress: 'machin.truc.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'absent' + _sipAddress: 'hey.listen.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'do_not_disturb' + _sipAddress: 'valentin.cognito.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'do_not_disturb' + _sipAddress: 'charles.henri.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'disconnected' + _sipAddress: 'yesyes.nono.sip.linphone.org' + _username: 'Toto' + } + ListElement { + _presence: 'connected' + _sipAddress: 'nsa.sip.linphone.org' + _username: 'Toto' + } + } + + delegate: Contact { + sipAddress: _sipAddress + username: _username + width: parent.width + } + } + } + + DropShadow { + anchors.fill: popup + color: "#80000000" + horizontalOffset: 0 + id: popupShadow + radius: 8.0 + samples: 15 + source: popup + verticalOffset: 2 + visible: false + } +} diff --git a/tests/ui/views/mainWindow.qml b/tests/ui/views/mainWindow.qml index 043c67a09..c0d89c04e 100644 --- a/tests/ui/views/mainWindow.qml +++ b/tests/ui/views/mainWindow.qml @@ -29,7 +29,7 @@ ApplicationWindow { // User actions. ToolBarButton { onClicked: { - var component = Qt.createComponent('qrc:/ui/views/manageAccounts.qml'); + var component = Qt.createComponent('qrc:/ui/views/newCall.qml'); if (component.status !== Component.Ready) { console.debug('Window not ready.') if(component.status === Component.Error) { diff --git a/tests/ui/views/manageAccounts.qml b/tests/ui/views/manageAccounts.qml index 9fe617c2b..80d79c792 100644 --- a/tests/ui/views/manageAccounts.qml +++ b/tests/ui/views/manageAccounts.qml @@ -1,14 +1,12 @@ import QtQuick 2.7 import QtQuick.Controls 2.0 import QtQuick.Layouts 1.3 -import QtQuick.Window 2.2 import 'qrc:/ui/components/dialog' import 'qrc:/ui/components/form' DialogPlus { descriptionText: qsTr('manageAccountsDescription') - id: window minimumHeight: 328 minimumWidth: 480 title: qsTr('manageAccountsTitle') diff --git a/tests/ui/views/newCall.qml b/tests/ui/views/newCall.qml new file mode 100644 index 000000000..65157beaa --- /dev/null +++ b/tests/ui/views/newCall.qml @@ -0,0 +1,27 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.0 + +import 'qrc:/ui/components/dialog' +import 'qrc:/ui/components/form' +import 'qrc:/ui/components/select' + +DialogPlus { + centeredButtons: true + minimumHeight: 300 + minimumWidth: 420 + title: qsTr('newCallTitle') + + buttons: DialogButton { + text: qsTr('cancel') + } + + Item { + anchors.fill: parent + anchors.leftMargin: 25 + anchors.rightMargin: 25 + + SelectContact { + anchors.fill: parent + } + } +}