From 37b5ac52925174f425b04284d4f2c96cb3bf5dd3 Mon Sep 17 00:00:00 2001 From: Gaelle Braud Date: Wed, 3 Apr 2024 16:15:18 +0200 Subject: [PATCH] change layout panel + fix button ui --- Linphone/data/image/Display mode.svg | 3 + Linphone/data/image/pip.svg | 3 + Linphone/data/image/squares-four.svg | 3 + Linphone/data/image/waveform.svg | 3 + Linphone/view/App/CallsWindow.qml | 219 +++++++++++------- Linphone/view/App/Main.qml | 2 + Linphone/view/CMakeLists.txt | 1 + Linphone/view/Item/Button.qml | 14 +- Linphone/view/Item/Calendar.qml | 6 +- Linphone/view/Item/Call/CallContactsLists.qml | 2 + .../view/Item/Call/InCallSettingsPanel.qml | 1 - .../view/Item/Call/OngoingCallRightPanel.qml | 4 +- Linphone/view/Item/Call/WaitingRoom.qml | 8 + Linphone/view/Item/Contact/ContactEdition.qml | 6 + Linphone/view/Item/EffectImage.qml | 2 + Linphone/view/Item/Meeting/MeetingSetUp.qml | 8 + Linphone/view/Item/NumericPad.qml | 2 + Linphone/view/Item/PopupButton.qml | 7 +- Linphone/view/Item/RadioButton.qml | 90 ++----- .../view/Item/RoundedBackgroundControl.qml | 4 - Linphone/view/Item/SearchBar.qml | 4 + Linphone/view/Item/SecurityRadioButton.qml | 102 ++++++++ Linphone/view/Item/TextField.qml | 2 + .../Layout/Meeting/AddParticipantsLayout.qml | 4 + Linphone/view/Page/Login/LoginPage.qml | 2 + .../view/Page/Login/RegisterCheckingPage.qml | 2 + Linphone/view/Page/Login/SIPLoginPage.qml | 4 +- Linphone/view/Page/Login/SecurityModePage.qml | 2 +- Linphone/view/Page/Main/CallPage.qml | 6 + Linphone/view/Page/Main/ContactPage.qml | 12 +- Linphone/view/Page/Main/MeetingPage.qml | 14 +- Linphone/view/Style/AppIcons.qml | 4 +- 32 files changed, 364 insertions(+), 182 deletions(-) create mode 100644 Linphone/data/image/Display mode.svg create mode 100644 Linphone/data/image/pip.svg create mode 100644 Linphone/data/image/squares-four.svg create mode 100644 Linphone/data/image/waveform.svg create mode 100644 Linphone/view/Item/SecurityRadioButton.qml diff --git a/Linphone/data/image/Display mode.svg b/Linphone/data/image/Display mode.svg new file mode 100644 index 000000000..a03e362f2 --- /dev/null +++ b/Linphone/data/image/Display mode.svg @@ -0,0 +1,3 @@ + + + diff --git a/Linphone/data/image/pip.svg b/Linphone/data/image/pip.svg new file mode 100644 index 000000000..e2eb960f3 --- /dev/null +++ b/Linphone/data/image/pip.svg @@ -0,0 +1,3 @@ + + + diff --git a/Linphone/data/image/squares-four.svg b/Linphone/data/image/squares-four.svg new file mode 100644 index 000000000..d7f16bd54 --- /dev/null +++ b/Linphone/data/image/squares-four.svg @@ -0,0 +1,3 @@ + + + diff --git a/Linphone/data/image/waveform.svg b/Linphone/data/image/waveform.svg new file mode 100644 index 000000000..89edf217a --- /dev/null +++ b/Linphone/data/image/waveform.svg @@ -0,0 +1,3 @@ + + + diff --git a/Linphone/view/App/CallsWindow.qml b/Linphone/view/App/CallsWindow.qml index 80f638b3d..9e115ca37 100644 --- a/Linphone/view/App/CallsWindow.qml +++ b/Linphone/view/App/CallsWindow.qml @@ -44,6 +44,17 @@ Window { infoPopup.open() } + function changeLayout(layoutIndex) { + if (layoutIndex == 0) { + console.log("TODO : set mosaic layout") + } else if (layoutIndex == 1) { + console.log("TODO : set pip layout") + } else { + console.log("TODO : set audio layout") + } + console.log("+ change settings default layout") + } + Connections { enabled: call != undefined && call != null target: call && call.core @@ -435,19 +446,68 @@ Window { } } } + Component { + id: changeLayoutPanel + ColumnLayout { + Control.StackView.onActivated: rightPanel.headerTitleText = qsTr("Modifier la disposition") + spacing: 12 * DefaultStyle.dp + Text { + Layout.fillWidth: true + text: qsTr("La disposition choisie sera enregistrée pour vos prochaines réunions") + font.pixelSize: 14 * DefaultStyle.dp + } + RoundedBackgroundControl { + Layout.fillWidth: true + contentItem: ColumnLayout { + Repeater { + model: [ + {text: qsTr("Mosaïque"), imgUrl: AppIcons.squaresFour}, + {text: qsTr("Intervenant actif"), imgUrl: AppIcons.pip}, + {text: qsTr("Audio seulement"), imgUrl: AppIcons.waveform} + ] + RadioButton { + id: radiobutton + color: DefaultStyle.main1_500_main + indicatorSize: 20 * DefaultStyle.dp + leftPadding: indicator.width + spacing + spacing: 8 * DefaultStyle.dp + Component.onCompleted: { + console.log("TODO : set checked true if is current layout") + if (index == 0) checked = true + } + contentItem: RowLayout { + spacing: 5 * DefaultStyle.dp + EffectImage { + id: radioButtonImg + Layout.preferredWidth: 32 * DefaultStyle.dp + Layout.preferredHeight: 32 * DefaultStyle.dp + imageSource: modelData.imgUrl + colorizationColor: DefaultStyle.main2_500main + } + Text { + text: modelData.text + color: DefaultStyle.main2_500main + verticalAlignment: Text.AlignVCenter + font.pixelSize: 14 * DefaultStyle.dp + Layout.fillWidth: true + } + } + onCheckedChanged: if (checked) mainWindow.changeLayout(index) + } + } + } + } + Item {Layout.fillHeight: true} + } + } Component { id: callsListPanel ColumnLayout { Control.StackView.onActivated: rightPanel.headerTitleText = qsTr("Liste d'appel") RoundedBackgroundControl { Layout.fillWidth: true - Layout.preferredHeight: Math.min(callList.implicitHeight + topPadding + bottomPadding, rightPanel.height) - - topPadding: 15 * DefaultStyle.dp - bottomPadding: 15 * DefaultStyle.dp - leftPadding: 15 * DefaultStyle.dp - rightPadding: 15 * DefaultStyle.dp - backgroundColor: mainWindow.conference ? DefaultStyle.grey_0 : DefaultStyle.main2_0 + Layout.maximumHeight: rightPanel.height + visible: callList.contentHeight > 0 contentItem: ListView { id: callList @@ -498,8 +558,8 @@ Window { Layout.alignment: Qt.AlignRight popup.contentItem: ColumnLayout { - spacing: 0 - Control.Button { + // spacing: 0 + Button { background: Item {} contentItem: RowLayout { Image { @@ -529,7 +589,7 @@ Window { } onClicked: modelData.core.lSetPaused(!modelData.core.paused) } - Control.Button { + Button { background: Item {} contentItem: RowLayout { EffectImage { @@ -738,6 +798,8 @@ Window { icon.source: AppIcons.endCall icon.width: 32 * DefaultStyle.dp icon.height: 32 * DefaultStyle.dp + Layout.preferredWidth: 75 * DefaultStyle.dp + Layout.preferredHeight: 55 * DefaultStyle.dp contentImageColor: DefaultStyle.grey_0 checkable: false Layout.column: mainWindow.callState == LinphoneEnums.CallState.OutgoingInit @@ -746,8 +808,6 @@ Window { || mainWindow.callState == LinphoneEnums.CallState.OutgoingEarlyMedia || mainWindow.callState == LinphoneEnums.CallState.IncomingReceived ? 0 : bottomButtonsLayout.columns - 1 - Layout.preferredWidth: 75 * DefaultStyle.dp - Layout.preferredHeight: 55 * DefaultStyle.dp background: Rectangle { anchors.fill: parent color: DefaultStyle.danger_500main @@ -767,6 +827,8 @@ Window { id: pauseButton Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp background: Rectangle { anchors.fill: parent radius: 71 * DefaultStyle.dp @@ -790,9 +852,9 @@ Window { icon.source: AppIcons.transferCall Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp contentImageColor: enabled ? DefaultStyle.grey_0 : DefaultStyle.grey_500 - onEnabledChanged: console.log("===================enable change", enabled) - onContentImageColorChanged: console.log("===================================== content image color", contentImageColor) onCheckedChanged: { if (checked) { rightPanel.visible = true @@ -812,6 +874,8 @@ Window { icon.source: AppIcons.newCall Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onClicked: { var mainWin = UtilsCpp.getMainWindow() UtilsCpp.smartShowWindow(mainWin) @@ -835,6 +899,8 @@ Window { checked: mainWindow.call && !mainWindow.call.core.cameraEnabled Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onCheckedChanged: mainWindow.call.core.lSetCameraEnabled(!mainWindow.call.core.cameraEnabled) } CheckableButton { @@ -843,6 +909,8 @@ Window { checked: mainWindow.call && mainWindow.call.core.microphoneMuted Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onCheckedChanged: mainWindow.call.core.lSetMicrophoneMuted(!mainWindow.call.core.microphoneMuted) } CheckableButton { @@ -852,6 +920,8 @@ Window { checkedColor: DefaultStyle.main2_400 Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onCheckedChanged: { if (checked) { rightPanel.visible = true @@ -867,14 +937,12 @@ Window { Layout.preferredHeight: 55 * DefaultStyle.dp onEnabledChanged: console.log("========== enabled changed", enabled) contentImageColor: enabled && !checked ? DefaultStyle.grey_0 : DefaultStyle.grey_500 - icon.width: 24 * DefaultStyle.dp - icon.height: 24 * DefaultStyle.dp icon.source: AppIcons.more background: Rectangle { anchors.fill: moreOptionsButton color: moreOptionsButton.enabled ? moreOptionsButton.checked - ? DefaultStyle.grey_0 + ? DefaultStyle.main2_400 : DefaultStyle.grey_500 : DefaultStyle.grey_600 radius: 40 * DefaultStyle.dp @@ -887,90 +955,81 @@ Window { moreOptionsButton.popup.y = - moreOptionsButton.popup.height + moreOptionsButton.height/4 } } + component MenuButton: Button { + background: Item{} + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp + textColor: down ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main + contentImageColor: down ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main + textSize: 14 * DefaultStyle.dp + textWeight: 400 * DefaultStyle.dp + spacing: 5 * DefaultStyle.dp + } popup.contentItem: ColumnLayout { id: optionsList - spacing: 10 * DefaultStyle.dp - - Button { - id: callListButton + spacing: 5 * DefaultStyle.dp + + MenuButton { + visible: mainWindow.conference Layout.fillWidth: true - background: Item {} - contentItem: RowLayout { - Image { - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - fillMode: Image.PreserveAspectFit - source: AppIcons.callList - } - Text { - text: qsTr("Liste d'appel") - } + icon.source: AppIcons.squaresFour + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp + text: qsTr("Modifier la disposition") + onClicked: { + rightPanel.visible = true + rightPanel.replace(changeLayoutPanel) + moreOptionsButton.close() } + } + MenuButton { + icon.source: AppIcons.callList + Layout.fillWidth: true + text: qsTr("Liste d'appel") onClicked: { rightPanel.visible = true rightPanel.replace(callsListPanel) moreOptionsButton.close() } } - Button { - id: dialerButton + MenuButton { + icon.source: AppIcons.dialer + text: qsTr("Dialer") Layout.fillWidth: true - background: Item {} - contentItem: RowLayout { - Image { - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - fillMode: Image.PreserveAspectFit - source: AppIcons.dialer - } - Text { - text: qsTr("Dialer") - } - } onClicked: { rightPanel.visible = true rightPanel.replace(dialerPanel) moreOptionsButton.close() } } - Button { - id: recordButton - Layout.fillWidth: true - enabled: mainWindow.call && mainWindow.call.core.recordable + MenuButton { checkable: true - background: Item {} - contentItem: RowLayout { - EffectImage { - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - fillMode: Image.PreserveAspectFit - imageSource: AppIcons.recordFill - colorizationColor: mainWindow.call && mainWindow.call.core.recording ? DefaultStyle.danger_500main : undefined - } - Text { - color: mainWindow.call && mainWindow.call.core.recording ? DefaultStyle.danger_500main : DefaultStyle.main2_600 - text: mainWindow.call && mainWindow.call.core.recording ? qsTr("Terminer l'enregistrement") : qsTr("Enregistrer l'appel") - } - - } - onClicked: { - mainWindow.call && mainWindow.call.core.recording ? mainWindow.call.core.lStopRecording() : mainWindow.call.core.lStartRecording() + enabled: mainWindow.call && mainWindow.call.core.recordable + icon.source: AppIcons.recordFill + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp + contentImageColor: down + ? DefaultStyle.main1_500_main + :mainWindow.call && mainWindow.call.core.recording + ? DefaultStyle.danger_500main + : DefaultStyle.main2_500main + text: mainWindow.call && mainWindow.call.core.recording ? qsTr("Terminer l'enregistrement") : qsTr("Enregistrer l'appel") + textColor: down + ? DefaultStyle.main1_500_main + :mainWindow.call && mainWindow.call.core.recording + ? DefaultStyle.danger_500main + : DefaultStyle.main2_500main + Layout.fillWidth: true + onCheckedChanged: { + if (mainWindow.call) + if (mainWindow.call.core.recording) mainWindow.call.core.lStopRecording() + else mainWindow.call.core.lStartRecording() } } - Button { - id: settingsButton + MenuButton { Layout.fillWidth: true - background: Item{} - contentItem: RowLayout { - Image { - Layout.preferredWidth: 24 * DefaultStyle.dp - Layout.preferredHeight: 24 * DefaultStyle.dp - source: AppIcons.settings - } - Text { - text: qsTr("Paramètres") - } - } + icon.source: AppIcons.settings + text: qsTr("Paramètres") onClicked: { rightPanel.visible = true rightPanel.replace(settingsPanel) diff --git a/Linphone/view/App/Main.qml b/Linphone/view/App/Main.qml index 6fe1c971c..9c6db9c3e 100644 --- a/Linphone/view/App/Main.qml +++ b/Linphone/view/App/Main.qml @@ -107,6 +107,8 @@ ApplicationWindow { Button { Layout.preferredWidth: 20 * DefaultStyle.dp Layout.preferredHeight: 20 * DefaultStyle.dp + icon.width: 20 * DefaultStyle.dp + icon.height: 20 * DefaultStyle.dp Layout.alignment: Qt.AlignTop | Qt.AlignRight visible: informationPopup.hovered || hovered background: Item{} diff --git a/Linphone/view/CMakeLists.txt b/Linphone/view/CMakeLists.txt index 9dd8cbfa0..1591be80d 100644 --- a/Linphone/view/CMakeLists.txt +++ b/Linphone/view/CMakeLists.txt @@ -62,6 +62,7 @@ list(APPEND _LINPHONEAPP_QML_FILES view/Item/PhoneNumberInput.qml view/Item/Popup.qml view/Item/PopupButton.qml + view/Item/SecurityRadioButton.qml view/Item/RadioButton.qml view/Item/RectangleTest.qml view/Item/RoundedBackgroundControl.qml diff --git a/Linphone/view/Item/Button.qml b/Linphone/view/Item/Button.qml index 0bdf65c64..e9d150a4a 100644 --- a/Linphone/view/Item/Button.qml +++ b/Linphone/view/Item/Button.qml @@ -18,8 +18,6 @@ Control.Button { property bool shadowEnabled: false property var contentImageColor hoverEnabled: true - icon.width: width - icon.height: height // leftPadding: 20 * DefaultStyle.dp // rightPadding: 20 * DefaultStyle.dp @@ -105,12 +103,18 @@ Control.Button { width: mainItem.width RowLayout { - spacing: 10 * DefaultStyle.dp - ButtonImage{} + spacing: mainItem.spacing + ButtonImage{ + Layout.preferredWidth: mainItem.icon.width + Layout.preferredHeight: mainItem.icon.height + } ButtonText{} } ButtonText {} - ButtonImage{} + ButtonImage{ + Layout.preferredWidth: mainItem.icon.width + Layout.preferredHeight: mainItem.icon.height + } Item { Layout.fillWidth : true Layout.fillHeight : true diff --git a/Linphone/view/Item/Calendar.qml b/Linphone/view/Item/Calendar.qml index 95a35b35b..90d88bca5 100644 --- a/Linphone/view/Item/Calendar.qml +++ b/Linphone/view/Item/Calendar.qml @@ -45,8 +45,10 @@ ListView { Layout.fillWidth: true } Button { - Layout.preferredWidth: 10 * DefaultStyle.dp + Layout.preferredWidth: 20 * DefaultStyle.dp Layout.preferredHeight: 20 * DefaultStyle.dp + icon.width: width + icon.height: height background: Item{} icon.source: AppIcons.leftArrow onClicked: if (mainItem.currentIndex > 0) --mainItem.currentIndex @@ -54,6 +56,8 @@ ListView { Button { Layout.preferredWidth: 20 * DefaultStyle.dp Layout.preferredHeight: 20 * DefaultStyle.dp + icon.width: width + icon.height: height background: Item{} icon.source: AppIcons.rightArrow onClicked: if (mainItem.currentIndex < mainItem.count) ++mainItem.currentIndex diff --git a/Linphone/view/Item/Call/CallContactsLists.qml b/Linphone/view/Item/Call/CallContactsLists.qml index ce56525f8..e547f4b35 100644 --- a/Linphone/view/Item/Call/CallContactsLists.qml +++ b/Linphone/view/Item/Call/CallContactsLists.qml @@ -50,6 +50,8 @@ Item { icon.source:AppIcons.closeX width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp contentItem: Image { anchors.fill: parent source: AppIcons.closeX diff --git a/Linphone/view/Item/Call/InCallSettingsPanel.qml b/Linphone/view/Item/Call/InCallSettingsPanel.qml index 1b6c6998a..9a07649aa 100644 --- a/Linphone/view/Item/Call/InCallSettingsPanel.qml +++ b/Linphone/view/Item/Call/InCallSettingsPanel.qml @@ -21,7 +21,6 @@ ColumnLayout { Control.StackView.onActivated: { rightPanelTitle.text = qsTr("Paramètres") } - backgroundColor: DefaultStyle.main2_0 height: contentItem.implicitHeight + topPadding + bottomPadding Layout.fillWidth: true topPadding: 25 * DefaultStyle.dp diff --git a/Linphone/view/Item/Call/OngoingCallRightPanel.qml b/Linphone/view/Item/Call/OngoingCallRightPanel.qml index 861953bcf..5413e474f 100644 --- a/Linphone/view/Item/Call/OngoingCallRightPanel.qml +++ b/Linphone/view/Item/Call/OngoingCallRightPanel.qml @@ -17,7 +17,9 @@ Control.Page { signal validateRequested() topPadding: 16 * DefaultStyle.dp - leftPadding: 16 * DefaultStyle.dp + bottomPadding: 16 * DefaultStyle.dp + leftPadding: 17 * DefaultStyle.dp + rightPadding: 17 * DefaultStyle.dp background: Rectangle { width: mainItem.width diff --git a/Linphone/view/Item/Call/WaitingRoom.qml b/Linphone/view/Item/Call/WaitingRoom.qml index 691334c84..ef69bd2d9 100644 --- a/Linphone/view/Item/Call/WaitingRoom.qml +++ b/Linphone/view/Item/Call/WaitingRoom.qml @@ -41,6 +41,8 @@ RowLayout { contentImageColor: DefaultStyle.main2_0 Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onCheckedChanged: mainItem.cameraEnabled = !mainItem.cameraEnabled } CheckableButton { @@ -51,6 +53,8 @@ RowLayout { contentImageColor: DefaultStyle.main2_0 Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp onCheckedChanged: mainItem.microEnabled = !mainItem.microEnabled } CheckableButton { @@ -62,6 +66,8 @@ RowLayout { contentImageColor: checked ? DefaultStyle.grey_500 : DefaultStyle.grey_0 Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp } CheckableButton { id: speakerButton @@ -72,6 +78,8 @@ RowLayout { contentImageColor: checked ? DefaultStyle.grey_500 : DefaultStyle.grey_0 Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp + icon.width: 32 * DefaultStyle.dp + icon.height: 32 * DefaultStyle.dp } } } diff --git a/Linphone/view/Item/Contact/ContactEdition.qml b/Linphone/view/Item/Contact/ContactEdition.qml index 2e8b20b2d..98b2e9e4d 100644 --- a/Linphone/view/Item/Contact/ContactEdition.qml +++ b/Linphone/view/Item/Contact/ContactEdition.qml @@ -36,6 +36,8 @@ ColumnLayout { width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp icon.source: AppIcons.closeX + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: { // contact.core.pictureUri = mainItem.oldPictureUri mainItem.contact.core.undo() @@ -166,6 +168,8 @@ ColumnLayout { icon.source: AppIcons.closeX width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: mainItem.contact.core.removeAddress(index) } } @@ -209,6 +213,8 @@ ColumnLayout { icon.source: AppIcons.closeX width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: mainItem.contact.core.removePhoneNumber(index) } } diff --git a/Linphone/view/Item/EffectImage.qml b/Linphone/view/Item/EffectImage.qml index 5578ec342..ae5d18423 100644 --- a/Linphone/view/Item/EffectImage.qml +++ b/Linphone/view/Item/EffectImage.qml @@ -26,6 +26,8 @@ Loader { sourceSize.height: height width: mainItem.imageWidth height: mainItem.imageHeight + Layout.preferredWidth: mainItem.imageWidth + Layout.preferredHeight: mainItem.imageHeight anchors.centerIn: parent } MultiEffect { diff --git a/Linphone/view/Item/Meeting/MeetingSetUp.qml b/Linphone/view/Item/Meeting/MeetingSetUp.qml index 63e917226..8aff18773 100644 --- a/Linphone/view/Item/Meeting/MeetingSetUp.qml +++ b/Linphone/view/Item/Meeting/MeetingSetUp.qml @@ -37,6 +37,8 @@ ColumnLayout { icon.source: AppIcons.leftArrow Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: mainItem.returnRequested() } TextInput { @@ -118,6 +120,8 @@ ColumnLayout { CheckableButton { Layout.preferredWidth: 151 * DefaultStyle.dp icon.source: AppIcons.usersThree + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp enabled: false text: qsTr("Réunion") checked: true @@ -126,6 +130,8 @@ ColumnLayout { Layout.preferredWidth: 151 * DefaultStyle.dp enabled: false icon.source: AppIcons.slide + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp text: qsTr("Broadcast") } } @@ -477,6 +483,8 @@ ColumnLayout { Button { Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp Layout.rightMargin: 10 * DefaultStyle.dp background: Item{} icon.source: AppIcons.closeX diff --git a/Linphone/view/Item/NumericPad.qml b/Linphone/view/Item/NumericPad.qml index d29466fbc..8fba145c0 100644 --- a/Linphone/view/Item/NumericPad.qml +++ b/Linphone/view/Item/NumericPad.qml @@ -54,6 +54,8 @@ Control.Popup { icon.source: AppIcons.closeX width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: mainItem.close() } } diff --git a/Linphone/view/Item/PopupButton.qml b/Linphone/view/Item/PopupButton.qml index 64f28afce..7a4086f34 100644 --- a/Linphone/view/Item/PopupButton.qml +++ b/Linphone/view/Item/PopupButton.qml @@ -17,8 +17,8 @@ Button { topPadding: 0 bottomPadding: 0 icon.source: AppIcons.more - icon.width: width - icon.height: height + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp function close() { popup.close() } @@ -44,6 +44,7 @@ Button { x: - width y: mainItem.height closePolicy: Popup.CloseOnPressOutsideParent | Popup.CloseOnPressOutside + padding: 10 * DefaultStyle.dp parent: mainItem // Explicit define for coordinates references. onAboutToShow: { @@ -57,8 +58,6 @@ Button { } } - padding: 20 * DefaultStyle.dp - background: Item { anchors.fill: parent Rectangle { diff --git a/Linphone/view/Item/RadioButton.qml b/Linphone/view/Item/RadioButton.qml index 250d9e8c0..66a39da2c 100644 --- a/Linphone/view/Item/RadioButton.qml +++ b/Linphone/view/Item/RadioButton.qml @@ -10,6 +10,7 @@ Control.RadioButton { property string imgUrl property color color hoverEnabled: true + property int indicatorSize: 16 * DefaultStyle.dp MouseArea { anchors.fill: parent @@ -18,82 +19,23 @@ Control.RadioButton { onClicked: if (!mainItem.checked) mainItem.toggle() } - background: Rectangle { - color: DefaultStyle.grey_100 - border.color: mainItem.checked ? mainItem.color : "transparent" - radius: 20 * DefaultStyle.dp - } + indicator: Rectangle { + implicitWidth: mainItem.indicatorSize + implicitHeight: mainItem.indicatorSize + radius: implicitWidth/2 + color: "transparent" + border.color: mainItem.color + border.width: 2 * DefaultStyle.dp + anchors.verticalCenter: mainItem.verticalCenter - indicator: RowLayout { - anchors.left: parent.left - anchors.leftMargin: 13 * DefaultStyle.dp - anchors.top: parent.top - anchors.topMargin: 8 * DefaultStyle.dp - spacing: 4 * DefaultStyle.dp Rectangle { - implicitWidth: 16 * DefaultStyle.dp - implicitHeight: 16 * DefaultStyle.dp - radius: implicitWidth/2 - border.color: mainItem.color - - Rectangle { - width: parent.width/2 - height: parent.height/2 - x: parent.width/4 - y: parent.width/4 - radius: width/2 - color: mainItem.color - visible: mainItem.checked - } - } - Text { - text: mainItem.title - font.bold: true - color: DefaultStyle.grey_900 - font.pixelSize: 16 * DefaultStyle.dp - } - Button { - padding: 0 - background: Item { - visible: false - } - icon.source: AppIcons.info - Layout.preferredWidth: 2 * DefaultStyle.dp - Layout.preferredHeight: 2 * DefaultStyle.dp - width: 2 * DefaultStyle.dp - height: 2 * DefaultStyle.dp - } - } - - contentItem: ColumnLayout { - anchors.top: indicator.bottom - anchors.bottom: parent.bottom - anchors.left: parent.left - anchors.right: parent.right - anchors.leftMargin: 13 * DefaultStyle.dp - RowLayout { - Layout.fillWidth: true - Layout.fillHeight: true - Layout.bottomMargin: 10 * DefaultStyle.dp - Layout.rightMargin: 10 * DefaultStyle.dp - Layout.alignment: Qt.AlignVCenter - Text { - id: innerText - verticalAlignment: Text.AlignVCenter - Layout.preferredWidth: 220 * DefaultStyle.dp - Layout.preferredHeight: 100 * DefaultStyle.dp - font.pixelSize: 14 * DefaultStyle.dp - text: mainItem.contentText - Layout.fillHeight: true - } - Image { - id: image - Layout.fillHeight: true - Layout.preferredWidth: 100 * DefaultStyle.dp - Layout.preferredHeight: 100 * DefaultStyle.dp - fillMode: Image.PreserveAspectFit - source: mainItem.imgUrl - } + width: parent.width/2 + height: parent.height/2 + x: parent.width/4 + y: parent.width/4 + radius: width/2 + color: mainItem.color + visible: mainItem.checked } } } diff --git a/Linphone/view/Item/RoundedBackgroundControl.qml b/Linphone/view/Item/RoundedBackgroundControl.qml index a4810465c..ed9d684e7 100644 --- a/Linphone/view/Item/RoundedBackgroundControl.qml +++ b/Linphone/view/Item/RoundedBackgroundControl.qml @@ -11,9 +11,5 @@ Control.Control { anchors.fill: parent radius: 15 * DefaultStyle.dp color: mainItem.backgroundColor - anchors.leftMargin: 10 * DefaultStyle.dp - anchors.rightMargin: 10 * DefaultStyle.dp - anchors.topMargin: 10 * DefaultStyle.dp - anchors.bottomMargin: 10 * DefaultStyle.dp } } \ No newline at end of file diff --git a/Linphone/view/Item/SearchBar.qml b/Linphone/view/Item/SearchBar.qml index 2df085c49..bf0ea0572 100644 --- a/Linphone/view/Item/SearchBar.qml +++ b/Linphone/view/Item/SearchBar.qml @@ -82,6 +82,8 @@ Rectangle { icon.source: dialerButton.checked ? AppIcons.dialerSelected : AppIcons.dialer width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right anchors.rightMargin: 15 * DefaultStyle.dp @@ -99,6 +101,8 @@ Rectangle { width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp icon.source: AppIcons.closeX + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp anchors.top: parent.top anchors.bottom: parent.bottom anchors.right: parent.right diff --git a/Linphone/view/Item/SecurityRadioButton.qml b/Linphone/view/Item/SecurityRadioButton.qml new file mode 100644 index 000000000..37dde784f --- /dev/null +++ b/Linphone/view/Item/SecurityRadioButton.qml @@ -0,0 +1,102 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.2 as Control +import QtQuick.Layouts +import Linphone + +Control.RadioButton { + id: mainItem + property string title + property string contentText + property string imgUrl + property color color + hoverEnabled: true + + MouseArea { + anchors.fill: parent + hoverEnabled: false + cursorShape: mainItem.hovered ? Qt.PointingHandCursor : Qt.ArrowCursor + onClicked: if (!mainItem.checked) mainItem.toggle() + } + + background: Rectangle { + color: DefaultStyle.grey_100 + border.color: mainItem.checked ? mainItem.color : "transparent" + radius: 20 * DefaultStyle.dp + } + + indicator: RowLayout { + anchors.left: parent.left + anchors.leftMargin: 13 * DefaultStyle.dp + anchors.top: parent.top + anchors.topMargin: 8 * DefaultStyle.dp + spacing: 4 * DefaultStyle.dp + Rectangle { + implicitWidth: 16 * DefaultStyle.dp + implicitHeight: 16 * DefaultStyle.dp + radius: implicitWidth/2 + border.color: mainItem.color + + Rectangle { + width: parent.width/2 + height: parent.height/2 + x: parent.width/4 + y: parent.width/4 + radius: width/2 + color: mainItem.color + visible: mainItem.checked + } + } + Text { + visible: mainItem.title.length > 0 + text: mainItem.title + font.bold: true + color: DefaultStyle.grey_900 + font.pixelSize: 16 * DefaultStyle.dp + } + Button { + padding: 0 + background: Item { + visible: false + } + icon.source: AppIcons.info + Layout.preferredWidth: 2 * DefaultStyle.dp + Layout.preferredHeight: 2 * DefaultStyle.dp + width: 2 * DefaultStyle.dp + height: 2 * DefaultStyle.dp + icon.width: 2 * DefaultStyle.dp + icon.height: 2 * DefaultStyle.dp + } + } + + contentItem: ColumnLayout { + anchors.top: indicator.bottom + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 13 * DefaultStyle.dp + RowLayout { + Layout.fillWidth: true + Layout.fillHeight: true + Layout.bottomMargin: 10 * DefaultStyle.dp + Layout.rightMargin: 10 * DefaultStyle.dp + Layout.alignment: Qt.AlignVCenter + Text { + id: innerText + verticalAlignment: Text.AlignVCenter + Layout.preferredWidth: 220 * DefaultStyle.dp + Layout.preferredHeight: 100 * DefaultStyle.dp + font.pixelSize: 14 * DefaultStyle.dp + text: mainItem.contentText + Layout.fillHeight: true + } + Image { + id: image + Layout.fillHeight: true + Layout.preferredWidth: 100 * DefaultStyle.dp + Layout.preferredHeight: 100 * DefaultStyle.dp + fillMode: Image.PreserveAspectFit + source: mainItem.imgUrl + } + } + } +} diff --git a/Linphone/view/Item/TextField.qml b/Linphone/view/Item/TextField.qml index 4ca91c784..5218ecaa0 100644 --- a/Linphone/view/Item/TextField.qml +++ b/Linphone/view/Item/TextField.qml @@ -106,6 +106,8 @@ Control.TextField { icon.source: eyeButton.checked ? AppIcons.eyeShow : AppIcons.eyeHide width: 20 * DefaultStyle.dp height: 20 * DefaultStyle.dp + icon.width: 20 * DefaultStyle.dp + icon.height: 20 * DefaultStyle.dp anchors.top: parent.top anchors.bottom: parent.bottom anchors.right: parent.right diff --git a/Linphone/view/Layout/Meeting/AddParticipantsLayout.qml b/Linphone/view/Layout/Meeting/AddParticipantsLayout.qml index 02477d448..2e0dde16f 100644 --- a/Linphone/view/Layout/Meeting/AddParticipantsLayout.qml +++ b/Linphone/view/Layout/Meeting/AddParticipantsLayout.qml @@ -31,6 +31,8 @@ ColumnLayout { contentImageColor: DefaultStyle.main1_500_main Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: mainItem.returnRequested() } Text { @@ -91,6 +93,8 @@ ColumnLayout { Layout.preferredHeight: 24 * DefaultStyle.dp background: Item{} icon.source: AppIcons.closeX + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp contentImageColor: DefaultStyle.main1_500_main onClicked: contactList.selectedContacts.splice(index, 1) } diff --git a/Linphone/view/Page/Login/LoginPage.qml b/Linphone/view/Page/Login/LoginPage.qml index ecc42c63b..466008ef0 100644 --- a/Linphone/view/Page/Login/LoginPage.qml +++ b/Linphone/view/Page/Login/LoginPage.qml @@ -18,6 +18,8 @@ LoginLayout { Layout.preferredHeight: 27 * DefaultStyle.dp Layout.preferredWidth: 27 * DefaultStyle.dp icon.source: AppIcons.leftArrow + icon.width: 27 * DefaultStyle.dp + icon.height: 27 * DefaultStyle.dp background: Rectangle { color: "transparent" } diff --git a/Linphone/view/Page/Login/RegisterCheckingPage.qml b/Linphone/view/Page/Login/RegisterCheckingPage.qml index a79b12c20..128e49220 100644 --- a/Linphone/view/Page/Login/RegisterCheckingPage.qml +++ b/Linphone/view/Page/Login/RegisterCheckingPage.qml @@ -14,6 +14,8 @@ LoginLayout { Layout.preferredHeight: 24 * DefaultStyle.dp Layout.preferredWidth: 24 * DefaultStyle.dp icon.source: AppIcons.leftArrow + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp background: Rectangle { color: "transparent" } diff --git a/Linphone/view/Page/Login/SIPLoginPage.qml b/Linphone/view/Page/Login/SIPLoginPage.qml index c22d73c10..e4b72451c 100644 --- a/Linphone/view/Page/Login/SIPLoginPage.qml +++ b/Linphone/view/Page/Login/SIPLoginPage.qml @@ -15,8 +15,8 @@ LoginLayout { Layout.preferredHeight: 24 * DefaultStyle.dp Layout.preferredWidth: 24 * DefaultStyle.dp icon.source: AppIcons.leftArrow - width: 24 * DefaultStyle.dp - height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp background: Item { anchors.fill: parent } diff --git a/Linphone/view/Page/Login/SecurityModePage.qml b/Linphone/view/Page/Login/SecurityModePage.qml index 8f54c835b..dacfe128f 100644 --- a/Linphone/view/Page/Login/SecurityModePage.qml +++ b/Linphone/view/Page/Login/SecurityModePage.qml @@ -45,7 +45,7 @@ LoginLayout { {checked: true, title: qsTr("Chiffrement de bout en bout"), text: qsTr("Ce mode vous garanti la confidentialité de tous vos échanges. Notre technologie de chiffrement de bout en bout assure un niveau de sécurité maximal pour tous vos échanges."), imgUrl: AppIcons.chiffrement, color: DefaultStyle.info_500_main}, {checked: false, title: qsTr("Interoperable"), text: qsTr("Ce mode vous permet de profiter de toute les fonctionnalités de Linphone, toute en restant interopérable avec n’importe qu’elle autre service SIP."), imgUrl: AppIcons.interoperable, color: DefaultStyle.main1_500_main} ] - RadioButton { + SecurityRadioButton { title: modelData.title contentText: modelData.text imgUrl: modelData.imgUrl diff --git a/Linphone/view/Page/Main/CallPage.qml b/Linphone/view/Page/Main/CallPage.qml index a9a56209f..f351842a4 100644 --- a/Linphone/view/Page/Main/CallPage.qml +++ b/Linphone/view/Page/Main/CallPage.qml @@ -118,6 +118,8 @@ AbstractMainPage { icon.source: AppIcons.newCall Layout.preferredWidth: 28 * DefaultStyle.dp Layout.preferredHeight: 28 * DefaultStyle.dp + icon.width: 28 * DefaultStyle.dp + icon.height: 28 * DefaultStyle.dp onClicked: { console.debug("[CallPage]User: create new call") listStackView.push(newCallItem) @@ -265,6 +267,8 @@ AbstractMainPage { icon.source: AppIcons.phone Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: { var addr = UtilsCpp.generateLinphoneSipAddress(modelData.core.remoteAddress) callObj = UtilsCpp.createCall(addr) @@ -333,6 +337,8 @@ AbstractMainPage { Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp icon.source: AppIcons.leftArrow + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: { console.debug("[CallPage]User: return to call history") listStackView.pop() diff --git a/Linphone/view/Page/Main/ContactPage.qml b/Linphone/view/Page/Main/ContactPage.qml index e8d826bdc..7e941074d 100644 --- a/Linphone/view/Page/Main/ContactPage.qml +++ b/Linphone/view/Page/Main/ContactPage.qml @@ -84,8 +84,8 @@ AbstractMainPage { icon.source: AppIcons.plusCircle Layout.preferredWidth: 30 * DefaultStyle.dp Layout.preferredHeight: 30 * DefaultStyle.dp - width: 30 * DefaultStyle.dp - height: 30 * DefaultStyle.dp + icon.width: 30 * DefaultStyle.dp + icon.height: 30 * DefaultStyle.dp onClicked: { mainItem.createContact("", "") } @@ -161,6 +161,8 @@ AbstractMainPage { icon.source: favoriteList.visible ? AppIcons.upArrow : AppIcons.downArrow Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: favoriteList.visible = !favoriteList.visible } } @@ -203,6 +205,8 @@ AbstractMainPage { icon.source: contactList.visible ? AppIcons.upArrow : AppIcons.downArrow Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: contactList.visible = !contactList.visible } } @@ -253,6 +257,8 @@ AbstractMainPage { buttonContent: Button { width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp background: Item{} onClicked: mainItem.editContact(mainItem.selectedContact) icon.source: AppIcons.pencil @@ -326,6 +332,8 @@ AbstractMainPage { icon.source: AppIcons.phone width: 24 * DefaultStyle.dp height: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: { callObj = UtilsCpp.createCall(modelData.address) } diff --git a/Linphone/view/Page/Main/MeetingPage.qml b/Linphone/view/Page/Main/MeetingPage.qml index b3d7bd306..8d86df8e7 100644 --- a/Linphone/view/Page/Main/MeetingPage.qml +++ b/Linphone/view/Page/Main/MeetingPage.qml @@ -16,15 +16,13 @@ AbstractMainPage { property ConferenceInfoGui selectedConference property int meetingListCount signal newConfCreated() - onVisibleChanged: if (visible) rightPanelStackView.push(overridenRightPanel, Control.StackView.Immediate) + Component.onCompleted: rightPanelStackView.push(overridenRightPanel, Control.StackView.Immediate) onSelectedConferenceChanged: { overridenRightPanelStackView.clear() if (selectedConference) { if (!overridenRightPanelStackView.currentItem || overridenRightPanelStackView.currentItem.objectName != "meetingDetail") overridenRightPanelStackView.replace(meetingDetail, Control.StackView.Immediate) - }// else { - /*if (overridenRightPanelStackView.currentItem && overridenRightPanelStackView.currentItem.objectName === "meetingDetail")*/ - // } + } } Connections { @@ -128,8 +126,8 @@ AbstractMainPage { icon.source: AppIcons.plusCircle Layout.preferredWidth: 30 * DefaultStyle.dp Layout.preferredHeight: 30 * DefaultStyle.dp - width: 30 * DefaultStyle.dp - height: 30 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp onClicked: { mainItem.setUpConference() } @@ -298,6 +296,8 @@ AbstractMainPage { visible: mainItem.selectedConference && UtilsCpp.isMe(mainItem.selectedConference.core.organizerAddress) Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp icon.source: AppIcons.pencil contentImageColor: DefaultStyle.main1_500_main background: Item{} @@ -379,6 +379,8 @@ AbstractMainPage { Button { Layout.preferredWidth: 24 * DefaultStyle.dp Layout.preferredHeight: 24 * DefaultStyle.dp + icon.width: 24 * DefaultStyle.dp + icon.height: 24 * DefaultStyle.dp background: Item{} icon.source: AppIcons.shareNetwork onClicked: { diff --git a/Linphone/view/Style/AppIcons.qml b/Linphone/view/Style/AppIcons.qml index 26eadae8b..b168e2db8 100644 --- a/Linphone/view/Style/AppIcons.qml +++ b/Linphone/view/Style/AppIcons.qml @@ -81,5 +81,7 @@ QtObject { property string globe: "image://internal/globe-hemisphere-west.svg" property string slide: "image://internal/slideshow.svg" property string busyIndicator: "image://internal/busy-indicator.svg" - property string meeting: "image://internal/reunion.svg" + property string pip: "image://internal/pip.svg" + property string waveform: "image://internal/waveform.svg" + property string squaresFour: "image://internal/squares-four.svg" }