widgets/Box.qml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86

import "root:/config"
import QtQuick

Rectangle {
    id: root

    property bool vertical: false
    property bool homogenous: false
    property bool animated: false
    property int spacing: Appearance.spacing.small
    property var padding: 0

    readonly property int paddingTop: getRealPadding().top
    readonly property int paddingRight: getRealPadding().right
    readonly property int paddingBottom: getRealPadding().bottom
    readonly property int paddingLeft: getRealPadding().left
    readonly property int paddingX: getRealPadding().x
    readonly property int paddingY: getRealPadding().y

    function getRealPadding() {
        const pad = {};

        if (Array.isArray(padding)) {
            if (padding.length === 2) {
                pad.top = pad.bottom = padding[0];
                pad.left = pad.right = padding[1];
            } else if (padding.length === 3) {
                pad.top = padding[0];
                pad.left = pad.right = padding[1];
                pad.bottom = padding[2];
            } else if (padding.length === 4) {
                pad.top = padding[0];
                pad.right = padding[1];
                pad.bottom = padding[2];
                pad.left = padding[3];
            }
        } else {
            pad.top = pad.bottom = pad.left = pad.right = padding;
        }

        pad.x = pad.left + pad.right;
        pad.y = pad.top + pad.bottom;

        return pad;
    }

    color: "transparent"

    implicitWidth: childrenRect.width + paddingX
    implicitHeight: childrenRect.height + paddingY

    onChildrenChanged: {
        for (const child of children) {
            child.x = Qt.binding(() => paddingLeft);
            child.y = Qt.binding(() => paddingTop);
        }
    }

    Behavior on color {
        ColorAnimation {
            duration: Appearance.anim.durations.normal
            easing.type: Easing.BezierSpline
            easing.bezierCurve: Appearance.anim.curves.standard
        }
    }

    Behavior on implicitWidth {
        enabled: root.animated

        NumberAnimation {
            duration: Appearance.anim.durations.normal
            easing.type: Easing.BezierSpline
            easing.bezierCurve: Appearance.anim.curves.emphasized
        }
    }

    Behavior on implicitHeight {
        enabled: root.animated

        NumberAnimation {
            duration: Appearance.anim.durations.normal
            easing.type: Easing.BezierSpline
            easing.bezierCurve: Appearance.anim.curves.emphasized
        }
    }
}