ui/views/TileView.qml

0001 /*
0002  *  Copyright 2019 Aditya Mehra <aix.m@outlook.com>
0003  *  Copyright 2019 Marco Martin <mart@kde.org>
0004  *
0005  *  This program is free software; you can redistribute it and/or modify
0006  *  it under the terms of the GNU General Public License as published by
0007  *  the Free Software Foundation; either version 2 of the License, or
0008  *  (at your option) any later version.
0009  *
0010  *  This program is distributed in the hope that it will be useful,
0011  *  but WITHOUT ANY WARRANTY; without even the implied warranty of
0012  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
0013  *  GNU General Public License for more details.
0014  *
0015  *  You should have received a copy of the GNU General Public License
0016  *  along with this program; if not, write to the Free Software
0017  *  Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  2.010-1301, USA.
0018  */
0019
0020 import QtQuick 2.9
0021 import QtQuick.Layouts 1.4
0022 import QtQuick.Window 2.2
0023 import QtGraphicalEffects 1.12
0024 import QtQuick.Controls 2.4 as Controls
0025 import org.kde.kirigami 2.5 as Kirigami
0026
0027 FocusScope {
0028     id: root
0029     signal activated
0030     property string title
0031     property alias view: view
0032     property alias delegate: view.delegate
0033     property alias model: view.model
0034     property alias currentIndex: view.currentIndex
0035     property alias currentItem: view.currentItem
0036     Layout.fillWidth: true
0037
0038     implicitHeight: view.implicitHeight + header.implicitHeight
0039
0040     //TODO:dynamic
0041     property int columns: Math.max(3, Math.floor(width / (Kirigami.Units.gridUnit * 8)))
0042
0043     property alias cellWidth: view.cellWidth
0044     property alias cellHeight: view.cellHeight
0045     readonly property real screenRatio: view.Window.window ? view.Window.window.width / view.Window.window.height : 1.6
0046
0047     property Item navigationUp
0048     property Item navigationDown
0049
0050     Kirigami.Heading {
0051         id: header
0052         anchors {
0053             left: parent.left
0054             right: parent.right
0055             top: parent.top
0056         }
0057         text: title
0058         layer.enabled: true
0059         color: "white"
0060     }
0061
0062     ListView {
0063         id: view
0064         anchors {
0065             left: parent.left
0066             right: parent.right
0067             top: header.baseline
0068             bottom: parent.bottom
0069             topMargin: Kirigami.Units.largeSpacing*2
0070             leftMargin: -Kirigami.Units.largeSpacing
0071         }
0072         focus: true
0073
0074         z: activeFocus ? 10: 1
0075         keyNavigationEnabled: true
0076         //Centering disabled as experiment
0077         //highlightRangeMode: ListView.ApplyRange
0078
0079         //highlightFollowsCurrentItem: true
0080         snapMode: ListView.SnapToItem
0081         cacheBuffer: width
0082         implicitHeight: cellHeight
0083         rightMargin: width-cellWidth
0084         property int cellWidth: parent.width / 3
0085         property int cellHeight: cellWidth + Kirigami.Units.gridUnit * 3
0086 //         preferredHighlightBegin: 0
0087 //         preferredHighlightEnd: cellWidth
0088         displayMarginBeginning: cellWidth
0089         displayMarginEnd: cellWidth
0090
0091        // highlightMoveVelocity: -1
0092        // highlightMoveDuration: Kirigami.Units.longDuration
0093
0094         onContentWidthChanged: if (view.currentIndex === 0) view.contentX = view.originX
0095
0096         onMovementEnded: flickEnded()
0097         onFlickEnded: currentIndex = indexAt(mapToItem(contentItem, cellWidth, 0).x, 0)
0098
0099         spacing: 0
0100         orientation: ListView.Horizontal
0101
0102         move: Transition {
0103             SmoothedAnimation {
0104                 property: "x"
0105                 duration: Kirigami.Units.longDuration
0106             }
0107         }
0108
0109         KeyNavigation.left: root
0110         KeyNavigation.right: root
0111
0112         Keys.onDownPressed:  {
0113             if (!navigationDown) {
0114                 return;
0115             }
0116
0117             if (navigationDown instanceof TileView) {
0118                 navigationDown.currentIndex = Math.min(Math.floor(navigationDown.view.indexAt(navigationDown.view.contentX + cellWidth/2, height/2)) + (view.currentIndex - view.indexAt(view.contentX + cellWidth/2, height/2)), navigationDown.view.count - 1);
0119
0120                 if (navigationDown.currentIndex < 0) {
0121                     navigationDown.currentIndex = view.currentIndex > 0 ? navigationDown.view.count - 1 : 0
0122                 }
0123             }
0124
0125             navigationDown.forceActiveFocus();
0126         }
0127
0128         Keys.onUpPressed:  {
0129             if (!navigationUp) {
0130                 return;
0131             }
0132
0133             if (navigationUp instanceof TileView) {
0134                 navigationUp.currentIndex = Math.min(Math.floor(navigationUp.view.indexAt(navigationUp.view.contentX + cellWidth/2, height/2)) + (view.currentIndex - view.indexAt(view.contentX + cellWidth/2, height/2)), navigationUp.view.count - 1);
0135
0136                 if (navigationUp.currentIndex < 0) {
0137                     navigationUp.currentIndex = view.currentIndex > 0 ? navigationUp.view.count - 1 : 0
0138                 }
0139             }
0140
0141             navigationUp.forceActiveFocus();
0142         }
0143     }
0144 }
0145