2023-03-08 18:14:21 +08:00
|
|
|
|
import QtQuick 2.15
|
|
|
|
|
|
import FluentUI 1.0
|
|
|
|
|
|
|
|
|
|
|
|
Item {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
property string headerText: "Titlte"
|
|
|
|
|
|
property bool expand: false
|
|
|
|
|
|
|
|
|
|
|
|
id:root
|
|
|
|
|
|
height: layout_header.height + container.height
|
|
|
|
|
|
width: 400
|
|
|
|
|
|
|
|
|
|
|
|
property int contentHeight : 300
|
|
|
|
|
|
|
|
|
|
|
|
default property alias content: container.data
|
|
|
|
|
|
|
|
|
|
|
|
Rectangle{
|
|
|
|
|
|
id:layout_header
|
|
|
|
|
|
width: parent.width
|
2023-03-09 23:11:59 +08:00
|
|
|
|
height: 45
|
2023-03-08 18:14:21 +08:00
|
|
|
|
radius: 4
|
|
|
|
|
|
border.color: FluTheme.isDark ? Qt.rgba(53/255,53/255,53/255,1) : Qt.rgba(240/255,240/255,240/255,1)
|
|
|
|
|
|
color: FluTheme.isDark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(254/255,254/255,254/255,1)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
MouseArea{
|
|
|
|
|
|
id:root_mouse
|
|
|
|
|
|
anchors.fill: parent
|
|
|
|
|
|
hoverEnabled: true
|
|
|
|
|
|
onClicked: {
|
|
|
|
|
|
expand = !expand
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
FluText{
|
|
|
|
|
|
text: headerText
|
|
|
|
|
|
anchors{
|
|
|
|
|
|
verticalCenter: parent.verticalCenter
|
|
|
|
|
|
left: parent.left
|
|
|
|
|
|
leftMargin: 15
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
FluIconButton{
|
|
|
|
|
|
anchors{
|
|
|
|
|
|
verticalCenter: parent.verticalCenter
|
|
|
|
|
|
right: parent.right
|
|
|
|
|
|
rightMargin: 15
|
|
|
|
|
|
}
|
|
|
|
|
|
hoverColor: FluTheme.isDark ? Qt.rgba(73/255,73/255,73/255,1) : Qt.rgba(245/255,245/255,245/255,1)
|
|
|
|
|
|
normalColor: FluTheme.isDark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(254/255,254/255,254/255,1)
|
|
|
|
|
|
hovered: root_mouse.containsMouse
|
|
|
|
|
|
icon: expand ? FluentIcons.FA_angle_up : FluentIcons.FA_angle_down
|
|
|
|
|
|
onClicked: {
|
|
|
|
|
|
expand = !expand
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Rectangle{
|
|
|
|
|
|
id:container
|
|
|
|
|
|
width: parent.width
|
|
|
|
|
|
clip: true
|
|
|
|
|
|
anchors{
|
|
|
|
|
|
top: layout_header.bottom
|
|
|
|
|
|
left: layout_header.left
|
|
|
|
|
|
}
|
|
|
|
|
|
radius: 4
|
|
|
|
|
|
border.color: FluTheme.isDark ? Qt.rgba(53/255,53/255,53/255,1) : Qt.rgba(240/255,240/255,240/255,1)
|
|
|
|
|
|
color: FluTheme.isDark ? Qt.rgba(57/255,57/255,57/255,1) : Qt.rgba(249/255,249/255,249/255,1)
|
|
|
|
|
|
height: expand ? contentHeight : 0
|
|
|
|
|
|
Behavior on height {
|
|
|
|
|
|
NumberAnimation{
|
|
|
|
|
|
duration: 150
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
