Fix change_fit_action shortcut regression

YACReaderLibrary/qml/GridComicsView.qml

@@ -0,0 +1,494 @@
+import QtQuick 2.3
+
+import QtQuick.Controls 1.2
+import comicModel 1.0
+import QtGraphicalEffects 1.0
+
+Rectangle {
+    id: main
+    clip: true
+
+    Image {
+        id: backgroundImg
+        anchors.fill: parent
+        source: backgroundImage
+        fillMode: Image.PreserveAspectCrop
+        smooth: true
+        mipmap: true
+        asynchronous : true
+        cache: false //TODO clear cache only when it is needed
+        opacity: 0
+        visible: false
+    }
+
+    FastBlur {
+        anchors.fill: backgroundImg
+        source: backgroundImg
+        radius: backgroundBlurRadius
+        opacity: backgroundBlurOpacity
+        visible: backgroundBlurVisible
+    }
+
+    color: backgroundColor
+    width: parent.width
+    height: parent.height
+    anchors.margins: 0
+
+    function selectAll(from,to)
+    {
+        for(var i = from;i<=to;i++)
+        {
+            comicsSelectionHelper.selectIndex(i);
+        }
+    }
+
+    Component {
+        id: appDelegate
+        Rectangle
+        {
+            id: cell
+            width: grid.cellWidth
+            height: grid.cellHeight
+            color: "#00000000"
+
+
+            Rectangle {
+                id: realCell
+
+                property int position : 0
+                property bool dragging: false;
+                Drag.active: mouseArea.drag.active
+                Drag.hotSpot.x: 32
+                Drag.hotSpot.y: 32
+                Drag.dragType: Drag.Automatic
+                //Drag.mimeData: { "x": 1 }
+                Drag.proposedAction: Qt.CopyAction
+                Drag.onActiveChanged: {
+                    if(!dragging)
+                    {
+                        dragManager.startDrag();
+                        dragging = true;
+                    }else
+                        dragging = false;
+                }
+
+                width: itemWidth
+                height: itemHeight
+
+                color: ((dummyValue || !dummyValue) && comicsSelectionHelper.isSelectedIndex(index))?selectedColor:cellColor;
+                border.color: ((dummyValue || !dummyValue) && comicsSelectionHelper.isSelectedIndex(index))?selectedBorderColor:borderColor;
+                border.width: (Qt.platform.os === "osx")?1:0;
+                anchors.horizontalCenter: parent.horizontalCenter
+
+                MouseArea  {
+                    id: mouseArea
+                    drag.target: realCell
+
+                    drag.minimumX: 0
+                    drag.maximumX: 0
+                    drag.minimumY: 0
+                    drag.maximumY: 0
+
+                    anchors.fill: parent
+                    acceptedButtons: Qt.LeftButton | Qt.RightButton
+
+                    onDoubleClicked: {
+                        comicsSelectionHelper.clear();
+
+                        comicsSelectionHelper.selectIndex(index);
+                        grid.currentIndex = index;
+                        comicsSelectionHelper.selectedItem(index);
+                    }
+
+                    onPressed: {
+
+                        var ci = grid.currentIndex; //save current index
+
+                        /*if(mouse.button != Qt.RightButton && !(mouse.modifiers & Qt.ControlModifier || mouse.modifiers & Qt.ShiftModifier))
+                        {
+                            if(!comicsSelectionHelper.isSelectedIndex(index))
+                                comicsSelectionHelper.clear();
+                        }*/
+
+                        if(mouse.modifiers & Qt.ShiftModifier)
+                            if(index < ci)
+                            {
+                                selectAll(index,ci);
+                                grid.currentIndex = index;
+                            }
+                            else if (index > ci)
+                            {
+                                selectAll(ci,index);
+                                grid.currentIndex = index;
+                            }
+
+                        mouse.accepted = true;
+
+                        if(mouse.button == Qt.RightButton) // context menu is requested
+                        {
+
+                            if(!comicsSelectionHelper.isSelectedIndex(index)) //the context menu is requested outside the current selection, the selection will be
+                            {
+                                comicsSelectionHelper.setCurrentIndex(index)
+                                grid.currentIndex = index;
+                            }
+
+                            var coordinates = main.mapFromItem(realCell,mouseX,mouseY)
+                            contextMenuHelper.requestedContextMenu(Qt.point(coordinates.x,coordinates.y));
+
+                        } else //left button
+                        {
+
+                            if(mouse.modifiers & Qt.ControlModifier)
+                            {
+                                if(comicsSelectionHelper.isSelectedIndex(index))
+                                {
+                                    if(comicsSelectionHelper.numItemsSelected()>1)
+                                    {
+                                        comicsSelectionHelper.deselectIndex(index);
+                                        if(grid.currentIndex === index)
+                                           grid.currentIndex = comicsSelectionHelper.lastSelectedIndex();
+                                    }
+                                }
+                                else
+                                {
+                                    comicsSelectionHelper.selectIndex(index);
+                                    grid.currentIndex = index;
+                                }
+                            }
+
+                            if(mouse.button != Qt.RightButton && !(mouse.modifiers & Qt.ControlModifier || mouse.modifiers & Qt.ShiftModifier)) //just left button click
+                            {
+                                if(comicsSelectionHelper.isSelectedIndex(index)) //the context menu is requested outside the current selection, the selection will be
+                                {
+
+                                }
+                                else
+                                {
+                                    comicsSelectionHelper.setCurrentIndex(index)
+                                }
+
+                                grid.currentIndex = index;
+                            }
+                        }
+
+                    }
+
+                    onReleased: {
+                        if(mouse.button == Qt.LeftButton && !(mouse.modifiers & Qt.ControlModifier || mouse.modifiers & Qt.ShiftModifier))
+                        {
+                            if(comicsSelectionHelper.isSelectedIndex(index))
+                            {
+                                comicsSelectionHelper.setCurrentIndex(index)
+                                grid.currentIndex = index;
+                            }
+                        }
+                    }
+                }
+            }
+
+            /**/
+
+            //cover
+            Image {
+                id: coverElement
+                width: coverWidth
+                height: coverHeight
+                anchors {horizontalCenter: parent.horizontalCenter; top: realCell.top; topMargin: 0}
+                source: cover_path
+                fillMode: Image.PreserveAspectCrop
+                smooth: true
+                mipmap: true
+                asynchronous : true
+                cache: false //TODO clear cache only when it is needed
+
+            }
+
+            //border
+            Rectangle {
+                width: coverElement.width
+                height: coverElement.height
+                anchors {horizontalCenter: parent.horizontalCenter; top: realCell.top; topMargin: 0}
+                color: "transparent"
+                border {
+                    color: "#20FFFFFF"
+                    width: 1
+                }
+            }
+
+            //mark
+            Image {
+                id: mark
+                width: 23
+                height: 23
+                source: read_column&&show_marks?"tick.png":has_been_opened&&show_marks?"reading.png":""
+                anchors {right: coverElement.right; top: coverElement.top; topMargin: 9; rightMargin: 9}
+                asynchronous : true
+            }
+
+            //title
+            Text {
+                id : titleText
+                anchors { top: coverElement.bottom; left: realCell.left; leftMargin: 4; rightMargin: 4; topMargin: 4; }
+                width: itemWidth - 8
+                maximumLineCount: 2
+                wrapMode: Text.WordWrap
+                text: title
+                elide: Text.ElideRight
+                color: titleColor
+                clip: true
+                font.letterSpacing: fontSpacing
+                font.pointSize: fontSize
+                font.family: fontFamily
+            }
+
+            //number
+            Text {
+                anchors {bottom: realCell.bottom; left: realCell.left; margins: 4}
+                text: number?"<b>#</b>"+number:""
+                color: textColor
+                font.letterSpacing: fontSpacing
+                font.pointSize: fontSize
+                font.family: fontFamily
+            }
+
+            //page icon
+            Image {
+                id: pageImage
+                anchors {bottom: realCell.bottom; right: realCell.right; bottomMargin: 5; rightMargin: 4; leftMargin: 4}
+                source: "page.png"
+                width: 8
+                height: 10
+            }
+
+            //numPages
+            Text {
+                id: pages
+                anchors {bottom: realCell.bottom; right: pageImage.left; margins: 4}
+                text: has_been_opened?current_page+"/"+num_pages:num_pages
+                color: textColor
+                font.letterSpacing: fontSpacing
+                font.pointSize: fontSize
+                font.family: fontFamily
+            }
+
+            //rating icon
+            Image {
+                id: ratingImage
+                anchors {bottom: realCell.bottom; right: pageImage.left; bottomMargin: 5; rightMargin: Math.floor(pages.width)+12}
+                source: "star.png"
+                width: 13
+                height: 11
+
+                MouseArea  {
+                    anchors.fill: parent
+                    onClicked: {
+                        console.log("rating");
+                        comicsSelectionHelper.clear();
+                        comicsSelectionHelper.selectIndex(index);
+                        grid.currentIndex = index;
+                        ratingConextMenu.popup();
+
+                    }
+                }
+
+                Menu {
+                    id: ratingConextMenu
+                    MenuItem { text: "1"; enabled: true; iconSource:"star_menu.png"; onTriggered: comicRatingHelper.rate(index,1) }
+                    MenuItem { text: "2"; enabled: true; iconSource:"star_menu.png"; onTriggered: comicRatingHelper.rate(index,2) }
+                    MenuItem { text: "3"; enabled: true; iconSource:"star_menu.png"; onTriggered: comicRatingHelper.rate(index,3) }
+                    MenuItem { text: "4"; enabled: true; iconSource:"star_menu.png"; onTriggered: comicRatingHelper.rate(index,4) }
+                    MenuItem { text: "5"; enabled: true; iconSource:"star_menu.png"; onTriggered: comicRatingHelper.rate(index,5) }
+
+                }
+            }
+
+            //comic rating
+            Text {
+                id: comicRating
+                anchors {bottom: realCell.bottom; right: ratingImage.left; margins: 4}
+                text: rating>0?rating:"-"
+                color: textColor
+            }
+        }
+    }
+
+    YACReaderScrollView {
+        __wheelAreaScrollSpeed: grid.cellHeight * 0.30
+        id: scrollView
+        anchors.fill: parent
+        anchors.margins: 0
+        //QTBUG-39453
+        //Another fu%$·#& bug in Qt
+        //https://bugreports.qt.io/browse/QTBUG-39453
+        //To solve this I am going to accept any input drag, drops will be filtered in "onDropped"
+        DropArea {
+            anchors.fill: parent
+
+            /*
+            onEntered: {
+                console.log("onEntered");
+                if(drag.hasUrls)
+                {
+                    console.log("HAS URLS -> ", drag.urls);
+                    if(dropManager.canDropUrls(drag.urls, drag.action))
+                    {
+                        drag.accepted = true;
+                        console.log("canDropUrls");
+                    }else
+                        drag.accepted = false;
+                }
+                else if (dropManager.canDropFormats(drag.formats)) {
+                    drag.accepted = true;
+                    console.log("canDropFormats");
+                } else
+                    drag.accepted = false;
+            }*/
+
+
+            onDropped: {
+                if(drop.hasUrls && dropManager.canDropUrls(drop.urls, drop.action))
+                {
+                    dropManager.droppedFiles(drop.urls, drop.action);
+                }
+                else{
+                    if (dropManager.canDropFormats(drop.formats))
+                    {
+                        var destItem = grid.itemAt(drop.x,drop.y + grid.contentY);
+                        var destLocalX = grid.mapToItem(destItem,drop.x,drop.y + grid.contentY).x
+                        var realIndex = grid.indexAt(drop.x,drop.y + grid.contentY);
+
+                        if(realIndex === -1)
+                            realIndex = grid.count - 1;
+
+                        var destIndex = destLocalX < (grid.cellWidth / 2) ? realIndex : realIndex + 1;
+                        dropManager.droppedComicsForResortingAt(drop.getDataAsString(), destIndex);
+                    }
+                }
+            }
+        }
+
+        GridView {
+            id:grid
+            objectName: "grid"
+            anchors.fill: parent
+            cellHeight: cellCustomHeight
+            //highlight: appHighlight
+            focus: true
+            model: comicsList
+            delegate: appDelegate
+            anchors.topMargin: 20
+            anchors.bottomMargin: 20
+            anchors.leftMargin: 10
+            anchors.rightMargin: 10
+            pixelAligned: true
+            //flickDeceleration: -2000
+            snapMode: GridView.SnapToRow
+            currentIndex: 0
+            cacheBuffer: 0
+
+            footer: Rectangle { //fix for the scroll issue, TODO find what causes the issue (some times the bottoms cells are hidden for the toolbar, no full scroll)
+                height : 25
+                width : parent.width
+                color : "#00000000"
+            }
+
+            move: Transition {
+                NumberAnimation { properties: "x,y"; duration: 250 }
+            }
+
+            moveDisplaced: Transition {
+                NumberAnimation { properties: "x,y"; duration: 250 }
+            }
+
+            remove: Transition {
+                ParallelAnimation {
+                    NumberAnimation { property: "opacity"; to: 0; duration: 250 }
+
+                }
+            }
+
+            removeDisplaced: Transition {
+                NumberAnimation { properties: "x,y"; duration: 250 }
+            }
+
+
+
+            displaced: Transition {
+                NumberAnimation { properties: "x,y"; duration: 250 }
+            }
+
+            function numCellsPerRow() {
+                return Math.floor(width / cellCustomWidth);
+            }
+
+           onWidthChanged: {
+                calculateCellWidths(cellCustomWidth);
+            }
+
+           function calculateCellWidths(cWidth) {
+
+               var wholeCells = Math.floor(width / cWidth);
+               var rest = width - (cWidth * wholeCells)
+
+               grid.cellWidth = cWidth + Math.floor(rest / wholeCells);
+               //console.log("cWidth",cWidth,"wholeCells=",wholeCells,"rest=",rest,"cellWidth=",cellWidth,"width=",width);
+           }
+        }
+
+        focus: true
+        Keys.onPressed: {
+            if (event.modifiers & Qt.ControlModifier || event.modifiers & Qt.ShiftModifier)
+                return;
+            var numCells = grid.numCellsPerRow();
+            var ci
+            if (event.key === Qt.Key_Right) {
+                ci = Math.min(grid.currentIndex+1,grid.count);
+            }
+            else if (event.key === Qt.Key_Left) {
+                ci = Math.max(0,grid.currentIndex-1);
+            }
+            else if (event.key === Qt.Key_Up) {
+                ci = Math.max(0,grid.currentIndex-numCells);
+            }
+            else if (event.key === Qt.Key_Down) {
+                ci = Math.min(grid.currentIndex+numCells,grid.count);
+            }
+
+            event.accepted = true;
+            //var ci = grid.currentIndex;
+            grid.currentIndex = -1
+            comicsSelectionHelper.clear();
+            comicsSelectionHelper.setCurrentIndex(ci);
+            grid.currentIndex = ci;
+        }
+        //}
+
+        /*MouseArea {
+        anchors.fill: parent
+        onClicked: {
+                        clicked.accepted = false;
+            console.log("xx");
+        }
+
+        onWheel: {
+            var newValue =  Math.max(0,scrollView.flickableItem.contentY - wheel.angleDelta.y)
+            scrollView.flickableItem.contentY = newValue
+
+        }
+    }*/
+        /*ScrollBar {
+        flickable: grid;
+    }
+
+    PerformanceMeter {
+        anchors {top: parent.top; left: parent.left; margins: 4}
+        id: performanceMeter
+        width: 128
+        height: 64
+        enabled: (dummyValue || !dummyValue)
+    }*/
+    }
+}
+
+

