Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import QtQuick 2.4
Column {
width: parent.width
height: parent.height
property alias model: columnRepeater.model
Repeater {
id: columnRepeater
delegate: accordion
}
Component {
id: accordion
Column {
width: parent.width
Item {
id: infoRow
width: parent.width
height: childrenRect.height
property bool expanded: false
MouseArea {
anchors.fill: parent
onClicked: infoRow.expanded = !infoRow.expanded
enabled: modelData.children ? true : false
}
Image {
id: carot
anchors {
top: parent.top
left: parent.left
margins: 5
}
sourceSize.width: 16
sourceSize.height: 16
source: 'images/triangle.svg'
visible: modelData.children ? true : false
transform: Rotation {
origin.x: 5
origin.y: 10
angle: infoRow.expanded ? 90 : 0
Behavior on angle { NumberAnimation { duration: 150 } }
}
}
Text {
anchors {
left: carot.visible ? carot.right : parent.left
top: parent.top
margins: 5
}
font.pointSize: 12
visible: parent.visible
color: 'white'
text: modelData.label
}
Text {
font.pointSize: 12
visible: infoRow.visible
color: 'white'
text: modelData.value
anchors {
top: parent.top
right: parent.right
margins: 5
}
}
}
ListView {
id: subentryColumn
x: 20
width: parent.width - x
height: childrenRect.height * opacity
visible: opacity > 0
opacity: infoRow.expanded ? 1 : 0
delegate: accordion
model: modelData.children ? modelData.children : []
interactive: false
Behavior on opacity { NumberAnimation { duration: 200 } }
}
}
}
}
import QtQuick 2.0
import QtQuick.Window 2.2
Window {
width: 640
height: 480
title: 'Accordion'
visible: true
Accordion {
anchors.fill: parent
anchors.margins: 10
model: [
{
'label': 'Cash',
'value':'$4418.28',
'children': [
{
'label': 'Float',
'value': '$338.72'
},
{
'label': 'Cash Sales',
'value': '$4059.56'
},
{
'label': 'In/Out',
'value': '-$50.00',
'children': [
{
'label': 'coffee/creamer',
'value': '-$40.00'
},
{
'label': 'staples & paper',
'value': '-$10.00'
}
]
}
]
},
{
'label': 'Card',
'value': '$3314.14',
'children': [
{
'label': 'Debit',
'value': '$1204.04'
},
{
'label': 'Credit',
'value': '$2110.10'
}
]
}
]
}
}
@ciiiii

This comment has been minimized.

Copy link

@ciiiii ciiiii commented Jan 24, 2018

you fucking genius

@pcdummy

This comment has been minimized.

Copy link

@pcdummy pcdummy commented Jun 4, 2018

@wian007

This comment has been minimized.

Copy link

@wian007 wian007 commented Jul 7, 2018

Nicely done, real tight!

@VoodbooV

This comment has been minimized.

Copy link

@VoodbooV VoodbooV commented Dec 25, 2019

Superb job.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.