feat(ui/views/App/Calls/Incall): use Popup in CallStatistics

This commit is contained in:
Ronan Abhamon 2017-05-16 12:07:07 +02:00
parent 715d729ba9
commit 5a3903dceb
7 changed files with 94 additions and 97 deletions

View file

@ -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)
}
}
}

View file

@ -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

View file

@ -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
}
}
}
}
}

View file

@ -64,7 +64,6 @@ ListView {
Popup {
id: popup
implicitWidth: actionMenu.width
relativeTo: callControls
relativeX: callControls.width

View file

@ -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

View file

@ -24,7 +24,7 @@ function handleStatusChanged (status) {
}
telKeypad.visible = false
callStatistics.hideMenu()
callStatistics.hide()
}
}

View file

@ -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
}