From 8193c8a4c7190aea193b7988284057031c9d2481 Mon Sep 17 00:00:00 2001 From: Gaelle Braud Date: Wed, 6 Nov 2024 09:31:41 +0100 Subject: [PATCH] change call list ui --- Linphone/data/image/phone-call.svg | 2 +- Linphone/data/image/phone-disconnect.svg | 2 +- Linphone/data/image/phone-list.svg | 7 +- Linphone/data/image/phone-pause.svg | 1 + Linphone/data/image/phone-plus.svg | 2 +- Linphone/data/image/phone-transfer.svg | 5 +- Linphone/data/image/phone.svg | 2 +- .../Control/Display/Call/CallListView.qml | 148 +++++++++--------- .../view/Page/Window/Call/CallsWindow.qml | 36 +++-- Linphone/view/Style/AppIcons.qml | 1 + 10 files changed, 107 insertions(+), 99 deletions(-) create mode 100644 Linphone/data/image/phone-pause.svg diff --git a/Linphone/data/image/phone-call.svg b/Linphone/data/image/phone-call.svg index abba91e83..95f79692d 100644 --- a/Linphone/data/image/phone-call.svg +++ b/Linphone/data/image/phone-call.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/Linphone/data/image/phone-disconnect.svg b/Linphone/data/image/phone-disconnect.svg index 5e42636c4..bb7068f9b 100644 --- a/Linphone/data/image/phone-disconnect.svg +++ b/Linphone/data/image/phone-disconnect.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/Linphone/data/image/phone-list.svg b/Linphone/data/image/phone-list.svg index 41c805315..e3ddb1485 100644 --- a/Linphone/data/image/phone-list.svg +++ b/Linphone/data/image/phone-list.svg @@ -1,6 +1 @@ - - - - - - + \ No newline at end of file diff --git a/Linphone/data/image/phone-pause.svg b/Linphone/data/image/phone-pause.svg new file mode 100644 index 000000000..62f7be9c1 --- /dev/null +++ b/Linphone/data/image/phone-pause.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Linphone/data/image/phone-plus.svg b/Linphone/data/image/phone-plus.svg index e9bad66df..b8bb07275 100644 --- a/Linphone/data/image/phone-plus.svg +++ b/Linphone/data/image/phone-plus.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/Linphone/data/image/phone-transfer.svg b/Linphone/data/image/phone-transfer.svg index 0aff39292..17b960e99 100644 --- a/Linphone/data/image/phone-transfer.svg +++ b/Linphone/data/image/phone-transfer.svg @@ -1,4 +1 @@ - - - - + \ No newline at end of file diff --git a/Linphone/data/image/phone.svg b/Linphone/data/image/phone.svg index ac3ff5a1c..6eb862926 100644 --- a/Linphone/data/image/phone.svg +++ b/Linphone/data/image/phone.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/Linphone/view/Control/Display/Call/CallListView.qml b/Linphone/view/Control/Display/Call/CallListView.qml index 7cbfe765a..0f9b9eb39 100644 --- a/Linphone/view/Control/Display/Call/CallListView.qml +++ b/Linphone/view/Control/Display/Call/CallListView.qml @@ -22,32 +22,25 @@ ListView { property bool isTransferList: false property string currentRemoteAddress: callProxy.currentCall ? callProxy.currentCall.core.remoteAddress : "" - delegate: Item { - id: callDelegate + delegate: RowLayout { + spacing: 8 * DefaultStyle.dp width: mainItem.width height: 45 * DefaultStyle.dp - - RowLayout { - id: delegateContent - anchors.fill: parent + Avatar { + id: delegateAvatar + Layout.preferredWidth: 45 * DefaultStyle.dp + Layout.preferredHeight: 45 * DefaultStyle.dp + _address: modelData.core.remoteAddress + } + ColumnLayout { spacing: 0 - Avatar { - id: delegateAvatar - _address: modelData.core.remoteAddress - Layout.preferredWidth: 45 * DefaultStyle.dp - Layout.preferredHeight: 45 * DefaultStyle.dp - } Text { id: delegateName property var remoteNameObj: UtilsCpp.getDisplayName(modelData.core.remoteAddress) text: modelData.core.isConference ? modelData.core.conference.core.subject : remoteNameObj ? remoteNameObj.value : "" - Layout.leftMargin: 8 * DefaultStyle.dp - } - Item { - Layout.fillHeight: true - Layout.fillWidth: true + font.pixelSize: 14 * DefaultStyle.dp } Text { id: callStateText @@ -57,64 +50,73 @@ ListView { || modelData.core.state === LinphoneEnums.CallState.PausedByRemote ? type + qsTr(" en pause") : type + qsTr(" en cours") - } - Button { - id: transferButton - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - visible: mainItem.isTransferList && mainItem.currentRemoteAddress !== modelData.core.remoteAddress - onClicked: { - mainItem.transferCallToAnotherRequested(modelData) + font { + pixelSize: 12 * DefaultStyle.dp + weight: 300 * DefaultStyle.dp } - icon.source: AppIcons.transferCall - contentImageColor: down ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main - background: Item {} } - PopupButton { - visible: !mainItem.isTransferList - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - Layout.rightMargin: 10 * DefaultStyle.dp - Layout.leftMargin: 14 * DefaultStyle.dp - popup.rightPadding: 10 * DefaultStyle.dp - popup.contentItem: ColumnLayout { - spacing: 16 * DefaultStyle.dp - MenuButton { - id: pausingButton - onClicked: modelData.core.lSetPaused(!modelData.core.paused) - KeyNavigation.up: endCallButton - KeyNavigation.down: endCallButton - Layout.preferredWidth: icon.width + spacing + pauseMeter.advanceWidth + leftPadding + rightPadding - icon.source: modelData.core.state === LinphoneEnums.CallState.Paused - || modelData.core.state === LinphoneEnums.CallState.PausedByRemote - ? AppIcons.phone : AppIcons.pause - text: modelData.core.state === LinphoneEnums.CallState.Paused - || modelData.core.state === LinphoneEnums.CallState.PausedByRemote - ? qsTr("Reprendre l'appel") : qsTr("Mettre en pause") - TextMetrics { - id: pauseMeter - text: pausingButton.text - } - } - MenuButton { - id: endCallButton - onClicked: { - mainWindow.callTerminatedByUser = true - mainWindow.endCall(modelData) - } - KeyNavigation.up: pausingButton - KeyNavigation.down: pausingButton - Layout.preferredWidth: icon.width + spacing + endMeter.advanceWidth + leftPadding + rightPadding - icon.source: AppIcons.endCall - contentImageColor: DefaultStyle.danger_500main - textColor: DefaultStyle.danger_500main - text: qsTr("Terminer l'appel") - TextMetrics { - id: endMeter - text: endCallButton.text - } - } - } + } + Item{Layout.fillWidth: true} + Button { + id: transferButton + Layout.preferredWidth: 24 * DefaultStyle.dp + Layout.preferredHeight: 24 * DefaultStyle.dp + Layout.alignment: Qt.AlignVCenter + visible: mainItem.isTransferList && mainItem.currentRemoteAddress !== modelData.core.remoteAddress + icon.source: AppIcons.transferCall + contentImageColor: down ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main + onClicked: { + mainItem.transferCallToAnotherRequested(modelData) + } + background: Item {} + } + Button { + id: pausingButton + Layout.preferredWidth: 28 * DefaultStyle.dp + Layout.preferredHeight: 28 * DefaultStyle.dp + Layout.alignment: Qt.AlignVCenter + leftPadding: 5 * DefaultStyle.dp + rightPadding: 5 * DefaultStyle.dp + topPadding: 5 * DefaultStyle.dp + bottomPadding: 5 * DefaultStyle.dp + property bool isPaused: modelData.core.state === LinphoneEnums.CallState.Paused + || modelData.core.state === LinphoneEnums.CallState.PausedByRemote + color: isPaused ? DefaultStyle.success_500main : DefaultStyle.grey_500 + contentImageColor: DefaultStyle.grey_0 + KeyNavigation.right: endCallButton + KeyNavigation.left: endCallButton + icon.source: isPaused ? AppIcons.play : AppIcons.pause + icon.width: 18 * DefaultStyle.dp + icon.height: 18 * DefaultStyle.dp + onClicked: modelData.core.lSetPaused(!modelData.core.paused) + TextMetrics { + id: pauseMeter + text: pausingButton.text + } + } + Button { + id: endCallButton + Layout.preferredWidth: 38 * DefaultStyle.dp + Layout.preferredHeight: 28 * DefaultStyle.dp + leftPadding: 10 * DefaultStyle.dp + rightPadding: 10 * DefaultStyle.dp + topPadding: 5 * DefaultStyle.dp + bottomPadding: 5 * DefaultStyle.dp + color: DefaultStyle.danger_500main + KeyNavigation.left: pausingButton + KeyNavigation.right: pausingButton + icon.source: AppIcons.endCall + contentImageColor: DefaultStyle.grey_0 + icon.width: 18 * DefaultStyle.dp + icon.height: 18 * DefaultStyle.dp + textColor: DefaultStyle.danger_500main + onClicked: { + mainWindow.callTerminatedByUser = true + mainWindow.endCall(modelData) + } + TextMetrics { + id: endMeter + text: endCallButton.text } } } diff --git a/Linphone/view/Page/Window/Call/CallsWindow.qml b/Linphone/view/Page/Window/Call/CallsWindow.qml index a5e80636f..008893a84 100644 --- a/Linphone/view/Page/Window/Call/CallsWindow.qml +++ b/Linphone/view/Page/Window/Call/CallsWindow.qml @@ -539,7 +539,7 @@ AbstractWindow { contentStackView.replace(id, Control.StackView.Immediate) } headerStack.currentIndex: 0 - contentStackView.initialItem: callsListPanel + contentStackView.initialItem: callListPanel headerValidateButtonText: qsTr("Ajouter") Item { @@ -712,7 +712,7 @@ AbstractWindow { } } Component { - id: callsListPanel + id: callListPanel ColumnLayout { Control.StackView.onActivated: { rightPanel.headerTitleText = qsTr("Liste d'appel") @@ -1088,7 +1088,7 @@ AbstractWindow { : DefaultStyle.grey_600 } enabled: mainWindow.conference || mainWindow.callState != LinphoneEnums.CallState.PausedByRemote - icon.source: enabled && checked ? AppIcons.play : AppIcons.pause + icon.source: enabled && checked ? AppIcons.play : AppIcons.phonePause checked: mainWindow.call && mainWindow.callState == LinphoneEnums.CallState.Paused || mainWindow.callState == LinphoneEnums.CallState.Pausing || (!mainWindow.conference && mainWindow.callState == LinphoneEnums.CallState.PausedByRemote) onClicked: { mainWindow.call.core.lSetPaused(!mainWindow.call.core.paused) @@ -1139,6 +1139,27 @@ AbstractWindow { function onVisibleChanged() { if(!rightPanel.visible) newCallButton.checked = false} } } + CheckableButton { + id: callListButton + Layout.preferredWidth: 55 * DefaultStyle.dp + Layout.preferredHeight: 55 * DefaultStyle.dp + checkable: true + icon.source: AppIcons.callList + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp + onCheckedChanged: { + if (checked) { + rightPanel.visible = true + rightPanel.replace(callListPanel) + } else { + rightPanel.visible = false + } + } + Connections { + target: rightPanel + function onVisibleChanged() { if(!rightPanel.visible) newCallButton.checked = false} + } + } } RowLayout { Layout.row: 0 @@ -1278,15 +1299,6 @@ AbstractWindow { } } } - MenuButton { - icon.source: AppIcons.callList - text: qsTr("Liste d'appel") - onClicked: { - rightPanel.visible = true - rightPanel.replace(callsListPanel) - moreOptionsButton.close() - } - } MenuButton { icon.source: AppIcons.dialer text: qsTr("Dialer") diff --git a/Linphone/view/Style/AppIcons.qml b/Linphone/view/Style/AppIcons.qml index 0576ef442..8c2540408 100644 --- a/Linphone/view/Style/AppIcons.qml +++ b/Linphone/view/Style/AppIcons.qml @@ -39,6 +39,7 @@ QtObject { property string newCall: "image://internal/phone-plus.svg" property string endCall: "image://internal/phone-disconnect.svg" property string callList: "image://internal/phone-list.svg" + property string phonePause: "image://internal/phone-pause.svg" property string transferCall: "image://internal/phone-transfer.svg" property string adressBook: "image://internal/address-book.svg" property string adressBookSelected: "image://internal/address-book-fill.svg"