From 5a3903dceb0ce71b1d7db06acb3ae3d28f96aaf6 Mon Sep 17 00:00:00 2001 From: Ronan Abhamon Date: Tue, 16 May 2017 12:07:07 +0200 Subject: [PATCH] feat(ui/views/App/Calls/Incall): use `Popup` in `CallStatistics` --- .../ui/modules/Common/Popup/Popup.qml | 29 ++-- linphone-desktop/ui/modules/Common/qmldir | 1 - .../modules/Linphone/Calls/CallStatistics.qml | 153 +++++++++--------- .../ui/modules/Linphone/Calls/Calls.qml | 1 - linphone-desktop/ui/modules/Linphone/qmldir | 2 + linphone-desktop/ui/views/App/Calls/Incall.js | 2 +- .../ui/views/App/Calls/Incall.qml | 3 +- 7 files changed, 94 insertions(+), 97 deletions(-) diff --git a/linphone-desktop/ui/modules/Common/Popup/Popup.qml b/linphone-desktop/ui/modules/Common/Popup/Popup.qml index da00b7691..68e81a22e 100644 --- a/linphone-desktop/ui/modules/Common/Popup/Popup.qml +++ b/linphone-desktop/ui/modules/Common/Popup/Popup.qml @@ -1,11 +1,14 @@ import QtQuick 2.7 import QtQuick.Controls 2.1 as Controls +import Common.Styles 1.0 import Utils 1.0 // ============================================================================= Item { + id: wrapper + // Optionnal parameters, set the position of popup relative to this item. property var relativeTo property int relativeX: 0 @@ -15,7 +18,7 @@ Item { // --------------------------------------------------------------------------- - visible: false + visible: false function show () { if (popup.visible) { @@ -56,25 +59,25 @@ Item { // --------------------------------------------------------------------------- - Controls.Popup { - id: popup + Controls.Popup { + id: popup - background: Rectangle { + height: wrapper._content.height + width: wrapper._content.width + + background: Rectangle { + color: PopupStyle.backgroundColor height: popup.height width: popup.width - layer { - enabled: true - effect: PopupShadow {} - } - } - - contentItem: Column { - id: internalData + layer { + enabled: true + effect: PopupShadow {} + } } padding: 0 Component.onCompleted: parent = Utils.getTopParent(this) - } + } } diff --git a/linphone-desktop/ui/modules/Common/qmldir b/linphone-desktop/ui/modules/Common/qmldir index 13851de6a..9cc2ee254 100644 --- a/linphone-desktop/ui/modules/Common/qmldir +++ b/linphone-desktop/ui/modules/Common/qmldir @@ -70,7 +70,6 @@ Collapse 1.0 Misc/Collapse.qml ForceScrollBar 1.0 Misc/ForceScrollBar.qml Paned 1.0 Misc/Paned.qml -AbstractDropDownMenu 1.0 Popup/AbstractDropDownMenu.qml DesktopPopup 1.0 Popup/DesktopPopup.qml DropDownDynamicMenu 1.0 Popup/DropDownDynamicMenu.qml Popup 1.0 Popup/Popup.qml diff --git a/linphone-desktop/ui/modules/Linphone/Calls/CallStatistics.qml b/linphone-desktop/ui/modules/Linphone/Calls/CallStatistics.qml index e628de3b4..c5e64da29 100644 --- a/linphone-desktop/ui/modules/Linphone/Calls/CallStatistics.qml +++ b/linphone-desktop/ui/modules/Linphone/Calls/CallStatistics.qml @@ -7,93 +7,17 @@ import Linphone.Styles 1.0 // ============================================================================= -AbstractDropDownMenu { +Popup { id: callStatistics property var call // --------------------------------------------------------------------------- - function _computeHeight () { - return CallStatisticsStyle.height - } - - // --------------------------------------------------------------------------- - - Component { - id: line - - RowLayout { - spacing: CallStatisticsStyle.spacing - width: parent.width - - // ----------------------------------------------------------------------- - - Text { - Layout.preferredWidth: CallStatisticsStyle.key.width - - color: CallStatisticsStyle.key.color - elide: Text.ElideRight - - font { - pointSize: CallStatisticsStyle.key.fontSize - bold: true - } - - horizontalAlignment: Text.AlignRight - verticalAlignment: Text.AlignVCenter - - text: modelData.key - } - - // ----------------------------------------------------------------------- - - Text { - Layout.fillWidth: true - - color: CallStatisticsStyle.value.color - elide: Text.ElideRight - font.pointSize: CallStatisticsStyle.value.fontSize - - text: modelData.value - } - } - } - - // --------------------------------------------------------------------------- - - Component { - id: media - - Column { - Text { - color: CallStatisticsStyle.title.color - - font { - bold: true - pointSize: CallStatisticsStyle.title.fontSize - } - - elide: Text.ElideRight - horizontalAlignment: Text.AlignHCenter - text: $label - - height: contentHeight + CallStatisticsStyle.title.bottomMargin - width: parent.width - } - - Repeater { - model: $data - delegate: line - } - } - } - - // --------------------------------------------------------------------------- - Rectangle { - anchors.fill: parent color: CallStatisticsStyle.color + height: CallStatisticsStyle.height + width: callStatistics.width Row { anchors { @@ -119,5 +43,76 @@ AbstractDropDownMenu { width: parent.width / 2 } } + + // ------------------------------------------------------------------------- + // Line. + // ------------------------------------------------------------------------- + + Component { + id: line + + RowLayout { + spacing: CallStatisticsStyle.spacing + width: parent.width + + Text { + Layout.preferredWidth: CallStatisticsStyle.key.width + + color: CallStatisticsStyle.key.color + elide: Text.ElideRight + + font { + pointSize: CallStatisticsStyle.key.fontSize + bold: true + } + + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + + text: modelData.key + } + + Text { + Layout.fillWidth: true + + color: CallStatisticsStyle.value.color + elide: Text.ElideRight + font.pointSize: CallStatisticsStyle.value.fontSize + + text: modelData.value + } + } + } + + // ------------------------------------------------------------------------- + // Media. + // ------------------------------------------------------------------------- + + Component { + id: media + + Column { + Text { + color: CallStatisticsStyle.title.color + + font { + bold: true + pointSize: CallStatisticsStyle.title.fontSize + } + + elide: Text.ElideRight + horizontalAlignment: Text.AlignHCenter + text: $label + + height: contentHeight + CallStatisticsStyle.title.bottomMargin + width: parent.width + } + + Repeater { + model: $data + delegate: line + } + } + } } } diff --git a/linphone-desktop/ui/modules/Linphone/Calls/Calls.qml b/linphone-desktop/ui/modules/Linphone/Calls/Calls.qml index b970dcbfa..30305b514 100644 --- a/linphone-desktop/ui/modules/Linphone/Calls/Calls.qml +++ b/linphone-desktop/ui/modules/Linphone/Calls/Calls.qml @@ -64,7 +64,6 @@ ListView { Popup { id: popup - implicitWidth: actionMenu.width relativeTo: callControls relativeX: callControls.width diff --git a/linphone-desktop/ui/modules/Linphone/qmldir b/linphone-desktop/ui/modules/Linphone/qmldir index 0aa297033..146f64034 100644 --- a/linphone-desktop/ui/modules/Linphone/qmldir +++ b/linphone-desktop/ui/modules/Linphone/qmldir @@ -31,3 +31,5 @@ SmartSearchBar 1.0 SmartSearchBar/SmartSearchBar.qml TelKeypad 1.0 TelKeypad/TelKeypad.qml Timeline 1.0 Timeline/Timeline.qml + +SipAddressesView 1.0 View/SipAddressesView.qml diff --git a/linphone-desktop/ui/views/App/Calls/Incall.js b/linphone-desktop/ui/views/App/Calls/Incall.js index 73ff4de4d..2a8e1b2f2 100644 --- a/linphone-desktop/ui/views/App/Calls/Incall.js +++ b/linphone-desktop/ui/views/App/Calls/Incall.js @@ -24,7 +24,7 @@ function handleStatusChanged (status) { } telKeypad.visible = false - callStatistics.hideMenu() + callStatistics.hide() } } diff --git a/linphone-desktop/ui/views/App/Calls/Incall.qml b/linphone-desktop/ui/views/App/Calls/Incall.qml index 0399fa298..a0cd5204d 100644 --- a/linphone-desktop/ui/views/App/Calls/Incall.qml +++ b/linphone-desktop/ui/views/App/Calls/Incall.qml @@ -70,7 +70,7 @@ Rectangle { iconSize: CallStyle.header.iconSize useStates: false - onClicked: callStatistics.showMenu() + onClicked: callStatistics.show() // See: http://www.linphone.org/docs/liblinphone/group__call__misc.html#ga62c7d3d08531b0cc634b797e273a0a73 Timer { @@ -88,7 +88,6 @@ Rectangle { call: incall.call width: container.width - launcher: callQuality relativeTo: callQuality relativeY: CallStyle.header.stats.relativeY }