1
0
Fork 0
mirror of https://git.jami.net/savoirfairelinux/jami-client-qt.git synced 2025-04-21 21:52:03 +02:00

callactionbar: improve menu popup width

GitLab: #817
Change-Id: If93df83c95dd8c9575d7d19fec6eb7442aa2611a
This commit is contained in:
Aline Gondim Santos 2022-12-01 14:59:12 -03:00
parent 9da4f66092
commit 04b3b06f60
2 changed files with 25 additions and 17 deletions

View file

@ -62,6 +62,7 @@ Control {
CallButtonDelegate { CallButtonDelegate {
width: root.height width: root.height
height: width height: width
barWidth: root.width
onSubMenuVisibleChanged: subMenuOpen = subMenuVisible onSubMenuVisibleChanged: subMenuOpen = subMenuVisible
} }
} }
@ -479,6 +480,7 @@ Control {
} }
} }
} }
Item { Item {
id: overflowRect id: overflowRect
property real remainingSpace: (root.width - centralControls.width) / 2 property real remainingSpace: (root.width - centralControls.width) / 2
@ -517,6 +519,7 @@ Control {
model: CallOverlayModel.overflowModel() model: CallOverlayModel.overflowModel()
delegate: buttonDelegate delegate: buttonDelegate
} }
ComboBox { ComboBox {
id: overflowButton id: overflowButton

View file

@ -27,12 +27,13 @@ import net.jami.Constants 1.1
import "../../commoncomponents" import "../../commoncomponents"
ItemDelegate { ItemDelegate {
id: wrapper id: root
property bool isFirst: index < 1 property bool isFirst: index < 1
property bool isLast: index + 1 < ListView.view.count ? false : true property bool isLast: index + 1 < ListView.view.count ? false : true
property bool hasLast: ListView.view.centeredGroup !== undefined property bool hasLast: ListView.view.centeredGroup !== undefined
property bool isVertical: wrapper.ListView.view.orientation === ListView.Vertical property bool isVertical: root.ListView.view.orientation === ListView.Vertical
property real barWidth
property alias subMenuVisible: menu.popup.visible property alias subMenuVisible: menu.popup.visible
@ -53,7 +54,7 @@ ItemDelegate {
MouseArea { MouseArea {
visible: ItemAction.openPopupWhenClicked !== undefined visible: ItemAction.openPopupWhenClicked !== undefined
&& ItemAction.openPopupWhenClicked && !menu.popup.visible && ItemAction.openPopupWhenClicked && !menu.popup.visible
anchors.fill: wrapper anchors.fill: root
onClicked: menu.popup.open() onClicked: menu.popup.open()
} }
@ -63,9 +64,9 @@ ItemDelegate {
color: { color: {
if (supplimentaryBackground.visible) if (supplimentaryBackground.visible)
return "#c4272727" return "#c4272727"
return wrapper.down ? return root.down ?
"#c4777777" : "#c4777777" :
(wrapper.hovered && !menu.hovered) ? (root.hovered && !menu.hovered) ?
"#c4444444" : "#c4444444" :
"#c4272727" "#c4272727"
} }
@ -96,8 +97,8 @@ ItemDelegate {
id: supplimentaryBackground id: supplimentaryBackground
visible: ItemAction.hasBg !== undefined visible: ItemAction.hasBg !== undefined
color: wrapper.down ? Qt.lighter(JamiTheme.refuseRed, 1.5) : color: root.down ? Qt.lighter(JamiTheme.refuseRed, 1.5) :
wrapper.hovered && !menu.hovered ? root.hovered && !menu.hovered ?
JamiTheme.refuseRed : JamiTheme.refuseRed :
JamiTheme.refuseRedTransparent JamiTheme.refuseRedTransparent
anchors.fill: parent anchors.fill: parent
@ -156,7 +157,7 @@ ItemDelegate {
MaterialToolTip { MaterialToolTip {
id: toolTip id: toolTip
parent: parent parent: parent
visible: text.length > 0 && (wrapper.hovered || menu.hovered) visible: text.length > 0 && (root.hovered || menu.hovered)
text: menu.hovered ? menuAction.text : (ItemAction text: menu.hovered ? menuAction.text : (ItemAction
!== undefined ? ItemAction.text : null) !== undefined ? ItemAction.text : null)
verticalPadding: 1 verticalPadding: 1
@ -287,11 +288,11 @@ ItemDelegate {
popup: Popup { popup: Popup {
id: itemPopup id: itemPopup
y: isVertical ? -(implicitHeight - wrapper.height) / 2 - 18 : -implicitHeight - 12 y: isVertical ? -(implicitHeight - root.height) / 2 - 18 : -implicitHeight - 12
x: { x: {
if (isVertical) if (isVertical)
return -implicitWidth - 12 return -implicitWidth - 12
var xValue = -(implicitWidth - wrapper.width) / 2 - 18 var xValue = -(implicitWidth - root.width) / 2 - 18
var mainPoint = mapToItem(mainView, xValue, y) var mainPoint = mapToItem(mainView, xValue, y)
var diff = mainPoint.x + itemListView.implicitWidth - mainView.width var diff = mainPoint.x + itemListView.implicitWidth - mainView.width
return diff > 0 ? xValue - diff - 24 : xValue return diff > 0 ? xValue - diff - 24 : xValue
@ -325,25 +326,29 @@ ItemDelegate {
// recalc list width based on max item width // recalc list width based on max item width
onCountChanged: { onCountChanged: {
var maxWidth = 0 var mPreferredWidth = 145
if (count && menuAction.popupMode === CallActionBar.ActionPopupMode.LayoutOption) { if (count && menuAction.popupMode === CallActionBar.ActionPopupMode.LayoutOption) {
menuItemWidth = 290 menuItemWidth = 290
return return
} }
for (var i = 0; i < count; ++i) { for (var i = 0; i < count; ++i) {
if (menuAction.popupMode === CallActionBar.ActionPopupMode.ListElement) { if (menuAction.popupMode === CallActionBar.ActionPopupMode.ListElement)
itemTextMetrics.text = menuAction.listModel.get(i).Name itemTextMetrics.text = menuAction.listModel.get(i).Name
} else { else {
// Hack: use AudioDeviceModel.DeviceName role for video as well // Hack: use AudioDeviceModel.DeviceName role for video as well
var idx = menuAction.listModel.index(i, 0) var idx = menuAction.listModel.index(i, 0)
itemTextMetrics.text = menuAction.listModel.data( itemTextMetrics.text = menuAction.listModel.data(
idx, AudioDeviceModel.DeviceName) idx, AudioDeviceModel.DeviceName)
} }
if (itemTextMetrics.boundingRect.width > maxWidth) if (itemTextMetrics.boundingRect.width > mPreferredWidth)
maxWidth = itemTextMetrics.boundingRect.width mPreferredWidth = itemTextMetrics.boundingRect.width
} }
// 30(icon) + 5(layout spacing) + 12(margins) // 30(icon) + 5(layout spacing) + 12(margins) + 20 to avoid text elipsis
menuItemWidth = Math.min(256, maxWidth + 30 + 5 + 12) mPreferredWidth = mPreferredWidth + 30 + 5 + 12 + 20
mPreferredWidth = Math.min(root.barWidth, mPreferredWidth)
menuItemWidth = mPreferredWidth
} }
} }