YACReaderLibrary/qml/YACReaderScrollView.qml

@@ -0,0 +1,353 @@
+/****************************************************************************
+**
+** Copyright (C) 2015 The Qt Company Ltd.
+** Contact: http://www.qt.io/licensing/
+**
+** This file is part of the Qt Quick Controls module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL3$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see http://www.qt.io/terms-conditions. For further
+** information use the contact form at http://www.qt.io/contact-us.
+**
+** GNU Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 3 as published by the Free Software
+** Foundation and appearing in the file LICENSE.LGPLv3 included in the
+** packaging of this file. Please review the following information to
+** ensure the GNU Lesser General Public License version 3 requirements
+** will be met: https://www.gnu.org/licenses/lgpl.html.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 2.0 or later as published by the Free
+** Software Foundation and appearing in the file LICENSE.GPL included in
+** the packaging of this file. Please review the following information to
+** ensure the GNU General Public License version 2.0 requirements will be
+** met: http://www.gnu.org/licenses/gpl-2.0.html.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Private 1.0
+import QtQuick.Controls.Styles 1.1
+
+/*!
+    \qmltype ScrollView
+    \inqmlmodule QtQuick.Controls
+    \since  5.1
+    \ingroup views
+    \brief Provides a scrolling view within another Item.
+
+    \image scrollview.png
+
+    A ScrollView can be used either to replace a \l Flickable or decorate an
+    existing \l Flickable. Depending on the platform, it will add scroll bars and
+    a content frame.
+
+    Only one Item can be a direct child of the ScrollView and the child is implicitly anchored
+    to fill the scroll view.
+
+    Example:
+    \code
+    ScrollView {
+        Image { source: "largeImage.png" }
+    }
+    \endcode
+
+    In the previous example the Image item will implicitly get scroll behavior as if it was
+    used within a \l Flickable. The width and height of the child item will be used to
+    define the size of the content area.
+
+    Example:
+    \code
+    ScrollView {
+        ListView {
+            ...
+        }
+    }
+    \endcode
+
+    In this case the content size of the ScrollView will simply mirror that of its contained
+    \l flickableItem.
+
+    You can create a custom appearance for a ScrollView by
+    assigning a \l {ScrollViewStyle}.
+*/
+
+FocusScope {
+    id: root
+
+    implicitWidth: 240
+    implicitHeight: 150
+
+    /*!
+        This property tells the ScrollView if it should render
+        a frame around its content.
+
+        The default value is \c false.
+    */
+    property bool frameVisible: false
+
+    /*! \qmlproperty enumeration ScrollView::horizontalScrollBarPolicy
+        \since QtQuick.Controls 1.3
+
+        This property holds the policy for showing the horizontal scrollbar.
+        It can be any of the following values:
+        \list
+        \li Qt.ScrollBarAsNeeded
+        \li Qt.ScrollBarAlwaysOff
+        \li Qt.ScrollBarAlwaysOn
+        \endlist
+
+        The default policy is \c Qt.ScrollBarAsNeeded.
+     */
+    property alias horizontalScrollBarPolicy: scroller.horizontalScrollBarPolicy
+
+    /*! \qmlproperty enumeration ScrollView::verticalScrollBarPolicy
+        \since QtQuick.Controls 1.3
+
+        This property holds the policy for showing the vertical scrollbar.
+        It can be any of the following values:
+        \list
+        \li Qt.ScrollBarAsNeeded
+        \li Qt.ScrollBarAlwaysOff
+        \li Qt.ScrollBarAlwaysOn
+        \endlist
+
+        The default policy is \c Qt.ScrollBarAsNeeded.
+     */
+    property alias verticalScrollBarPolicy: scroller.verticalScrollBarPolicy
+
+    /*!
+        This property controls if there should be a highlight
+        around the frame when the ScrollView has input focus.
+
+        The default value is \c false.
+
+        \note This property is only applicable on some platforms, such
+        as Mac OS.
+    */
+    property bool highlightOnFocus: false
+
+    /*!
+        \qmlproperty Item ScrollView::viewport
+
+        The viewport determines the current "window" on the contentItem.
+        In other words, it clips it and the size of the viewport tells you
+        how much of the content area is visible.
+    */
+    property alias viewport: viewportItem
+
+    /*!
+        \qmlproperty Item ScrollView::flickableItem
+
+        The flickableItem of the ScrollView. If the contentItem provided
+        to the ScrollView is a Flickable, it will be the \l contentItem.
+    */
+    readonly property alias flickableItem: internal.flickableItem
+
+    /*!
+        The contentItem of the ScrollView. This is set by the user.
+
+        Note that the definition of contentItem is somewhat different to that
+        of a Flickable, where the contentItem is implicitly created.
+    */
+    default property Item contentItem
+
+    /*! \internal */
+    property Item __scroller: scroller
+    /*! \internal */
+    property alias __wheelAreaScrollSpeed: wheelArea.scrollSpeed
+    /*! \internal */
+    property int __scrollBarTopMargin: 0
+    /*! \internal */
+    property int __viewTopMargin: 0
+    /*! \internal */
+    property alias __horizontalScrollBar: scroller.horizontalScrollBar
+    /*! \internal */
+    property alias __verticalScrollBar: scroller.verticalScrollBar
+    /*! \qmlproperty Component ScrollView::style
+
+        The style Component for this control.
+        \sa {Qt Quick Controls Styles QML Types}
+
+    */
+    property Component style: Settings.styleComponent(Settings.style, "ScrollViewStyle.qml", root)
+
+    /*! \internal */
+    property Style __style: styleLoader.item
+
+    activeFocusOnTab: true
+
+    onContentItemChanged: {
+
+        if (contentItem.hasOwnProperty("contentY") && // Check if flickable
+                contentItem.hasOwnProperty("contentHeight")) {
+            internal.flickableItem = contentItem // "Use content if it is a flickable
+            internal.flickableItem.parent = viewportItem
+        } else {
+            internal.flickableItem = flickableComponent.createObject(viewportItem)
+            contentItem.parent = internal.flickableItem.contentItem
+        }
+        internal.flickableItem.anchors.fill = viewportItem
+        if (!Settings.hasTouchScreen)
+            internal.flickableItem.interactive = false
+    }
+
+
+    children: Item {
+        id: internal
+
+        property Flickable flickableItem
+
+        Loader {
+            id: styleLoader
+            sourceComponent: style
+            onStatusChanged: {
+                if (status === Loader.Error)
+                    console.error("Failed to load Style for", root)
+            }
+            property alias __control: root
+        }
+
+        Binding {
+            target: flickableItem
+            property: "contentHeight"
+            when: contentItem !== flickableItem
+            value: contentItem ? contentItem.height : 0
+        }
+
+        Binding {
+            target: flickableItem
+            when: contentItem !== flickableItem
+            property: "contentWidth"
+            value: contentItem ? contentItem.width : 0
+        }
+
+        Connections {
+            target: flickableItem
+
+            onContentYChanged:  {
+                scroller.blockUpdates = true
+                scroller.verticalScrollBar.value = flickableItem.contentY
+                scroller.blockUpdates = false
+            }
+
+            onContentXChanged:  {
+                scroller.blockUpdates = true
+                scroller.horizontalScrollBar.value = flickableItem.contentX
+                scroller.blockUpdates = false
+            }
+
+        }
+
+        anchors.fill: parent
+
+        Component {
+            id: flickableComponent
+            Flickable {}
+        }
+
+        WheelArea {
+            id: wheelArea
+            parent: flickableItem
+            z: -1
+            // ### Note this is needed due to broken mousewheel behavior in Flickable.
+
+            anchors.fill: parent
+
+            property int acceleration: 40
+            property int flickThreshold: Settings.dragThreshold
+            property real speedThreshold: 3
+            property real ignored: 0.001 // ## flick() does not work with 0 yVelocity
+            property int maxFlick: 400
+
+            property bool horizontalRecursionGuard: false
+            property bool verticalRecursionGuard: false
+
+            horizontalMinimumValue: flickableItem ? flickableItem.originX : 0
+            horizontalMaximumValue: flickableItem ? flickableItem.originX + flickableItem.contentWidth - viewport.width : 0
+
+            verticalMinimumValue: flickableItem ? flickableItem.originY : 0
+            verticalMaximumValue: flickableItem ? flickableItem.originY + flickableItem.contentHeight - viewport.height + __viewTopMargin : 0
+
+            // The default scroll speed for typical angle-based mouse wheels. The value
+            // comes originally from QTextEdit, which sets 20px steps by default, as well as
+            // QQuickWheelArea.
+            // TODO: centralize somewhere, QPlatformTheme?
+            scrollSpeed: 20 * (__style.__wheelScrollLines || 1)
+
+            Connections {
+                target: flickableItem
+
+                onContentYChanged: {
+                    wheelArea.verticalRecursionGuard = true
+                    wheelArea.verticalValue = flickableItem.contentY
+                    wheelArea.verticalRecursionGuard = false
+                }
+                onContentXChanged: {
+                    wheelArea.horizontalRecursionGuard = true
+                    wheelArea.horizontalValue = flickableItem.contentX
+                    wheelArea.horizontalRecursionGuard = false
+                }
+            }
+
+            onVerticalValueChanged: {
+                if (!verticalRecursionGuard) {
+                    if (flickableItem.contentY < flickThreshold && verticalDelta > speedThreshold) {
+                        flickableItem.flick(ignored, Math.min(maxFlick, acceleration * verticalDelta))
+                    } else if (flickableItem.contentY > flickableItem.contentHeight
+                               - flickThreshold - viewport.height && verticalDelta < -speedThreshold) {
+                        flickableItem.flick(ignored, Math.max(-maxFlick, acceleration * verticalDelta))
+                    } else {
+                        flickableItem.contentY = verticalValue
+                    }
+                    flickableItem.contentY = Math.min(verticalMaximumValue, Math.max(0, flickableItem.contentY));
+                }
+            }
+
+            onHorizontalValueChanged: {
+                if (!horizontalRecursionGuard)
+                    flickableItem.contentX = horizontalValue
+            }
+        }
+
+        ScrollViewHelper {
+            id: scroller
+            anchors.fill: parent
+            active: wheelArea.active
+            property bool outerFrame: !frameVisible || !(__style ? __style.__externalScrollBars : 0)
+            property int scrollBarSpacing: outerFrame ? 0 : (__style ? __style.__scrollBarSpacing : 0)
+            property int verticalScrollbarOffset: verticalScrollBar.visible && !verticalScrollBar.isTransient ?
+                                                      verticalScrollBar.width + scrollBarSpacing : 0
+            property int horizontalScrollbarOffset: horizontalScrollBar.visible && !horizontalScrollBar.isTransient ?
+                                                        horizontalScrollBar.height + scrollBarSpacing : 0
+            Loader {
+                id: frameLoader
+                sourceComponent: __style ? __style.frame : null
+                anchors.fill: parent
+                anchors.rightMargin: scroller.outerFrame ? 0 : scroller.verticalScrollbarOffset
+                anchors.bottomMargin: scroller.outerFrame ? 0 : scroller.horizontalScrollbarOffset
+            }
+
+            Item {
+                id: viewportItem
+                anchors.fill: frameLoader
+                anchors.topMargin: frameVisible ? __style.padding.top : 0
+                anchors.leftMargin: frameVisible ? __style.padding.left : 0
+                anchors.rightMargin:  (frameVisible ? __style.padding.right : 0) +  (scroller.outerFrame ? scroller.verticalScrollbarOffset : 0)
+                anchors.bottomMargin: (frameVisible ? __style.padding.bottom : 0) + (scroller.outerFrame ? scroller.horizontalScrollbarOffset : 0)
+                clip: true
+            }
+        }
+        FocusFrame { visible: highlightOnFocus && root.activeFocus }
+    }
+}