Warning, /maui/mauikit/src/controls.6/ListItemTemplate.qml is written in an unsupported language. File is not indexed.
0001 /*
0002 * Copyright 2018 Camilo Higuita <milo.h@aol.com>
0003 *
0004 * This program is free software; you can redistribute it and/or modify
0005 * it under the terms of the GNU Library General Public License as
0006 * published by the Free Software Foundation; either version 2, or
0007 * (at your option) any later version.
0008 *
0009 * This program is distributed in the hope that it will be useful,
0010 * but WITHOUT ANY WARRANTY; without even the implied warranty of
0011 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
0012 * GNU General Public License for more details
0013 *
0014 * You should have received a copy of the GNU Library General Public
0015 * License along with this program; if not, write to the
0016 * Free Software Foundation, Inc.,
0017 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
0018 */
0019
0020 import QtQuick
0021 import QtQuick.Layouts
0022 import QtQuick.Controls
0023
0024 import org.mauikit.controls 1.3 as Maui
0025
0026 /**
0027 * @inherit QtQuick.Item
0028 * @brief A template for an horizontal layout of information.
0029 *
0030 * <a href="https://doc.qt.io/qt-6/qml-qtquick-controls-item.html">This controls inherits from QQC2 Item, to checkout its inherited properties refer to the Qt Docs.</a>
0031 *
0032 * The structure of this control is divided into a left side header for the image/icon and a four [4] labels for the title, message at the right side of the header, and at the far right side another two labels for complementary information.
0033 *
0034 * The icon header section can be modified and assigned to any custom control.
0035 * @see iconComponent
0036 *
0037 * For extra information checkout the ListBrowserDelegate documentation, since this template element is used as its base.
0038 */
0039 Item
0040 {
0041 id: control
0042
0043 implicitHeight: _layout.implicitHeight
0044
0045 /**
0046 * @brief By default all children will be positioned at the right end of the row.
0047 * The positioning of the elements is handled by a RowLayout, so use the attached properties.
0048 * @property list<QtObject> ListItemTemplate::content
0049 */
0050 default property alias content: _layout.data
0051
0052 /**
0053 * @brief The spacing size between the image/icon header and the labels columns.
0054 * @property int ListItemTemplate::spacing
0055 */
0056 property alias spacing: _layout.spacing
0057
0058 /**
0059 * @brief The text use for the main title text.
0060 * @property string ListItemTemplate::text1
0061 */
0062 property alias text1 : _label1.text
0063
0064 /**
0065 * @brief The text use for the subtitle text.
0066 * @property string ListItemTemplate::text2
0067 */
0068 property alias text2 : _label2.text
0069
0070 /**
0071 * @brief The text use for the left-top far side text.
0072 * @property string ListItemTemplate::text3
0073 */
0074 property alias text3 : _label3.text
0075
0076 /**
0077 * @brief The text use for the left-bottom far side text.
0078 * @property string ListItemTemplate::text4
0079 */
0080 property alias text4 : _label4.text
0081
0082 /**
0083 * @brief An alias for the QQC2 Label handling the title text. Exposed for fine tuning the label font properties.
0084 * @note See the QQC2 Label documentation for more information.
0085 * @property Label ListItemTemplate::label1
0086 */
0087 readonly property alias label1 : _label1
0088
0089 /**
0090 * @brief An alias for the QQC2 Label handling the subtitle text. Exposed for fine tuning the label font properties.
0091 * @note See the QQC2 Label documentation for more information.
0092 * @property Label ListItemTemplate::label2
0093 */
0094 readonly property alias label2 : _label2
0095
0096 /**
0097 * @brief An alias for the QQC2 Label handling the extra information text. Exposed for fine tuning the label font properties.
0098 * @note See the QQC2 Label documentation for more information.
0099 * @property Label ListItemTemplate::label3
0100 */
0101 readonly property alias label3 : _label3
0102
0103 /**
0104 * @brief An alias for the QQC2 Label handling the extra information text. Exposed for fine tuning the label font properties.
0105 * @note See the QQC2 Label documentation for more information.
0106 * @property Label ListItemTemplate::label4
0107 */
0108 readonly property alias label4 : _label4
0109
0110 /**
0111 * @brief The container for the icon header section. This is handled by a QQC2 Loader.
0112 * By default the source component will be loaded asynchronous.
0113 * @property Loader ListItemTemplate::iconContainer
0114 */
0115 readonly property alias iconContainer : _iconLoader
0116
0117 /**
0118 * @brief The Item loaded as the icon header section.
0119 * The component used as the icon header is loaded with a QQC2 Loader - this property exposes that element that was loaded.
0120 * By default the loaded item will be a MauiKit IconItem, but if another component is used for `iconComponent`, that will be the resulting Item.
0121 * @see structure
0122 * @property Item ListItemTemplate::iconItem
0123 */
0124 readonly property alias iconItem : _iconLoader.item
0125
0126 /**
0127 * @brief Whether the icon/image header section should be visible.
0128 * @property bool ListItemTemplate::iconVisible
0129 */
0130 property alias iconVisible : _iconLoader.visible
0131
0132 /**
0133 * @brief An alias to the column element hosting the title and message labels.
0134 * @property ColumnLayout ListItemTemplate::leftLabels
0135 * @see label1
0136 * @see label2
0137 * @property ColumnLayout ListItemTemplate::leftLabels
0138 */
0139 readonly property alias leftLabels : _leftLabels
0140
0141 /**
0142 * @brief An alias to the column element hosting the far-right extra labels.
0143 * @property ColumnLayout ListItemTemplate::rightLabels
0144 * @see label3
0145 * @see label4
0146 * @property ColumnLayout ListItemTemplate::rightLabels
0147 */
0148 readonly property alias rightLabels : _rightLabels
0149
0150 /**
0151 * @brief An alias to the container layout for this control.
0152 * This is handled by a RowLayout.
0153 * @property RowLayout ListItemTemplate::layout
0154 */
0155 readonly property alias layout : _layout
0156
0157 /**
0158 * @brief A size hint for the icon to be used in the header. The final size will depend on the available space.
0159 */
0160 property int iconSizeHint : Maui.Style.iconSizes.big
0161
0162 /**
0163 * @brief A size hint for the image to be used in the header. The final size will depend on the available space.
0164 * By default this is set to `-1` which means that the image header will take the rest of the available space.
0165 */
0166 property int imageSizeHint : -1
0167
0168 /**
0169 * @brief The size of the header section. This is the size the header container will take.
0170 * By default this is set to `-1` which means that the size of the header will be determined by the child implicit height and width.
0171 */
0172 property int headerSizeHint : -1
0173
0174 /**
0175 * @see IconItem::imageSource
0176 */
0177 property string imageSource
0178
0179 /**
0180 * @see IconItem::iconSource
0181 */
0182 property string iconSource
0183
0184 /**
0185 * @brief Whether this element is currently on a selected or checked state. This is used to highlight the component accordingly.
0186 * By default this is set to `false`.
0187 */
0188 property bool isCurrentItem: false
0189
0190 /**
0191 * @brief Whether the two bottom labels, for title and message, should be displayed.
0192 * By default this is set to `true`.
0193 */
0194 property bool labelsVisible: true
0195
0196 /**
0197 * @see IconItem::fillMode
0198 * By default this is set to `Image.PreserveAspectFit`.
0199 * @note For more options and information review the QQC2 Image documentation.
0200 */
0201 property int fillMode : Image.PreserveAspectFit
0202
0203 /**
0204 * @see IconItem::maskRadius
0205 */
0206 property int maskRadius: 0
0207
0208 /**
0209 * @brief The header section can be modified by changing its component to a custom one. By default the component used for the `iconComponent` is a MauiKit IconItem element.
0210 * @note When using a custom component for the header section, pay attention that it has an `implicitHeight` and `implicitWidth` set.
0211 */
0212 property Component iconComponent : _iconComponent
0213
0214 /**
0215 * @see IconItem::isMask
0216 * By default this is set to evaluate `true` for icons equal or smaller in size then 16 pixels.
0217 */
0218 property bool isMask : iconSizeHint <= Maui.Style.iconSizes.medium
0219
0220 /**
0221 * @brief Whether the control should be styled as being hovered by a cursor.
0222 * By default his is set to `false`.
0223 */
0224 property bool hovered: false
0225
0226 /**
0227 * @brief Whether the control should be styled as being highlighted by some external event.
0228 * By default this is set to `false`.
0229 */
0230 property bool highlighted: false
0231
0232 Component
0233 {
0234 id: _iconComponent
0235
0236 Maui.IconItem
0237 {
0238 iconSource: control.iconSource
0239 imageSource: control.imageSource
0240
0241 highlighted: control.isCurrentItem || control.highlighted
0242 hovered: control.hovered
0243
0244 iconSizeHint: control.iconSizeHint
0245 imageSizeHint: control.imageSizeHint
0246
0247 fillMode: control.fillMode
0248 maskRadius: control.maskRadius
0249
0250 isMask: control.isMask
0251 }
0252 }
0253
0254 RowLayout
0255 {
0256 id: _layout
0257 anchors.fill: parent
0258 spacing: Maui.Style.space.small
0259
0260 readonly property color labelColor: control.isCurrentItem || control.highlighted? Maui.Theme.highlightedTextColor : Maui.Theme.textColor
0261
0262 Loader
0263 {
0264 id: _iconLoader
0265
0266 asynchronous: true
0267
0268 visible: (control.width > Maui.Style.units.gridUnit * 10) && (control.iconSource.length > 0 || control.imageSource.length > 0)
0269
0270 active: visible
0271
0272 Layout.alignment: Qt.AlignCenter
0273 Layout.fillWidth: !control.labelsVisible
0274 Layout.fillHeight: true
0275 Layout.preferredWidth: Math.max(implicitWidth, control.headerSizeHint)
0276 Layout.preferredHeight: Math.max(implicitHeight, control.headerSizeHint)
0277
0278 sourceComponent: control.iconComponent
0279 }
0280
0281
0282 ColumnLayout
0283 {
0284 id: _leftLabels
0285 clip: true
0286 visible: control.labelsVisible
0287
0288 Layout.fillHeight: true
0289 Layout.fillWidth: true
0290
0291 spacing: 0
0292
0293 Label
0294 {
0295 id: _label1
0296 visible: text.length
0297
0298 Layout.fillWidth: true
0299 Layout.fillHeight: true
0300
0301 verticalAlignment: _label2.visible ? Qt.AlignBottom : Qt.AlignVCenter
0302
0303 elide: Text.ElideRight
0304 // wrapMode: _label2.visible ? Text.NoWrap : Text.Wrap
0305 wrapMode: Text.NoWrap
0306 textFormat: Text.PlainText
0307 color: _layout.labelColor
0308 }
0309
0310 Label
0311 {
0312 id: _label2
0313 visible: text.length
0314
0315 Layout.fillWidth: true
0316 Layout.fillHeight: true
0317 verticalAlignment: _label1.visible ? Qt.AlignTop : Qt.AlignVCenter
0318
0319 elide: Text.ElideRight
0320 // wrapMode: Text.Wrap
0321 wrapMode: Text.NoWrap
0322 textFormat: Text.PlainText
0323 color: _layout.labelColor
0324 opacity: control.isCurrentItem ? 0.8 : 0.6
0325 }
0326 }
0327
0328 ColumnLayout
0329 {
0330 id: _rightLabels
0331 clip: true
0332 // visible: (control.width > Maui.Style.units.gridUnit * 15) && control.labelsVisible
0333
0334 Layout.fillHeight: true
0335 Layout.fillWidth: true
0336 Layout.maximumWidth: control.width/2
0337 Layout.preferredWidth: implicitWidth
0338 Layout.minimumWidth: 0
0339 spacing: _leftLabels.spacing
0340
0341 Label
0342 {
0343 id: _label3
0344 visible: text.length > 0
0345
0346 Layout.fillHeight: true
0347 Layout.fillWidth: true
0348
0349 Layout.alignment: Qt.AlignRight
0350
0351 horizontalAlignment: Qt.AlignRight
0352 verticalAlignment: _label4.visible ? Qt.AlignBottom : Qt.AlignVCenter
0353
0354 font.pointSize: Maui.Style.fontSizes.tiny
0355
0356 wrapMode: Text.NoWrap
0357 elide: Text.ElideMiddle
0358 textFormat: Text.PlainText
0359 color: _layout.labelColor
0360 opacity: control.isCurrentItem ? 0.8 : 0.6
0361 }
0362
0363 Label
0364 {
0365 id: _label4
0366 visible: text.length > 0
0367
0368 Layout.fillHeight: true
0369 Layout.fillWidth: true
0370
0371 Layout.alignment: Qt.AlignRight
0372 horizontalAlignment: Qt.AlignRight
0373 verticalAlignment: _label3.visible ? Qt.AlignTop : Qt.AlignVCenter
0374
0375 font.pointSize: Maui.Style.fontSizes.tiny
0376
0377 wrapMode: Text.NoWrap
0378 elide: Text.ElideMiddle
0379 textFormat: Text.PlainText
0380 color: _layout.labelColor
0381 opacity: control.isCurrentItem ? 0.8 : 0.6
0382 }
0383 }
0384 }
0385 }