src/style.5/ScrollBar.qml

0001 /****************************************************************************
0002 **
0003 ** Copyright (C) 2017 The Qt Company Ltd.
0004 ** Contact: http://www.qt.io/licensing/
0005 **
0006 ** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit.
0007 **
0008 ** $QT_BEGIN_LICENSE:LGPL3$
0009 ** Commercial License Usage
0010 ** Licensees holding valid commercial Qt licenses may use this file in
0011 ** accordance with the commercial license agreement provided with the
0012 ** Software or, alternatively, in accordance with the terms contained in
0013 ** a written agreement between you and The Qt Company. For licensing terms
0014 ** and conditions see http://www.qt.io/terms-conditions. For further
0015 ** information use the contact form at http://www.qt.io/contact-us.
0016 **
0017 ** GNU Lesser General Public License Usage
0018 ** Alternatively, this file may be used under the terms of the GNU Lesser
0019 ** General Public License version 3 as published by the Free Software
0020 ** Foundation and appearing in the file LICENSE.LGPLv3 included in the
0021 ** packaging of this file. Please review the following information to
0022 ** ensure the GNU Lesser General Public License version 3 requirements
0023 ** will be met: https://www.gnu.org/licenses/lgpl.html.
0024 **
0025 ** GNU General Public License Usage
0026 ** Alternatively, this file may be used under the terms of the GNU
0027 ** General Public License version 2.0 or later as published by the Free
0028 ** Software Foundation and appearing in the file LICENSE.GPL included in
0029 ** the packaging of this file. Please review the following information to
0030 ** ensure the GNU General Public License version 2.0 requirements will be
0031 ** met: http://www.gnu.org/licenses/gpl-2.0.html.
0032 **
0033 ** $QT_END_LICENSE$
0034 **
0035 ****************************************************************************/
0036
0037 import QtQuick 2.15
0038 import QtQuick.Templates 2.15 as T
0039 import org.mauikit.controls 1.3 as Maui
0040
0041 T.ScrollBar
0042 {
0043     id: control
0044
0045     implicitWidth: implicitContentWidth + rightPadding + leftPadding
0046     implicitHeight: implicitContentHeight + topPadding + bottomPadding
0047
0048     padding: control.interactive ? 1 : 2
0049     visible: control.policy !== T.ScrollBar.AlwaysOff
0050
0051     minimumSize: orientation == Qt.Horizontal ? height / width : width / height
0052
0053     interactive: !Maui.Handy.isMobile
0054     contentItem: Rectangle
0055     {
0056         implicitWidth: Maui.Style.scrollBarPolicy === Maui.Style.AutoHide ? (_timer.hovered ? 6 : 2 ) : (control.interactive ? 6 : 4 )
0057         implicitHeight: Maui.Style.scrollBarPolicy === Maui.Style.AutoHide ? (_timer.hovered ? 6 : 2 ) : (control.interactive ? 6 : 4 )
0058
0059         radius: Maui.Style.radiusV
0060
0061         color: control.pressed ? Maui.Theme.highlightColor :
0062                control.interactive && control.hovered ? Maui.Theme.highlightColor : (Maui.ColorUtils.linearInterpolation(Maui.Theme.alternateBackgroundColor, Maui.Theme.textColor, 0.2))
0063         opacity: 0.0
0064
0065         Behavior on color
0066         {
0067             Maui.ColorTransition{}
0068         }
0069     }
0070
0071     background: Rectangle
0072     {
0073         radius: Maui.Style.radiusV
0074
0075         color: Maui.Theme.alternateBackgroundColor
0076         opacity: 0.0
0077         visible: Maui.Style.scrollBarPolicy === Maui.Style.AutoHide ? false : control.interactive && control.pressed && control.active
0078     }
0079
0080     states: State {
0081         name: "active"
0082         when: control.policy === T.ScrollBar.AlwaysOn || (control.active && control.size < 1.0)
0083     }
0084
0085     transitions: [
0086         Transition {
0087             to: "active"
0088             NumberAnimation { targets: [control.contentItem, control.background]; property: "opacity"; to: 1.0 }
0089         },
0090         Transition {
0091             from: "active"
0092             SequentialAnimation {
0093                 PropertyAction{ targets: [control.contentItem, control.background]; property: "opacity"; value: 1.0 }
0094                 PauseAnimation { duration: 2450 }
0095                 NumberAnimation { targets: [control.contentItem, control.background]; property: "opacity"; to: 0.0 }
0096             }
0097         }
0098     ]
0099
0100     readonly property bool isActive : control.hovered || control.pressed || control.active
0101
0102     onIsActiveChanged:
0103     {
0104         if(!control.isActive)
0105         _timer.start()
0106         else
0107         {
0108             _timer.hovered = true
0109         }
0110     }
0111
0112     Timer
0113     {
0114         id: _timer
0115         interval: 2800
0116         repeat: false
0117
0118         property bool hovered: false
0119         onTriggered:
0120         {
0121             if(control.hovered || control.pressed || control.active)
0122                 return;
0123
0124            _timer.hovered = false
0125         }
0126     }
0127 }