From ddc793e36153f9d90b0a0898732cb77aa895ae5c Mon Sep 17 00:00:00 2001
From: Ming Rui Zhang <mingrui.zhang@savoirfairelinux.com>
Date: Fri, 4 Jun 2021 12:43:39 -0400
Subject: [PATCH] aboutPopupButton: make the button width grows with text width
Change-Id: I99d5e01dd7438361a6ddafe2f1d97be1536c288b
---
src/commoncomponents/MaterialButton.qml | 52 +++++++++----------------
src/constant/JamiTheme.qml | 1 +
src/mainview/components/WelcomePage.qml | 11 +++++-
3 files changed, 29 insertions(+), 35 deletions(-)
diff --git a/src/commoncomponents/MaterialButton.qml b/src/commoncomponents/MaterialButton.qml
index 1e61e370a..09c835bcd 100644
--- a/src/commoncomponents/MaterialButton.qml
+++ b/src/commoncomponents/MaterialButton.qml
@@ -41,7 +41,9 @@ Button {
property var iconPreferredHeight: 18
property var iconPreferredWidth: 18
+ property bool enableElide: true
property int elide: Text.ElideRight
+ property int textActualWidth: buttonTextMetrics.boundingRect.width
font.kerning: true
font.pointSize: JamiTheme.textFontSize
@@ -71,26 +73,9 @@ Button {
visible: animatedImageSource.length !== 0
}
- Image {
+ ResponsiveImage {
id: buttonImage
- property real pixelDensity: Screen.pixelDensity
- property real isSvg: {
- var match = /[^.]+$/.exec(source)
- return match !== null && match[0] === 'svg'
- }
-
- function setSourceSize() {
- if (isSvg) {
- sourceSize.width = width
- sourceSize.height = height
- } else
- sourceSize = undefined
- }
-
- onPixelDensityChanged: setSourceSize()
- Component.onCompleted: setSourceSize()
-
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: JamiTheme.preferredMarginSize / 2
@@ -99,20 +84,14 @@ Button {
width: iconPreferredWidth
visible: source.toString().length !== 0
- layer {
- enabled: true
- effect: ColorOverlay {
- id: overlay
- color:{
- if (!outlined)
- return "white"
- if (hovered && root.hoveredColor)
- return root.hoveredColor
- if (checked && root.pressedColor)
- return root.pressedColor
- return root.color
- }
- }
+ color: {
+ if (!outlined)
+ return "white"
+ if (hovered && root.hoveredColor)
+ return root.hoveredColor
+ if (checked && root.pressedColor)
+ return root.pressedColor
+ return root.color
}
}
@@ -128,8 +107,15 @@ Button {
JamiTheme.preferredMarginSize / 2 - minimumIconTextSpacing) * 2
}
+ TextMetrics {
+ id: buttonTextMetrics
+
+ font: buttonText.font
+ text: buttonText.text
+ }
+
text: root.text
- elide: root.elide
+ elide: enableElide ? root.elide : Text.ElideNone
color: {
if (!outlined)
return "white"
diff --git a/src/constant/JamiTheme.qml b/src/constant/JamiTheme.qml
index e3cc33c61..345fa04a1 100644
--- a/src/constant/JamiTheme.qml
+++ b/src/constant/JamiTheme.qml
@@ -196,6 +196,7 @@ Item {
property real smartListItemHeight: 64
property real smartListAvatarSize: 52
property real avatarSizeInCall: 130
+ property real aboutButtonPreferredWidth: 150
property real callButtonPreferredSize: 50
property real contextMenuItemTextPreferredWidth: 142
property real contextMenuItemTextMaxWidth: 182
diff --git a/src/mainview/components/WelcomePage.qml b/src/mainview/components/WelcomePage.qml
index 23c07095a..7dd1865e2 100644
--- a/src/mainview/components/WelcomePage.qml
+++ b/src/mainview/components/WelcomePage.qml
@@ -159,14 +159,21 @@ Rectangle {
Layout.alignment: Qt.AlignBottom | Qt.AlignHCenter
Layout.bottomMargin: JamiTheme.preferredMarginSize
- Layout.preferredWidth: 150
- Layout.preferredHeight: 30
+ Layout.preferredWidth: JamiTheme.aboutButtonPreferredWidth
+ Layout.preferredHeight: preferredHeight
color: JamiTheme.buttonTintedBlack
+ enableElide: false
hoveredColor: JamiTheme.buttonTintedBlackHovered
pressedColor: JamiTheme.buttonTintedBlackPressed
outlined: true
+ onTextActualWidthChanged: {
+ if (textActualWidth > btnAboutPopUp.Layout.preferredWidth)
+ btnAboutPopUp.Layout.preferredWidth =
+ textActualWidth + JamiTheme.preferredMarginSize * 2
+ }
+
text: JamiStrings.aboutJami
onClicked: aboutPopUpDialog.open()
--
GitLab