subsurface/mobile-widgets/qml/TemplateSection.qml
jan Iversen 8468d28a41 mobile-widgets/qml: add TemplateSection
TempleSection is a clickable rectangle that contains
information.

It is used to
- group information
- hide/unhide details

And are an important building block in decluttering small
screen, while showing all information on bigger screens

Signed-off-by: Jan Iversen <jani@apache.org>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
2019-12-26 10:18:08 -08:00

36 lines
768 B
QML

// SPDX-License-Identifier: GPL-2.0
import QtQuick 2.11
import QtQuick.Controls 2.4
import QtQuick.Layouts 1.11
Column {
width: parent.width -20
property string title: "no title"
property bool isExpanded: false
Button {
width: parent.width
background: Rectangle {
id: buttonBackground
antialiasing: true
height: buttonText.height + 2
width: parent.width
border.color: "black"
border.width: 1
color: subsurfaceTheme.backgroundColor
opacity: 0.5
}
contentItem: Text {
id: buttonText
font.pointSize: subsurfaceTheme.regularPointSize
anchors.centerIn: buttonBackground
color: subsurfaceTheme.textColor
text: (isExpanded ? "- " : "+ ") + title
font.bold: true
}
onClicked: {
isExpanded = !isExpanded
}
}
}