From 174d07bdc9b1f5d17e52bf20e7de2a0afc8a24c6 Mon Sep 17 00:00:00 2001 From: Nicolas Fella Date: Thu, 6 Feb 2020 21:09:57 +0100 Subject: [PATCH] Kirigamify the dialer --- dialer/src/qml/Call/CallPage.qml | 3 +- dialer/src/qml/ContactsPage.qml | 80 ++++++++++++++++++ dialer/src/qml/Dialer/ContactsList.qml | 82 ------------------- dialer/src/qml/Dialer/DialPage.qml | 65 --------------- dialer/src/qml/Dialer/RoundImage.qml | 44 ---------- .../qml/{Dialer/Dialer.qml => DialerPage.qml} | 42 +++++----- dialer/src/qml/Dialpad/PhoneNumberInput.qml | 30 ------- .../src/qml/{Dialer => }/HistoryDelegate.qml | 0 .../{Dialer/History.qml => HistoryPage.qml} | 34 +++----- dialer/src/qml/main.qml | 54 +++++------- dialer/src/resources.qrc | 10 +-- 11 files changed, 138 insertions(+), 306 deletions(-) create mode 100644 dialer/src/qml/ContactsPage.qml delete mode 100644 dialer/src/qml/Dialer/ContactsList.qml delete mode 100644 dialer/src/qml/Dialer/DialPage.qml delete mode 100644 dialer/src/qml/Dialer/RoundImage.qml rename dialer/src/qml/{Dialer/Dialer.qml => DialerPage.qml} (71%) delete mode 100644 dialer/src/qml/Dialpad/PhoneNumberInput.qml rename dialer/src/qml/{Dialer => }/HistoryDelegate.qml (100%) rename dialer/src/qml/{Dialer/History.qml => HistoryPage.qml} (77%) diff --git a/dialer/src/qml/Call/CallPage.qml b/dialer/src/qml/Call/CallPage.qml index 4ae9d1bc..38b6caaa 100644 --- a/dialer/src/qml/Call/CallPage.qml +++ b/dialer/src/qml/Call/CallPage.qml @@ -22,10 +22,11 @@ import QtQuick 2.0 import QtQuick.Layouts 1.1 import org.kde.plasma.core 2.0 as PlasmaCore import org.kde.plasma.components 2.0 as PlasmaComponents +import org.kde.kirigami 2.5 as Kirigami import "../Dialpad" -Item { +Kirigami.Page { id: callPage property string status: dialerUtils.callState diff --git a/dialer/src/qml/ContactsPage.qml b/dialer/src/qml/ContactsPage.qml new file mode 100644 index 00000000..19e510af --- /dev/null +++ b/dialer/src/qml/ContactsPage.qml @@ -0,0 +1,80 @@ +/* + * Copyright 2015 Martin Klapetek + * + * This program is free software; you can redistribute it and/or modify + * it under the terms of the GNU Library General Public License as + * published by the Free Software Foundation; either version 2 or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details + * + * You should have received a copy of the GNU Library General Public + * License along with this program; if not, write to the + * Free Software Foundation, Inc., + * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ + +import QtQuick 2.7 +import QtQuick.Controls 2.2 as Controls +import QtQuick.Layouts 1.1 +import org.kde.kirigami 2.10 as Kirigami +import org.kde.people 1.0 as KPeople + +Kirigami.Page { + + title: i18n("Contacts") + + header: Kirigami.SearchField { + id: searchField + onTextChanged: contactsProxyModel.setFilterFixedString(text) + } + + Controls.Label { + anchors.centerIn: parent + text: i18n("No contacts") + visible: contactsList.count === 0 + } + + ListView { + id: contactsList + + anchors.fill: parent + + section.property: "display" + section.criteria: ViewSection.FirstCharacter + section.delegate: Kirigami.ListSectionHeader {text: section} + clip: true + + model: KPeople.PersonsSortFilterProxyModel { + id: contactsProxyModel + sourceModel: KPeople.PersonsModel { + id: contactsModel + } + requiredProperties: "phoneNumber" + filterRole: Qt.DisplayRole + sortRole: Qt.DisplayRole + filterCaseSensitivity: Qt.CaseInsensitive + Component.onCompleted: sort(0) + } + + boundsBehavior: Flickable.StopAtBounds + + Component { + id: contactListDelegate + + Kirigami.BasicListItem { + icon: model.decoration + label: model.display +// onClicked: dialerUtils.dial(model.phoneNumber) + } + } + + delegate: Kirigami.DelegateRecycler { + width: parent.width + sourceComponent: contactListDelegate + } + } +} diff --git a/dialer/src/qml/Dialer/ContactsList.qml b/dialer/src/qml/Dialer/ContactsList.qml deleted file mode 100644 index 1a662159..00000000 --- a/dialer/src/qml/Dialer/ContactsList.qml +++ /dev/null @@ -1,82 +0,0 @@ -/* - * Copyright 2015 Martin Klapetek - * - * This program is free software; you can redistribute it and/or modify - * it under the terms of the GNU Library General Public License as - * published by the Free Software Foundation; either version 2 or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details - * - * You should have received a copy of the GNU Library General Public - * License along with this program; if not, write to the - * Free Software Foundation, Inc., - * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ - -import QtQuick 2.7 -import QtQuick.Controls 2.2 as Controls -import QtQuick.Layouts 1.1 -import org.kde.kirigami 2.10 as Kirigami -import org.kde.people 1.0 as KPeople - -Item { - Controls.Label { - anchors.centerIn: parent - text: i18n("No contacts") - visible: contactsList.count === 0 - } - - ColumnLayout { - anchors.fill: parent - - Kirigami.SearchField { - id: searchField - Layout.fillWidth: true - onTextChanged: contactsProxyModel.setFilterFixedString(text) - } - - ListView { - id: contactsList - Layout.fillWidth: true - Layout.fillHeight: true - - section.property: "display" - section.criteria: ViewSection.FirstCharacter - section.delegate: Kirigami.ListSectionHeader {text: section} - clip: true - - model: KPeople.PersonsSortFilterProxyModel { - id: contactsProxyModel - sourceModel: KPeople.PersonsModel { - id: contactsModel - } - requiredProperties: "phoneNumber" - filterRole: Qt.DisplayRole - sortRole: Qt.DisplayRole - filterCaseSensitivity: Qt.CaseInsensitive - Component.onCompleted: sort(0) - } - - boundsBehavior: Flickable.StopAtBounds - - Component { - id: contactListDelegate - - Kirigami.BasicListItem { - icon: model.decoration - label: model.display -// onClicked: dialerUtils.dial(model.phoneNumber) - } - } - - delegate: Kirigami.DelegateRecycler { - width: parent.width - sourceComponent: contactListDelegate - } - } - } -} diff --git a/dialer/src/qml/Dialer/DialPage.qml b/dialer/src/qml/Dialer/DialPage.qml deleted file mode 100644 index 1b9e0574..00000000 --- a/dialer/src/qml/Dialer/DialPage.qml +++ /dev/null @@ -1,65 +0,0 @@ -/* - * Copyright 2015 Marco Martin - * - * This program is free software; you can redistribute it and/or modify - * it under the terms of the GNU Library General Public License as - * published by the Free Software Foundation; either version 2, or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU Library General Public License for more details - * - * You should have received a copy of the GNU Library General Public - * License along with this program; if not, write to the - * Free Software Foundation, Inc., - * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ - -import QtQuick 2.0 -import QtQuick.Layouts 1.1 -import org.kde.plasma.core 2.0 as PlasmaCore -import org.kde.plasma.components 2.0 as PlasmaComponents - -Column { - spacing: 0 - anchors.fill: parent - - PlasmaComponents.TabGroup { - height: parent.height - tabbar.height - width: parent.width - - History { - id: history - } - ContactsList { - id: contacts - } - Dialer { - id: dialer - } - } - PlasmaComponents.TabBar { - id: tabbar - height: units.gridUnit * 5 - width: parent.width - - tabPosition: Qt.BottomEdge - PlasmaComponents.TabButton { - iconSource: "view-history" - text: i18n("History") - tab: history - } - PlasmaComponents.TabButton { - iconSource: "view-pim-contacts" - text: i18n("Contacts") - tab: contacts - } - PlasmaComponents.TabButton { - iconSource: "input-keyboard" - text: i18n("Dialpad") - tab: dialer - } - } -} diff --git a/dialer/src/qml/Dialer/RoundImage.qml b/dialer/src/qml/Dialer/RoundImage.qml deleted file mode 100644 index 99119a42..00000000 --- a/dialer/src/qml/Dialer/RoundImage.qml +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Copyright 2017-2019 Kaidan Developers and Contributors - * Copyright 2019 Jonah Brüchert - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU General Public License as - * published by the Free Software Foundation; either version 2 of - * the License or (at your option) version 3 or any later version - * accepted by the membership of KDE e.V. (or its successor approved - * by the membership of KDE e.V.), which shall act as a proxy - * defined in Section 14 of version 3 of the license. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with this program. If not, see . - */ - -import QtQuick 2.6 -import QtGraphicalEffects 1.0 -import org.kde.kirigami 2.6 as Kirigami - -Kirigami.Icon { - id: img - property bool isRound: true - - layer.enabled: isRound - layer.effect: OpacityMask { - maskSource: Item { - width: img.width - height: img.height - - Rectangle { - anchors.centerIn: parent - width: Math.min(img.width, img.height) - height: width - radius: Math.min(width, height) - } - } - } -} diff --git a/dialer/src/qml/Dialer/Dialer.qml b/dialer/src/qml/DialerPage.qml similarity index 71% rename from dialer/src/qml/Dialer/Dialer.qml rename to dialer/src/qml/DialerPage.qml index 70d06882..b4deeab9 100644 --- a/dialer/src/qml/Dialer/Dialer.qml +++ b/dialer/src/qml/DialerPage.qml @@ -20,42 +20,40 @@ import QtQuick 2.0 import QtQuick.Layouts 1.1 +import QtQuick.Controls 2.5 as QQC2 import org.kde.plasma.core 2.0 as PlasmaCore import org.kde.plasma.components 2.0 as PlasmaComponents -import "../Dialpad" +import org.kde.kirigami 2.9 as Kirigami +import "Dialpad" -Item { +Kirigami.Page { id: dialer property alias numberEntryText: status.text - Rectangle { - width: parent.width / 2 - x: parent.width / 4 - y: parent.height - callStatusNotification.paintedHeight - color: PlasmaCore.ColorScope.backgroundColor - opacity: 0.6 + title: i18n("Dialer") + header: Kirigami.InlineMessage { + type: Kirigami.MessageType.Error + text: i18n("Unable to make a call at this moment") visible: dialerUtils.callState == "failed" - - PlasmaComponents.Label { - id: callStatusNotification - anchors.fill: parent - text: "Unable to make a call at this moment" - horizontalAlignment: Text.AlignHCenter - wrapMode: Text.WordWrap - color: PlasmaCore.ColorScope.textColor - } } ColumnLayout { id: dialPadArea anchors.fill: parent - PhoneNumberInput { + QQC2.Label { id: status + onTextChanged: { + text = dialerUtils.formatNumber(text); + } + + horizontalAlignment: Qt.AlignHCenter + verticalAlignment: Qt.AlignBottom + Layout.fillWidth: true - Layout.topMargin: units.largeSpacing * 3 + Layout.topMargin: units.largeSpacing * 2 Layout.bottomMargin: units.largeSpacing Layout.minimumHeight: units.gridUnit * 3 Layout.maximumHeight: Layout.minimumHeight @@ -67,10 +65,12 @@ Item { Layout.fillHeight: true callback: function (string) { - status.append(string) + var newText = status.text + string + status.text = dialerUtils.formatNumber(newText); } deleteCallback: function () { - status.pop() + var newText = status.text.slice(0, -1) + status.text = dialerUtils.formatNumber(newText); } pressedCallback: function (string) { // TODO diff --git a/dialer/src/qml/Dialpad/PhoneNumberInput.qml b/dialer/src/qml/Dialpad/PhoneNumberInput.qml deleted file mode 100644 index 1974ded1..00000000 --- a/dialer/src/qml/Dialpad/PhoneNumberInput.qml +++ /dev/null @@ -1,30 +0,0 @@ -import QtQuick 2.0 -import QtQuick.Controls 2.2 as Controls -import QtQuick.Layouts 1.1 - -// TODO: search through contacts while typing -Controls.TextField { - id: root - - horizontalAlignment: Qt.AlignHCenter - verticalAlignment: Qt.AlignBottom - - background: Rectangle { - opacity: 0 - } - - // append some text to the end of this input - signal append(string digit) - onAppend: { - text += digit - } - onTextChanged: { - text = dialerUtils.formatNumber(text); - } - - // remove last character from this text input - signal pop() - onPop: { - text = text.slice(0, -1) - } -} diff --git a/dialer/src/qml/Dialer/HistoryDelegate.qml b/dialer/src/qml/HistoryDelegate.qml similarity index 100% rename from dialer/src/qml/Dialer/HistoryDelegate.qml rename to dialer/src/qml/HistoryDelegate.qml diff --git a/dialer/src/qml/Dialer/History.qml b/dialer/src/qml/HistoryPage.qml similarity index 77% rename from dialer/src/qml/Dialer/History.qml rename to dialer/src/qml/HistoryPage.qml index 5d932f27..5787d7e9 100644 --- a/dialer/src/qml/Dialer/History.qml +++ b/dialer/src/qml/HistoryPage.qml @@ -1,31 +1,17 @@ -/* - * Copyright 2015 Marco Martin - * - * This program is free software; you can redistribute it and/or modify - * it under the terms of the GNU Library General Public License as - * published by the Free Software Foundation; either version 2, or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU Library General Public License for more details - * - * You should have received a copy of the GNU Library General Public - * License along with this program; if not, write to the - * Free Software Foundation, Inc., - * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ - -import QtQuick 2.4 +import QtQuick 2.3 +import QtQuick.Controls 2.3 import QtQuick.Layouts 1.1 -import org.kde.plasma.core 2.0 as PlasmaCore -import org.kde.plasma.components 2.0 as PlasmaComponents + import org.kde.plasma.extras 2.0 as PlasmaExtras +import org.kde.plasma.core 2.0 as PlasmaCore +import org.kde.kirigami 2.0 as Kirigami +import org.kde.plasma.components 2.0 as PlasmaComponents import org.kde.plasma.dialer 1.0 -Item { +Kirigami.Page { + + title: i18n("History") function secondsToTimeString(seconds) { var h = Math.floor(seconds / 3600); @@ -37,7 +23,7 @@ Item { return '' + h + ':' + m + ':' + s; } - PlasmaComponents.Label { + Label { anchors.centerIn: parent text: i18n("No recent calls") visible: view.count == 0 diff --git a/dialer/src/qml/main.qml b/dialer/src/qml/main.qml index 441c2583..d071997a 100644 --- a/dialer/src/qml/main.qml +++ b/dialer/src/qml/main.qml @@ -28,7 +28,7 @@ import org.kde.kirigami 2.0 as Kirigami import org.kde.plasma.dialer 1.0 -ApplicationWindow { +Kirigami.ApplicationWindow { id: root //BEGIN PROPERTIES @@ -42,6 +42,7 @@ ApplicationWindow { //was the last call an incoming one? property bool isIncoming + pageStack.globalToolBar.style:Kirigami.ApplicationHeaderStyle.Titles //END PROPERTIES //BEGIN SIGNAL HANDLERS @@ -82,40 +83,27 @@ ApplicationWindow { //END MODELS -//BEGIN UI - PlasmaExtras.ConditionalLoader { - anchors.fill: parent + pageStack.initialPage: dialerUtils.callState == "idle" || dialerUtils.callState == "failed" ? [Qt.resolvedUrl("HistoryPage.qml"), Qt.resolvedUrl("ContactsPage.qml"), Qt.resolvedUrl("DialerPage.qml")] : Qt.resolvedUrl("Call/CallPage.qml") - property bool shouldShow: root.visible && (dialerUtils.callState == "idle" || dialerUtils.callState == "failed") + footer: TabBar { + height: 50 - when: shouldShow - source: Qt.resolvedUrl("Dialer/DialPage.qml") - z: shouldShow ? 2 : 0 - opacity: shouldShow ? 1 : 0 - Behavior on opacity { - OpacityAnimator { - duration: Kirigami.Units.shortDuration - easing.type: Easing.InOutQuad - } + currentIndex: pageStack.currentIndex + + TabButton { + text: "Foo" + icon.name: "view-pim-contacts" + onClicked: pageStack.currentIndex = 0 + } + TabButton { + text: "Contacts" + icon.name: "view-pim-contacts" + onClicked: pageStack.currentIndex = 1 + } + TabButton { + text: "Dialer" + icon.name: "view-pim-contacts" + onClicked: pageStack.currentIndex = 2 } } - - PlasmaExtras.ConditionalLoader { - anchors.fill: parent - - property bool shouldShow: dialerUtils.callState != "idle" && dialerUtils.callState != "failed" - - when: shouldShow - source: Qt.resolvedUrl("Call/CallPage.qml") - opacity: shouldShow ? 1 : 0 - z: shouldShow ? 2 : 0 - Behavior on opacity { - OpacityAnimator { - duration: Kirigami.Units.shortDuration - easing.type: Easing.InOutQuad - } - } - } - -//END UI } diff --git a/dialer/src/resources.qrc b/dialer/src/resources.qrc index 304c911c..c9273e79 100644 --- a/dialer/src/resources.qrc +++ b/dialer/src/resources.qrc @@ -1,15 +1,13 @@ qml/main.qml + qml/DialerPage.qml + qml/ContactsPage.qml + qml/HistoryPage.qml qml/Call/AnswerSwipe.qml qml/Call/CallPage.qml qml/Call/Avatar.qml - qml/Dialer/Dialer.qml - qml/Dialer/ContactsList.qml - qml/Dialer/DialPage.qml - qml/Dialer/RoundImage.qml - qml/Dialer/History.qml - qml/Dialer/HistoryDelegate.qml + qml/HistoryDelegate.qml qml/Dialpad/Dialpad.qml qml/Dialpad/PhoneNumberInput.qml qml/Dialpad/DialerButton.qml