src/qml/TimelineDelegate.qml

0001 // SPDX-FileCopyrightText: 2022 James Graham <james.h.graham@protonmail.com>
0002 // SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
0003
0004 import QtQuick
0005
0006 import org.kde.kirigami as Kirigami
0007
0008 import org.kde.neochat
0009 import org.kde.neochat.config
0010
0011 /**
0012  * @brief The base Item for all delegates in the timeline.
0013  *
0014  * This component handles the placing of the main content for a delegate in the
0015  * timeline. The component is designed for all delegates, positioning them in the
0016  * timeline with variable padding depending on the window width.
0017  *
0018  * This component also supports always setting the delegate to fill the available
0019  * width in the timeline, e.g. in compact mode.
0020  */
0021 Item {
0022     id: root
0023
0024     /**
0025      * @brief The Item representing the delegate's main content.
0026      */
0027     property Item contentItem
0028
0029     /**
0030      * @brief The x position of the content item.
0031      *
0032      * @note Used for positioning the hover actions.
0033      */
0034     property real contentX: contentItemParent.x
0035
0036     /**
0037      * @brief Whether the delegate should always stretch to the maximum available width.
0038      */
0039     property bool alwaysMaxWidth: false
0040
0041     /**
0042      * @brief The padding to the left of the content.
0043      */
0044     property real leftPadding: Kirigami.Units.largeSpacing
0045
0046     /**
0047      * @brief The padding to the right of the content.
0048      */
0049     property real rightPadding: Config.compactLayout && root.ListView.view.width >= Kirigami.Units.gridUnit * 20 ? Kirigami.Units.gridUnit * 2 + Kirigami.Units.largeSpacing : Kirigami.Units.largeSpacing
0050
0051     width: parent?.width
0052     implicitHeight: contentItemParent.implicitHeight
0053
0054     Item {
0055         id: contentItemParent
0056         anchors.top: parent.top
0057         anchors.bottom: parent.bottom
0058         anchors.leftMargin: state === "alignLeft" ? Kirigami.Units.largeSpacing : 0
0059
0060         state: Config.compactLayout || root.alwaysMaxWidth ? "alignLeft" : "alignCenter"
0061         // Align left when in compact mode and center when using bubbles
0062         states: [
0063             State {
0064                 name: "alignLeft"
0065                 AnchorChanges {
0066                     target: contentItemParent
0067                     anchors.horizontalCenter: undefined
0068                     anchors.left: parent ? parent.left : undefined
0069                 }
0070             },
0071             State {
0072                 name: "alignCenter"
0073                 AnchorChanges {
0074                     target: contentItemParent
0075                     anchors.horizontalCenter: parent ? parent.horizontalCenter : undefined
0076                     anchors.left: undefined
0077                 }
0078             }
0079         ]
0080
0081         width: (Config.compactLayout || root.alwaysMaxWidth ? root.width : delegateSizeHelper.currentWidth) - root.leftPadding - root.rightPadding
0082         implicitHeight: root.contentItem?.implicitHeight ?? 0
0083     }
0084
0085     DelegateSizeHelper {
0086         id: delegateSizeHelper
0087         startBreakpoint: Kirigami.Units.gridUnit * 46
0088         endBreakpoint: Kirigami.Units.gridUnit * 66
0089         startPercentWidth: 100
0090         endPercentWidth: 85
0091         maxWidth: Kirigami.Units.gridUnit * 60
0092
0093         parentWidth: root.width
0094     }
0095
0096     onContentItemChanged: {
0097         if (!contentItem) {
0098             return;
0099         }
0100         contentItem.parent = contentItemParent;
0101         contentItem.anchors.fill = contentItem.parent;
0102     }
0103 }