1/**
2 * \file Collapsible.qml
3 * Base component for collapsibles.
4 *
5 * \b Project: Kid3
6 * \author Urs Fleisch
7 * \date 16 Feb 2015
8 *
9 * Copyright (C) 2015-2018  Urs Fleisch
10 *
11 * This program is free software; you can redistribute it and/or modify
12 * it under the terms of the GNU Lesser General Public License as published by
13 * the Free Software Foundation; version 3.
14 *
15 * This program is distributed in the hope that it will be useful,
16 * but WITHOUT ANY WARRANTY; without even the implied warranty of
17 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
18 * GNU Lesser General Public License for more details.
19 *
20 * You should have received a copy of the GNU Lesser General Public License
21 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
22 */
23
24import QtQuick 2.11
25import QtQuick.Controls 2.4
26
27Column {
28  property alias text: label.text
29  property alias checked: checkBox.checked
30  property alias buttons: buttonContainer.data
31  property alias content: contentContainer.content
32  property alias labelColor: label.color
33
34  Rectangle {
35    id: collapsibleRect
36
37    height: constants.rowHeight
38    width: parent.width
39
40    gradient: Gradient {
41      GradientStop { position: 0.0; color: "#666" }
42      GradientStop { position: 1.0; color: "#333" }
43    }
44
45    Item {
46      id: checkBox
47      anchors.left: parent.left
48      anchors.verticalCenter: parent.verticalCenter
49
50      property bool checked
51
52      width: constants.controlHeight
53      height: constants.controlHeight
54
55      ScaledImage {
56        anchors.centerIn: parent
57        source: "../icons/" +
58                (checked ? "triangle_down.svg" : "triangle_right.svg")
59      }
60
61      MouseArea {
62        anchors.fill: parent
63        onClicked: {
64          checkBox.checked = !checkBox.checked
65        }
66      }
67    }
68    Label {
69      id: label
70      anchors.left: checkBox.right
71      anchors.right: buttonContainer.left
72      anchors.verticalCenter: parent.verticalCenter
73      anchors.margins: constants.margins
74      anchors.rightMargin: 0
75      color: "#e6e6e6"
76      clip: true
77    }
78    Row {
79      id: buttonContainer
80      anchors.right: parent.right
81      anchors.verticalCenter: parent.verticalCenter
82      anchors.margins: constants.margins
83      spacing: constants.spacing
84    }
85  }
86  Item {
87    id: contentContainer
88    property Item content
89    anchors.left: parent.left
90    anchors.right: parent.right
91    width: content ? content.width : undefined
92    height: content ? content.height : undefined
93    onContentChanged: {
94      if (content) content.parent = contentContainer;
95    }
96    visible: checked
97  }
98}
99