import QtQuick 2.0 Rectangle { id: root width: 1200 height: 200 property real itemWidth: 100 PinchArea { anchors.fill: parent pinch.minimumScale: 0.1 pinch.maximumScale: 10 property real origWidth property real origCenter onPinchStarted: { origWidth = root.itemWidth; origCenter = flick.contentX + pinch.center.x } onPinchUpdated: { var newWidth = origWidth / pinch.scale; var scaleOffsetLeft = (origWidth - newWidth) * origCenter / flick.width; //var scaleOffsetRight = (origWidth - newWidth) * (flick.width - origCenter) / flick.width; var flickOffset = origCenter - pinch.center.x; root.itemWidth = origWidth * pinch.scale; flick.contentX = origCenter + flickOffset + scaleOffsetLeft; } onPinchFinished: flick.returnToBounds() Flickable { id: flick anchors.fill: parent contentWidth: row.width Row { id: row spacing: 20 Repeater { model: 30 Rectangle { width: itemWidth height: 40 border.width: 1 border.color: ma.containsMouse ? "red" : "black" color: "yellow" antialiasing: true MouseArea { id: ma hoverEnabled: true anchors.fill: parent } } } } } } }