Warning, /maui/mauikit/src/controls.6/IconItem.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.Controls
0022 import Qt5Compat.GraphicalEffects
0023 
0024 import org.mauikit.controls 1.3 as Maui
0025 
0026 /**
0027  * @inherit QtQuick.Item
0028  *    @since org.mauikit.controls 1.0
0029  *    @brief An element to display an icon from the icon theme or file asset; or an image from a local file or a remote URL.
0030  *        
0031  *    <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>   
0032  *    
0033  *    @note The image can be masked to have a rounded borders.
0034  *    @see maskRadius
0035  * 
0036  *    @image html Misc/iconitem.png
0037  *    
0038  *    @code 
0039  *    Row
0040  *    {
0041  *        anchors.centerIn: parent
0042  *        spacing: Maui.Style.space.big
0043  * 
0044  *        Maui.IconItem
0045  *        {
0046  *            imageSource: "file:///home/camiloh/Downloads/premium_photo-1664203068007-52240d0ca48f.avif"
0047  *            imageSizeHint: 200
0048  *            maskRadius: 100
0049  *            fillMode: Image.PreserveAspectCrop
0050  * 
0051  *        }
0052  * 
0053  *        Maui.IconItem
0054  *        {
0055  *            iconSource: "vvave"
0056  *            iconSizeHint: 94
0057  *        }
0058  *    }
0059  *    @endcode  
0060  *    
0061  *    @section notes Notes
0062  *    
0063  *    By default this item is only visible if the image source is ready or if the icon is valid. You can make it always visible, but would be a better idea to set a fallback icon with `icon.fallback: "icon-name"`.
0064  * 
0065  *    <a href="https://invent.kde.org/maui/mauikit/-/blob/qt6-2/examples/SideBarView.qml">You can find a more complete example at this link.</a>
0066  */
0067 Item
0068 {
0069     id: control
0070     
0071     visible: icon.valid || img.status === Image.Ready
0072     
0073     implicitHeight: visible ? Math.max(iconSizeHint, imageSizeHint) : 0
0074     implicitWidth: implicitHeight
0075     
0076     smooth: true
0077     
0078     /**
0079      * @brief Whether the control should be styled as being highlighted by some external event.
0080      * By default this is set to `false`.
0081      * @note When highlighted a monochromatic icon will take the color fo the accent color.
0082      */
0083     property bool highlighted: false
0084     
0085     /**
0086      * @brief Whether the control should be styled as being hovered by a cursor.
0087      * By default his is set to `false`.
0088      */
0089     property bool hovered: false
0090     
0091     /**
0092      * @brief A hint for the size of the icon. It will never be larger than the actual container size. 
0093      * @note If the container size is 200x200, and the icon size hint has been set to 64, then the icon will be centered. If the icon size hint is larger, then the maximum value will be the container size.
0094      * 
0095      * By default this is set to `Style.iconSizes.big`.
0096      */
0097     property int iconSizeHint : Maui.Style.iconSizes.big
0098     
0099     /**
0100      * @brief A hint for the size of the image. It will never be larger than the actual container size. 
0101      * @note If the container size is 200x200, and the image size hint has been set to 140, then the image will be aligned following the `alignment` property. If the image size hint is larger, then the maximum value will be the container size.
0102      * @see alignment
0103      * 
0104      * By default this is set to `-1`, which means the image will fill the container size..
0105      */
0106     property int imageSizeHint : -1    
0107     
0108     /**
0109      * @brief The local or remote file URL of the image to be used.
0110      * @property string IconItem::imageSource
0111      */
0112     property alias imageSource : img.source
0113     
0114     /**
0115      * @brief The name of the icon to be used.
0116      * @property string IconItem::iconSource
0117      */
0118     property alias iconSource : icon.source
0119     
0120     /**
0121      * @brief The preferred fill mode for the image.
0122      * By default this is set to `Image.PreserveAspectFit`.
0123      * @note For more options and information review the QQC2 Image documentation.
0124      * @property enum IconItem::fillMode
0125      */
0126     property alias fillMode : img.fillMode
0127     
0128     /**
0129      * @brief The border radius to mask the icon/image header section.
0130      * By default this is set to `0`.
0131      */
0132     property int maskRadius: 0
0133     
0134     /**
0135      * @brief The painted width size of the image. This will make the image resolution fit this size.
0136      * By default this is set to `-1`, which means that the image will be loaded with its original resolution size.
0137      */
0138     property int imageWidth : -1
0139     
0140     /**
0141      * @brief The painted height size of the image. This will make the image resolution fit this size.
0142      * By default this is set to `-1`, which means that the image will be loaded with its original resolution size.
0143      */
0144     property int imageHeight : -1    
0145     
0146     /**
0147      * @brief Whether the icon should be masked and tinted with the text color, this is used for monochromatic icons. If you plan to use a colorful icon, consider setting this property to `false`.
0148      */
0149     property alias isMask : icon.isMask
0150     
0151     /**
0152      * @brief An alias to the QQC2 Image control for displaying the image.
0153      * @note Review the control own properties on Qt documentation.
0154      * @property Image IconItem::image
0155      */
0156     property alias image : img
0157     
0158     /**
0159      * @brief An alias to the MauiKit Icon control for displaying the icon.
0160      * @see Icon
0161      * @property Icon IconItem::icon
0162      */
0163     property alias icon: icon
0164     
0165     /**
0166      * @brief The desired color for tinting the monochromatic icons. 
0167      * By default this is set to check the `isMask` property, and then decide base on the `highlighted` property is use the text color or accent color.
0168      */
0169     property color color : isMask ? (control.highlighted ? Maui.Theme.highlightedTextColor : Maui.Theme.textColor) : "transparent"
0170     
0171     /**
0172      * @brief The aligment of the image in the container.
0173      * If the `imageSizeHint` has been set to a smaller size than the container, then its alignment will be dtermined by this property. Otherwise the image will fill the container size.
0174      * By default this is set to `Qt.AlignHCenter`.
0175      * Possible values are:
0176      * - Qt.AlignLeft
0177      * - Qt.AlignRight
0178      * - Qt.AlignHCenter
0179      */
0180     property int alignment: Qt.AlignHCenter
0181     
0182     Maui.Icon
0183     {
0184         id: icon
0185         smooth: control.smooth
0186         anchors.centerIn: parent
0187         height: valid ? Math.floor(Math.min(parent.height, control.iconSizeHint)) : 0
0188         width: height
0189         color: control.color
0190         isMask: (height <= Maui.Style.iconSizes.medium)
0191     }
0192     
0193     Image
0194     {
0195         id: img        
0196         
0197         width: Math.min(imageSizeHint >=0  ? imageSizeHint : parent.width, parent.width)
0198         height: Math.min(imageSizeHint >= 0 ? imageSizeHint : parent.height, parent.height) 
0199         
0200         anchors.verticalCenter: parent.verticalCenter
0201         x: switch(control.alignment)
0202         {
0203             case Qt.AlignLeft: return 0
0204             case Qt.AlignHCenter: return control.width/2 - width/2
0205             case Qt.AlignRight: return control.width - width
0206         }
0207         
0208         sourceSize.width: (control.imageWidth > -1 ? control.imageWidth : width)
0209         sourceSize.height: (control.imageHeight > -1 ? control.imageHeight : height)
0210         
0211         horizontalAlignment: Qt.AlignHCenter
0212         verticalAlignment: Qt.AlignVCenter
0213                 
0214         cache: true
0215         asynchronous: true
0216         smooth: control.smooth
0217         mipmap: false
0218         
0219         layer.enabled: control.maskRadius
0220         layer.effect: OpacityMask
0221         {
0222             maskSource: Item
0223             {
0224                 width: img.width
0225                 height: img.height
0226                 
0227                 Rectangle
0228                 {
0229                     anchors.centerIn: parent
0230                     width: Math.min(parent.width, img.paintedWidth)
0231                     height: Math.min(parent.height, img.paintedHeight)
0232                     radius: control.maskRadius
0233                 }
0234             }
0235         }
0236     }
0237 }