Warning, /maui/mauikit/src/controls.6/ListBrowserDelegate.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 QtQml 0022 0023 import QtQuick.Controls 0024 import QtQuick.Layouts 0025 0026 import org.mauikit.controls 1.3 as Maui 0027 0028 /** 0029 * @inherit ItemDelegate 0030 * @brief A MauiKit ItemDelegate with an informational row layout. 0031 * This controls inherits from MauiKit ItemDelegate, to checkout its inherited properties refer to docs. 0032 * 0033 * @image html Delegates/listbrowserdelegate.png 0034 * @note An example of ListBrowserDelegate in the Index -f ile manager - application. 0035 * 0036 * @section structure Structure 0037 * The ListBrowserDelegate layouts its information horizontally. It's composed of two main sections: the far left icon header, and the text labels at the right side - there are four [4] possible labels. Those sections are all handled by a MauiKit ListItemTemplate control, which is exposed by the alias property `template`. 0038 * @see ListItemTemplate 0039 * @see template 0040 * 0041 * The far left icon section is handled by default by a MauiKit IconItem, which can have an image or icon. Those can be set via the `imageSource` or the `iconSource` properties. 0042 * @see IconItem 0043 * 0044 * The said icon header can also be replaced by any other component using the `template.iconComponent` property. 0045 * 0046 * @section notes Notes 0047 * This control can be `checkable`, and a CheckBox element will be placed on the left side. It also supports features from the Button type, such as the `autoExclusive`, `checked` properties and the press events. 0048 * 0049 * By inheritance this component can be `dragable`. 0050 * 0051 * @note This control is usually used as the delegate component for the ListBrowser or QQC2 ListView. 0052 * 0053 * @subsection dnd Drag & Drop 0054 * To set up the drag and drop, use the Drag attached properties. 0055 * The most relevant part for this control is to set the `Drag.keys` and `Drag.mimeData` 0056 * 0057 * @code 0058 * Drag.keys: ["text/uri-list"] 0059 * Drag.mimeData: Drag.active ? 0060 * { 0061 * "text/uri-list": "" //here a list of file separated by a comma. 0062 * } : {} 0063 * @endcode 0064 * 0065 * @code 0066 * Maui.ListBrowserDelegate 0067 * { 0068 * width: ListView.view.width 0069 * label1.text: "An example delegate." 0070 * label2.text: "Using the MauiKit ListBrowser." 0071 * 0072 * iconSource: "folder" 0073 * } 0074 * @endcode 0075 * 0076 * <a href="https://invent.kde.org/maui/mauikit/-/blob/qt6-2/examples/ListBrowser.qml">You can find a more complete example at this link.</a> 0077 */ 0078 Maui.ItemDelegate 0079 { 0080 id: control 0081 0082 focus: true 0083 0084 radius: Maui.Style.radiusV 0085 0086 flat : !Maui.Handy.isMobile 0087 0088 implicitHeight: _layout.implicitHeight + topPadding + bottomPadding 0089 0090 isCurrentItem : ListView.isCurrentItem || checked 0091 0092 padding: Maui.Style.defaultPadding 0093 spacing: Maui.Style.space.small 0094 0095 /** 0096 * @see ListItemTemplate::content 0097 */ 0098 default property alias content : _template.content 0099 0100 /** 0101 * @see ListItemTemplate::label1 0102 */ 0103 readonly property alias label1 : _template.label1 0104 0105 /** 0106 * @see ListItemTemplate::label2 0107 */ 0108 readonly property alias label2 : _template.label2 0109 0110 /** 0111 * @see ListItemTemplate::label3 0112 */ 0113 readonly property alias label3 : _template.label3 0114 0115 /** 0116 * @see ListItemTemplate::label4 0117 */ 0118 readonly property alias label4 : _template.label4 0119 0120 /** 0121 * @see ListItemTemplate::iconItem 0122 */ 0123 property alias iconItem : _template.iconItem 0124 0125 /** 0126 * @see ListItemTemplate::iconVisible 0127 */ 0128 property alias iconVisible : _template.iconVisible 0129 0130 /** 0131 * @see ListItemTemplate::iconSizeHint 0132 */ 0133 property alias iconSizeHint : _template.iconSizeHint 0134 0135 /** 0136 * @see ListItemTemplate::imageSource 0137 */ 0138 property alias imageSource : _template.imageSource 0139 0140 /** 0141 * @see ListItemTemplate::iconSource 0142 */ 0143 property alias iconSource : _template.iconSource 0144 0145 /** 0146 * @see ListItemTemplate::labelsVisible 0147 */ 0148 property alias showLabel : _template.labelsVisible 0149 0150 /** 0151 * @brief Whether the control is checked or not. 0152 * By default this is set to `false`. 0153 */ 0154 property bool checked : false 0155 0156 /** 0157 * @brief Whether the control should become checkable. If it is checkable a CheckBox element will become visible to allow to toggle between the checked states. 0158 * By default this is set to `false`. 0159 */ 0160 property bool checkable: false 0161 0162 /** 0163 * @brief Whether the control should be auto exclusive, this means that among other related elements - sharing the same parent - only one can be selected/checked at the time. 0164 * By default this is set to `false`. 0165 */ 0166 property bool autoExclusive: false 0167 0168 /** 0169 * @see ListItemTemplate::leftLabels 0170 */ 0171 readonly property alias leftLabels: _template.leftLabels 0172 0173 /** 0174 * @see ListItemTemplate::rightLabels 0175 */ 0176 readonly property alias rightLabels: _template.rightLabels 0177 0178 /** 0179 * @brief An alias to access the ListItemTemplate control properties. This is the template element that layouts all the information: labels and icon/image. 0180 * @see ListItemTemplate 0181 * @property GridItemTemplate ListBrowserDelegate::template. 0182 */ 0183 readonly property alias template : _template 0184 0185 /** 0186 * @see ListItemTemplate::maskRadius 0187 */ 0188 property alias maskRadius : _template.maskRadius 0189 0190 /** 0191 * @brief Whether this element currently contains any item being dragged on top of it. 0192 * @property bool ListBrowserDelegate::containsDrag 0193 */ 0194 readonly property alias containsDrag : _dropArea.containsDrag 0195 0196 /** 0197 * @brief An alias to expose the DropArea component in charge of the drag&drop events. 0198 * @see contentDropped 0199 */ 0200 readonly property alias dropArea : _dropArea 0201 0202 /** 0203 * @brief An alias to access the layout fo this control handled by a RowLayout. 0204 * @property RowLayout ListBrowserDelegate::layout 0205 */ 0206 readonly property alias layout : _layout 0207 0208 /** 0209 * @brief Emitted when a drop event has been triggered on this control. 0210 * @param drop The object with information about the event. 0211 */ 0212 signal contentDropped(var drop) 0213 0214 /** 0215 * @brief Emitted when a drop event has entered the area of this control. 0216 * @param drop The object with information about the event. 0217 */ 0218 signal contentEntered(var drag) 0219 0220 /** 0221 * @brief Emitted when the control checked state has been changed. 0222 * @param state The checked state value. 0223 */ 0224 signal toggled(bool state) 0225 0226 0227 background: Rectangle 0228 { 0229 color: (control.isCurrentItem || control.containsPress ? Maui.Theme.highlightColor : ( control.hovered ? Maui.Theme.hoverColor : (control.flat ? "transparent" : Maui.Theme.alternateBackgroundColor))) 0230 0231 radius: control.radius 0232 0233 Rectangle 0234 { 0235 width: parent.width 0236 height: parent.height 0237 radius: control.radius 0238 visible: control.containsDrag 0239 color: control.Maui.Theme.backgroundColor 0240 border.color: control.Maui.Theme.highlightColor 0241 0242 Behavior on color 0243 { 0244 Maui.ColorTransition{} 0245 } 0246 } 0247 0248 Behavior on color 0249 { 0250 enabled: !control.flat 0251 Maui.ColorTransition{} 0252 } 0253 } 0254 0255 DropArea 0256 { 0257 id: _dropArea 0258 width: parent.width 0259 height: parent.height 0260 enabled: control.draggable 0261 0262 onDropped: (drop) => 0263 { 0264 control.contentDropped(drop) 0265 } 0266 0267 onEntered: (drop) => 0268 { 0269 control.contentEntered(drag) 0270 } 0271 } 0272 0273 RowLayout 0274 { 0275 id: _layout 0276 anchors.fill: parent 0277 spacing: _template.spacing 0278 0279 Loader 0280 { 0281 asynchronous: true 0282 active: control.checkable || control.checked 0283 visible: active 0284 0285 Layout.alignment: Qt.AlignCenter 0286 0287 scale: active? 1 : 0 0288 0289 Behavior on scale 0290 { 0291 NumberAnimation 0292 { 0293 duration: Maui.Style.units.longDuration 0294 easing.type: Easing.InOutQuad 0295 } 0296 } 0297 0298 sourceComponent: CheckBox 0299 { 0300 checkable: control.checkable 0301 autoExclusive: control.autoExclusive 0302 0303 Binding on checked 0304 { 0305 value: control.checked 0306 restoreMode: Binding.RestoreBinding 0307 } 0308 0309 onToggled: control.toggled(checked) 0310 } 0311 } 0312 0313 Maui.ListItemTemplate 0314 { 0315 id: _template 0316 Layout.fillHeight: true 0317 Layout.fillWidth: true 0318 0319 spacing: control.spacing 0320 0321 hovered: control.hovered 0322 isCurrentItem : control.isCurrentItem 0323 highlighted: control.containsPress 0324 } 0325 } 0326 }