From 3839f91734b66860523d0149ca371ac748c8e0af Mon Sep 17 00:00:00 2001 From: Ronan Abhamon Date: Fri, 16 Dec 2016 16:05:20 +0100 Subject: [PATCH] feat(ui/views/App/MainWindow/ContactEdit): display contact addresses --- tests/assets/languages/en.ts | 42 ++- tests/assets/languages/fr.ts | 44 ++- tests/resources.qrc | 1 + tests/ui/modules/Common/Form/ActionSwitch.qml | 4 +- .../modules/Common/Form/ExclusiveButtons.qml | 2 +- .../ui/modules/Common/Form/StaticListForm.qml | 54 +++ .../Common/Form/TransparentTextInput.qml | 27 +- .../Styles/Form/TransparentTextInputStyle.qml | 15 +- tests/ui/modules/Common/qmldir | 1 + tests/ui/views/App/MainWindow/ContactEdit.qml | 314 ++++++++++-------- 10 files changed, 348 insertions(+), 156 deletions(-) create mode 100644 tests/ui/modules/Common/Form/StaticListForm.qml diff --git a/tests/assets/languages/en.ts b/tests/assets/languages/en.ts index 9f9b8563b..099982015 100644 --- a/tests/assets/languages/en.ts +++ b/tests/assets/languages/en.ts @@ -112,11 +112,11 @@ sipAccountsInput - SIP Address + SIP Address address - ADDRESS + ADDRESS addressInput @@ -128,7 +128,7 @@ emailsInput - E-mail address + E-mail address webSites @@ -136,7 +136,7 @@ webSitesInput - URL + URL avatarChooserTitle @@ -144,7 +144,7 @@ companiesInput - Company + Company companies @@ -158,6 +158,38 @@ cancel CANCEL + + sipAccountsPlaceholder + + + + companiesPlaceholder + + + + emailsPlaceholder + + + + webSitesPlaceholder + + + + street + + + + postalCode + + + + country + + + + locality + + Contacts diff --git a/tests/assets/languages/fr.ts b/tests/assets/languages/fr.ts index 3f06d9d8c..45fee9df7 100644 --- a/tests/assets/languages/fr.ts +++ b/tests/assets/languages/fr.ts @@ -104,11 +104,11 @@ sipAccountsInput - Adresse SIP + Adresse SIP address - ADRESSE(S) + ADRESSE(S) addressInput @@ -120,7 +120,7 @@ emailsInput - Adresse e-mail + Adresse e-mail webSites @@ -128,16 +128,12 @@ webSitesInput - URL + URL avatarChooserTitle - - companiesInput - - companies @@ -150,6 +146,38 @@ cancel ANNULER + + sipAccountsPlaceholder + + + + companiesPlaceholder + + + + emailsPlaceholder + + + + webSitesPlaceholder + + + + street + + + + postalCode + + + + country + + + + locality + + Contacts diff --git a/tests/resources.qrc b/tests/resources.qrc index 147060a40..71765a79e 100644 --- a/tests/resources.qrc +++ b/tests/resources.qrc @@ -143,6 +143,7 @@ ui/modules/Common/Form/ExclusiveButtons.qml ui/modules/Common/Form/ListForm.qml ui/modules/Common/Form/SmallButton.qml + ui/modules/Common/Form/StaticListForm.qml ui/modules/Common/Form/TextButtonA.qml ui/modules/Common/Form/TextButtonB.qml ui/modules/Common/Form/TextField.qml diff --git a/tests/ui/modules/Common/Form/ActionSwitch.qml b/tests/ui/modules/Common/Form/ActionSwitch.qml index cd373ab3a..ae2e7c4ab 100644 --- a/tests/ui/modules/Common/Form/ActionSwitch.qml +++ b/tests/ui/modules/Common/Form/ActionSwitch.qml @@ -1,6 +1,6 @@ import QtQuick 2.7 -// =================================================================== +// ============================================================================= Item { property alias useStates: actionButton.useStates @@ -10,7 +10,7 @@ Item { signal clicked - // ----------------------------------------------------------------- + // --------------------------------------------------------------------------- height: iconSize || parent.iconSize || parent.height width: iconSize || parent.iconSize || parent.height diff --git a/tests/ui/modules/Common/Form/ExclusiveButtons.qml b/tests/ui/modules/Common/Form/ExclusiveButtons.qml index 13534c35f..c98a26ea4 100644 --- a/tests/ui/modules/Common/Form/ExclusiveButtons.qml +++ b/tests/ui/modules/Common/Form/ExclusiveButtons.qml @@ -2,7 +2,7 @@ import QtQuick 2.7 import Common.Styles 1.0 -// =================================================================== +// ============================================================================= Row { id: item diff --git a/tests/ui/modules/Common/Form/StaticListForm.qml b/tests/ui/modules/Common/Form/StaticListForm.qml new file mode 100644 index 000000000..4c68c3e27 --- /dev/null +++ b/tests/ui/modules/Common/Form/StaticListForm.qml @@ -0,0 +1,54 @@ +import QtQuick 2.7 +import QtQuick.Layouts 1.3 + +import Common.Styles 1.0 + +// ============================================================================= + +RowLayout { + id: form + + property alias title: text.text + property bool readOnly: false + property var fields + + // --------------------------------------------------------------------------- + + spacing: 0 + + Text { + id: text + + Layout.leftMargin: ListFormStyle.titleArea.iconSize + ListFormStyle.titleArea.spacing + Layout.preferredHeight: ListFormStyle.lineHeight + Layout.preferredWidth: ListFormStyle.titleArea.text.width + Layout.alignment: Qt.AlignTop + + color: ListFormStyle.titleArea.text.color + elide: Text.ElideRight + + font { + bold: true + pointSize: ListFormStyle.titleArea.text.fontSize + } + + verticalAlignment: Text.AlignVCenter + } + + ColumnLayout { + Layout.fillWidth: true + spacing: 0 + + Repeater { + model: form.fields + + TransparentTextInput { + Layout.fillWidth: true + Layout.preferredHeight: ListFormStyle.lineHeight + placeholder: modelData.placeholder || '' + readOnly: form.readOnly + text: modelData.text || '' + } + } + } +} diff --git a/tests/ui/modules/Common/Form/TransparentTextInput.qml b/tests/ui/modules/Common/Form/TransparentTextInput.qml index 39829ffe7..c4489c5f0 100644 --- a/tests/ui/modules/Common/Form/TransparentTextInput.qml +++ b/tests/ui/modules/Common/Form/TransparentTextInput.qml @@ -11,6 +11,7 @@ Item { property alias color: textInput.color property alias font: textInput.font property alias inputMethodHints: textInput.inputMethodHints + property alias placeholder: placeholder.text property alias readOnly: textInput.readOnly property alias text: textInput.text property bool forceFocus: false @@ -59,17 +60,37 @@ Item { visible: parent.isInvalid } + Text { + id: placeholder + + anchors.centerIn: parent + color: TransparentTextInputStyle.placeholder.color + elide: Text.ElideRight + + font { + italic: true + pointSize: TransparentTextInputStyle.placeholder.fontSize + } + + height: textInput.height + width: textInput.width + + verticalAlignment: Text.AlignVCenter + visible: textInput.text.length === 0 && !textInput.activeFocus && !textInput.readOnly + } + TextInput { id: textInput anchors.centerIn: parent - height: parent.height - parent.padding * 2 + height: parent.height width: parent.width - parent.padding * 2 clip: true color: activeFocus && !readOnly - ? TransparentTextInputStyle.textColor.focused - : TransparentTextInputStyle.textColor.normal + ? TransparentTextInputStyle.text.color.focused + : TransparentTextInputStyle.text.color.normal + font.pointSize: TransparentTextInputStyle.text.fontSize selectByMouse: true verticalAlignment: TextInput.AlignVCenter diff --git a/tests/ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml b/tests/ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml index 97e3e772f..efc6ea74a 100644 --- a/tests/ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml +++ b/tests/ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml @@ -10,8 +10,17 @@ QtObject { property int iconSize: 12 property int padding: 10 - property QtObject textColor: QtObject { - property color focused: Colors.l - property color normal: Colors.r + property QtObject placeholder: QtObject { + property color color: Colors.w + property int fontSize: 10 + } + + property QtObject text: QtObject { + property int fontSize: 10 + + property QtObject color: QtObject { + property color focused: Colors.l + property color normal: Colors.r + } } } diff --git a/tests/ui/modules/Common/qmldir b/tests/ui/modules/Common/qmldir index 440a38cf3..5f408e8f4 100644 --- a/tests/ui/modules/Common/qmldir +++ b/tests/ui/modules/Common/qmldir @@ -38,6 +38,7 @@ CheckBoxText 1.0 Form/CheckBoxText.qml ExclusiveButtons 1.0 Form/ExclusiveButtons.qml LightButton 1.0 Form/LightButton.qml ListForm 1.0 Form/ListForm.qml +StaticListForm 1.0 Form/StaticListForm.qml TextButtonA 1.0 Form/TextButtonA.qml TextButtonB 1.0 Form/TextButtonB.qml TextField 1.0 Form/TextField.qml diff --git a/tests/ui/views/App/MainWindow/ContactEdit.qml b/tests/ui/views/App/MainWindow/ContactEdit.qml index a7babe117..adef3732c 100644 --- a/tests/ui/views/App/MainWindow/ContactEdit.qml +++ b/tests/ui/views/App/MainWindow/ContactEdit.qml @@ -70,35 +70,6 @@ ColumnLayout { usernameInput.text = _vcard.username } - function _handleSipAddressChanged (index, defaultValue, newValue) { - if (!Utils.startsWith(newValue, 'sip:')) { - newValue = 'sip:' + newValue - - if (newValue === defaultValue) { - return - } - } - - var so_far_so_good = (defaultValue.length === 0) - ? _vcard.addSipAddress(newValue) - : _vcard.updateSipAddress(defaultValue, newValue) - - addresses.setInvalid(index, !so_far_so_good) - } - - function _handleUrlChanged (index, defaultValue, newValue) { - var url = Utils.extractFirstUri(newValue) - if (url === defaultValue) { - return - } - - var so_far_so_good = (defaultValue.length === 0) - ? url && _vcard.addUrl(newValue) - : url && _vcard.updateUrl(defaultValue, newValue) - - urls.setInvalid(index, !so_far_so_good) - } - // --------------------------------------------------------------------------- spacing: 0 @@ -218,140 +189,215 @@ ColumnLayout { // Info list. // --------------------------------------------------------------------------- - Flickable { - id: flick - + Loader { Layout.fillHeight: true Layout.fillWidth: true - ScrollBar.vertical: ForceScrollBar {} - boundsBehavior: Flickable.StopAtBounds - clip: true - contentHeight: infoList.height - contentWidth: width - ScrollBar.vertical.width - flickableDirection: Flickable.VerticalFlick + active: _vcard != null + sourceComponent: Flickable { + id: flick - ColumnLayout { - id: infoList + // ----------------------------------------------------------------------- - width: flick.contentWidth + function _handleSipAddressChanged (index, defaultValue, newValue) { + if (!Utils.startsWith(newValue, 'sip:')) { + newValue = 'sip:' + newValue - ListForm { - id: addresses + if (newValue === defaultValue) { + return + } + } - Layout.leftMargin: ContactEditStyle.values.leftMargin - Layout.rightMargin: ContactEditStyle.values.rightMargin - Layout.topMargin: ContactEditStyle.values.topMargin + var so_far_so_good = (defaultValue.length === 0) + ? _vcard.addSipAddress(newValue) + : _vcard.updateSipAddress(defaultValue, newValue) - defaultData: _vcard.sipAddresses - minValues: _contact ? 1 : 0 - placeholder: qsTr('sipAccountsInput') - readOnly: !_edition - title: qsTr('sipAccounts') - - onChanged: _handleSipAddressChanged(index, defaultValue, newValue) - onRemoved: _vcard.removeSipAddress(value) + addresses.setInvalid(index, !so_far_so_good) } - Rectangle { - Layout.fillWidth: true - Layout.preferredHeight: ContactEditStyle.values.separator.height - color: ContactEditStyle.values.separator.color - } - - ListForm { - id: companies - - Layout.leftMargin: ContactEditStyle.values.leftMargin - Layout.rightMargin: ContactEditStyle.values.rightMargin - - defaultData: _vcard.companies - placeholder: qsTr('companiesInput') - readOnly: !_edition - title: qsTr('companies') - - onChanged: defaultValue.length === 0 + function _handleCompanyChanged (index, defaultValue, newValue) { + var so_far_so_good = (defaultValue.length === 0) ? _vcard.addCompany(newValue) : _vcard.updateCompany(defaultValue, newValue) - onRemoved: _vcard.removeCompany(value) + + companies.setInvalid(index, !so_far_so_good) } - Rectangle { - Layout.fillWidth: true - Layout.preferredHeight: ContactEditStyle.values.separator.height - color: ContactEditStyle.values.separator.color - } - - ListForm { - id: emails - - Layout.leftMargin: ContactEditStyle.values.leftMargin - Layout.rightMargin: ContactEditStyle.values.rightMargin - - defaultData: _vcard.emails - inputMethodHints: Qt.ImhEmailCharactersOnly - placeholder: qsTr('emailsInput') - readOnly: !_edition - title: qsTr('emails') - - onChanged: defaultValue.length === 0 + function _handleEmailChanged (index, defaultValue, newValue) { + var so_far_so_good = (defaultValue.length === 0) ? _vcard.addEmail(newValue) : _vcard.updateEmail(defaultValue, newValue) - onRemoved: _vcard.removeEmail(value) + + emails.setInvalid(index, !so_far_so_good) } - Rectangle { - Layout.fillWidth: true - Layout.preferredHeight: ContactEditStyle.values.separator.height - color: ContactEditStyle.values.separator.color - } + function _handleUrlChanged (index, defaultValue, newValue) { + var url = Utils.extractFirstUri(newValue) + if (url === defaultValue) { + return + } - ListForm { - id: urls + var so_far_so_good = (defaultValue.length === 0) + ? url && _vcard.addUrl(newValue) + : url && _vcard.updateUrl(defaultValue, newValue) - Layout.leftMargin: ContactEditStyle.values.leftMargin - Layout.rightMargin: ContactEditStyle.values.rightMargin - - defaultData: _vcard.urls - inputMethodHints: Qt.ImhUrlCharactersOnly - placeholder: qsTr('webSitesInput') - readOnly: !_edition - title: qsTr('webSites') - - onChanged: _handleUrlChanged(index, defaultValue, newValue) - onRemoved: _vcard.removeUrl(value) - } - - Rectangle { - Layout.fillWidth: true - Layout.preferredHeight: ContactEditStyle.values.separator.height - color: ContactEditStyle.values.separator.color + urls.setInvalid(index, !so_far_so_good) } - // ----------------------------------------------------------------------- - // Edition buttons. // ----------------------------------------------------------------------- - Row { - Layout.alignment: Qt.AlignHCenter - Layout.topMargin: ContactEditStyle.buttons.topMargin - spacing: ContactEditStyle.buttons.spacing - visible: _edition + ScrollBar.vertical: ForceScrollBar {} - TextButtonB { - enabled: usernameInput.text.length > 0 && _vcard.sipAddresses.length > 0 - text: qsTr('save') - onClicked: _save() + boundsBehavior: Flickable.StopAtBounds + clip: true + contentHeight: infoList.height + contentWidth: width - ScrollBar.vertical.width + flickableDirection: Flickable.VerticalFlick + + ColumnLayout { + id: infoList + + width: flick.contentWidth + + ListForm { + id: addresses + + Layout.leftMargin: ContactEditStyle.values.leftMargin + Layout.rightMargin: ContactEditStyle.values.rightMargin + Layout.topMargin: ContactEditStyle.values.topMargin + + defaultData: _vcard.sipAddresses + minValues: _contact ? 1 : 0 + placeholder: qsTr('sipAccountsPlaceholder') + readOnly: !_edition + title: qsTr('sipAccounts') + + onChanged: _handleSipAddressChanged(index, defaultValue, newValue) + onRemoved: _vcard.removeSipAddress(value) } - TextButtonA { - text: qsTr('cancel') - onClicked: _cancel() + Rectangle { + Layout.fillWidth: true + Layout.preferredHeight: ContactEditStyle.values.separator.height + color: ContactEditStyle.values.separator.color } - } - Item { - Layout.bottomMargin: ContactEditStyle.values.bottomMargin + ListForm { + id: companies + + Layout.leftMargin: ContactEditStyle.values.leftMargin + Layout.rightMargin: ContactEditStyle.values.rightMargin + + defaultData: _vcard.companies + placeholder: qsTr('companiesPlaceholder') + readOnly: !_edition + title: qsTr('companies') + + onChanged: _handleCompanyChanged(index, defaultValue, newValue) + onRemoved: _vcard.removeCompany(value) + } + + Rectangle { + Layout.fillWidth: true + Layout.preferredHeight: ContactEditStyle.values.separator.height + color: ContactEditStyle.values.separator.color + } + + ListForm { + id: emails + + Layout.leftMargin: ContactEditStyle.values.leftMargin + Layout.rightMargin: ContactEditStyle.values.rightMargin + + defaultData: _vcard.emails + inputMethodHints: Qt.ImhEmailCharactersOnly + placeholder: qsTr('emailsPlaceholder') + readOnly: !_edition + title: qsTr('emails') + + onChanged: _handleEmailChanged(index, defaultValue, newValue) + onRemoved: _vcard.removeEmail(value) + } + + Rectangle { + Layout.fillWidth: true + Layout.preferredHeight: ContactEditStyle.values.separator.height + color: ContactEditStyle.values.separator.color + } + + ListForm { + id: urls + + Layout.leftMargin: ContactEditStyle.values.leftMargin + Layout.rightMargin: ContactEditStyle.values.rightMargin + + defaultData: _vcard.urls + inputMethodHints: Qt.ImhUrlCharactersOnly + placeholder: qsTr('webSitesPlaceholder') + readOnly: !_edition + title: qsTr('webSites') + + onChanged: _handleUrlChanged(index, defaultValue, newValue) + onRemoved: _vcard.removeUrl(value) + } + + Rectangle { + Layout.fillWidth: true + Layout.preferredHeight: ContactEditStyle.values.separator.height + color: ContactEditStyle.values.separator.color + } + + StaticListForm { + Layout.leftMargin: ContactEditStyle.values.leftMargin + Layout.rightMargin: ContactEditStyle.values.rightMargin + + fields: { + var address = _vcard.address + + return [{ + placeholder: qsTr('street'), + text: address.street + }, { + placeholder: qsTr('locality'), + text: address.locality + }, { + placeholder: qsTr('postalCode'), + text: address.postalCode + }, { + placeholder: qsTr('country'), + text: address.country + }] + } + + readOnly: !_edition + title: qsTr('address') + } + + // --------------------------------------------------------------------- + // Edition buttons. + // --------------------------------------------------------------------- + + Row { + Layout.alignment: Qt.AlignHCenter + Layout.topMargin: ContactEditStyle.buttons.topMargin + spacing: ContactEditStyle.buttons.spacing + visible: _edition + + TextButtonA { + text: qsTr('cancel') + onClicked: _cancel() + } + + TextButtonB { + enabled: usernameInput.text.length > 0 && _vcard.sipAddresses.length > 0 + text: qsTr('save') + onClicked: _save() + } + } + + Item { + Layout.bottomMargin: ContactEditStyle.values.bottomMargin + } } } }