feat(StatusModal): add ability to set elide config of header titles

There are now two new properties in `StatusModalHeaderSettings`:

- `titleElide`
- `subTitleElide`

These can be used to configure the `elide` property of both header titles.
The default values for both of them is `Text.ElideRight`.

Closes #353
This commit is contained in:
Pascal Precht 2021-08-30 12:32:31 +02:00 committed by Michał Cieślak
parent d829635354
commit 7cf893113b
5 changed files with 13 additions and 3 deletions

View File

@ -245,6 +245,7 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
anchors.centerIn: parent
header.title: "Some super long text here that exceeds the available space"
header.subTitle: "Some super long text here that exceeds the available space"
header.subTitleElide: Text.ElideMiddle
header.image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
header.image.isIdenticon: true

View File

@ -3,7 +3,8 @@ import QtQuick 2.14
QtObject {
property string title
property string subTitle
property int titleElide: Text.ElideRight
property int subTitleElide: Text.ElideRight
property StatusImageSettings image: StatusImageSettings {
width: 40
height: 40

View File

@ -52,7 +52,9 @@ QC.Popup {
visible: statusModal.showHeader
title: header.title
titleElide: header.titleElide
subTitle: header.subTitle
subTitleElide: header.subTitleElide
image: header.image
icon: header.icon

View File

@ -9,6 +9,8 @@ Row {
property alias title: headerTitle.text
property alias subTitle: headerSubTitle.text
property int titleElide: Text.ElideRight
property int subTitleElide: Text.ElideRight
property bool editable: false
signal editButtonClicked
@ -88,7 +90,7 @@ Row {
font.family: Theme.palette.baseFont.name
font.pixelSize: 17
font.bold: true
elide: Text.ElideRight
elide: statusImageWithTitle.titleElide
color: Theme.palette.directColor1
width: !editButton.visible ? parent.width :
parent.width - editButton.width - parent.spacing
@ -116,7 +118,7 @@ Row {
font.pixelSize: 15
color:Theme.palette.baseColor1
width: parent.width
elide: Text.ElideRight
elide: statusImageWithTitle.subTitleElide
}
}
}

View File

@ -11,6 +11,8 @@ Rectangle {
property alias title: imageWithTitle.title
property alias subTitle: imageWithTitle.subTitle
property int titleElide
property int subTitleElide
property alias actionButton: actionButtonLoader.sourceComponent
property alias image: imageWithTitle.image
@ -35,6 +37,8 @@ Rectangle {
anchors.leftMargin: 16
editable: statusModalHeader.editable
titleElide: statusModalHeader.titleElide
subTitleElide: statusModalHeader.subTitleElide
onEditButtonClicked: statusModalHeader.editButtonClicked()
}