status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(DAppSignRequestModal): correctly compute text painted height 

- fixes text overflowing the box height

Fixes #15650
This commit is contained in:
Lukáš Tinkl 2024-07-29 14:30:37 +02:00 committed by Lukáš Tinkl
parent a310b8b803
commit fbb112f64b
3 changed files with 87 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
storybook/pages/DAppSignRequestModalPage.qml
View File

@ -86,6 +86,11 @@ SplitView {
}
}
}',
"
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nibh. Etiam quis quam. In dapibus augue non sapien. Praesent id justo in neque elementum ultrices. Morbi scelerisque luctus velit. Vivamus ac leo pretium faucibus. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. Nullam eget nisl. Aliquam erat volutpat.
Proin pede metus, vulputate nec, fermentum fringilla, vehicula vitae, justo. Fusce nibh. Etiam quis quam. In dapibus augue non sapien. Praesent id justo in neque elementum ultrices. Fusce nibh. Etiam quis quam. In dapibus augue non sapien. Praesent id justo in neque elementum ultrices. Fusce nibh. Etiam quis quam. In dapibus augue non sapien. Praesent id justo in neque elementum ultrices. Fusce nibh. Etiam quis quam. In dapibus augue non sapien. Praesent id justo in neque elementum ultrices.
",
'"tx":{"data":"0x","from":"0xE2d622C817878dA5143bBE06866ca8E35273Ba8a","gasLimit":"0x5208","gasPrice":"0x048ddbc5","nonce":"0x2a","to":"0xE2d622C817878dA5143bBE06866ca8E35273Ba8a","value":"0x00"}',
""
]
@ -104,7 +109,7 @@ SplitView {
}
ComboBox {
id: contentToSignComboBox
model: ["Long content to sign", "Short content to sign", "Empty content to sign"]
model: ["Long content to sign", "Middle content to sign", "Short content to sign", "Empty content to sign"]
currentIndex: 0
}
CheckBox {

3
ui/imports/shared/popups/walletconnect/DAppSignRequestModal.qml
View File

@ -127,6 +127,7 @@ SignTransactionModalBase {
ContentPanel {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.bottomMargin: Style.current.bigPadding
payloadToDisplay: root.requestPayload
visible: !!root.requestPayload
}
@ -189,4 +190,4 @@ SignTransactionModalBase {
}
]
}
}
}

156
ui/imports/shared/popups/walletconnect/panels/ContentPanel.qml
View File

@ -1,77 +1,79 @@
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtGraphicalEffects 1.15
import StatusQ.Controls 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0
Rectangle {
id: root
property alias payloadToDisplay: contentText.text
border.width: 1
border.color: Theme.palette.baseColor2
color: "transparent"
radius: 8
implicitHeight: d.expanded ? contentText.implicitHeight + (2 * contentText.anchors.margins) :
Math.min(contentText.implicitHeight + (2 * contentText.anchors.margins), 200)
HoverHandler {
id: hoverHandler
target: root
}
StatusBaseText {
id: contentText
objectName: "textContent"
anchors.fill: parent
anchors.margins: 20
text: root.payloadToDisplay
font.pixelSize: Style.current.additionalTextSize
lineHeightMode: Text.FixedHeight
lineHeight: 18
wrapMode: Text.WrapAnywhere
StatusFlatButton {
objectName: "expandButton"
anchors.top: parent.top
anchors.right: parent.right
icon.name: d.expanded ? "collapse" : "expand"
icon.color: hovered ? Theme.palette.directColor1 : Theme.palette.baseColor1
hoverColor: "transparent"
visible: d.canExpand && hoverHandler.hovered
onClicked: {
d.expanded = !d.expanded
}
}
layer.enabled: !d.expanded && d.canExpand
layer.effect: OpacityMask {
maskSource: Rectangle {
width: root.width
height: root.height
gradient: Gradient {
orientation: Gradient.Vertical
GradientStop { position: 0.0 }
GradientStop { position: (root.height - 60) / root.height }
GradientStop { position: 1; color: "transparent" }
}
}
}
}
QtObject {
id: d
readonly property int maxContentHeight: 350
property bool expanded: false
property bool canExpand: contentText.implicitHeight > maxContentHeight
}
}
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtGraphicalEffects 1.15
import StatusQ.Controls 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0
Rectangle {
id: root
property alias payloadToDisplay: contentText.text
border.width: 1
border.color: Theme.palette.baseColor2
color: "transparent"
radius: 8
implicitHeight: d.expanded ? contentText.implicitHeight + (2 * contentText.anchors.margins)
: Math.min(contentText.implicitHeight + (2 * contentText.anchors.margins), d.maxContentHeight)
HoverHandler {
id: hoverHandler
target: root
}
StatusBaseText {
id: contentText
objectName: "textContent"
anchors.fill: parent
anchors.margins: 20
text: root.payloadToDisplay
font.pixelSize: Style.current.additionalTextSize
lineHeightMode: Text.FixedHeight
lineHeight: 18
wrapMode: Text.Wrap
layer.enabled: !d.expanded && d.canExpand
layer.effect: OpacityMask {
maskSource: Rectangle {
width: root.width
height: root.height
gradient: Gradient {
orientation: Gradient.Vertical
GradientStop { position: 0.0 }
GradientStop { position: (root.height - 60) / root.height }
GradientStop { position: 1; color: "transparent" }
}
}
}
}
StatusFlatButton {
objectName: "expandButton"
anchors.top: parent.top
anchors.topMargin: 4
anchors.right: parent.right
anchors.rightMargin: 4
icon.name: d.expanded ? "collapse" : "expand"
icon.color: hovered ? Theme.palette.directColor1 : Theme.palette.baseColor1
hoverColor: "transparent"
visible: d.canExpand && hoverHandler.hovered
onClicked: {
d.expanded = !d.expanded
}
}
QtObject {
id: d
readonly property int maxContentHeight: 350
property bool expanded: false
readonly property bool canExpand: contentText.paintedHeight + (2 * contentText.anchors.margins) > maxContentHeight
}
}