Hi all.
It looks like there is a different behavior when using Flickable and PinchArea together, depending on the way we arrange our items in the view.
I tried to use a PinchArea inside a Flickable in order to get a behavior of moving and resizing of an item. The wanted behavior is to apply moving when the user touch only with one finger and, when the user touch with two fingers apply resizing.
That behavior works fine when we put the target item inside the PinchArea, as follows:
Qt Code:
  1. // Rectangle inside a PinchArea
  2. Rectangle
  3. {
  4. width: 200; height: 200
  5.  
  6. Flickable {
  7. id: f1
  8. anchors { fill: parent; margins: 2 }
  9. contentWidth: 300
  10. contentHeight: 300
  11. clip: true
  12. boundsBehavior: Flickable.StopAtBounds
  13.  
  14. PinchArea {
  15. width: Math.max(f1.contentWidth, f1.width)
  16. height: Math.max(f1.contentHeight, f1.height)
  17.  
  18. property real initialWidth
  19. property real initialHeight
  20.  
  21. onPinchStarted: {
  22. initialWidth = f1.contentWidth
  23. initialHeight = f1.contentHeight
  24. }
  25.  
  26. onPinchUpdated: {
  27. f1.resizeContent(initialWidth * pinch.scale, initialHeight * pinch.scale, pinch.center)
  28. }
  29.  
  30. Rectangle {
  31. width: f1.contentWidth
  32. height: f1.contentHeight
  33. color: "white"
  34.  
  35. RadialGradient
  36. {
  37. anchors.fill: parent
  38. gradient: Gradient{
  39. GradientStop { position: 0.0; color: "blue" }
  40. GradientStop { position: 0.25; color: "cyan" }
  41. GradientStop { position: 0.5; color: "green" }
  42. GradientStop { position: 0.75; color: "red" }
  43. GradientStop { position: 1; color: "orange" }
  44. }
  45. }
  46. }
  47. }
  48. }
  49. }
To copy to clipboard, switch view to plain text mode 
In the example above it works fine. We can start moving aour item and then resize it when we add another finger.
But, this behavior doesn't work when we put the target item beside the PinchArea, as follows:
Qt Code:
  1. // Rectangle beside a PinchArea
  2. Rectangle
  3. {
  4. width: 200; height: 200
  5. x: 200
  6.  
  7. Flickable {
  8. id: f2
  9. anchors { fill: parent; margins: 2 }
  10. contentWidth: 300
  11. contentHeight: 300
  12. clip: true
  13. boundsBehavior: Flickable.StopAtBounds
  14.  
  15. Rectangle {
  16. width: f2.contentWidth
  17. height: f2.contentHeight
  18. color: "white"
  19.  
  20. RadialGradient
  21. {
  22. anchors.fill: parent
  23. gradient: Gradient{
  24. GradientStop { position: 1; color: "blue" }
  25. GradientStop { position: 0.75; color: "cyan" }
  26. GradientStop { position: 0.5; color: "green" }
  27. GradientStop { position: 0.25; color: "red" }
  28. GradientStop { position: 0; color: "orange" }
  29. }
  30. }
  31. }
  32.  
  33. PinchArea {
  34. width: Math.max(f2.contentWidth, f2.width)
  35. height: Math.max(f2.contentHeight, f2.height)
  36.  
  37. property real initialWidth
  38. property real initialHeight
  39.  
  40. onPinchStarted: {
  41. initialWidth = f2.contentWidth
  42. initialHeight = f2.contentHeight
  43. }
  44.  
  45. onPinchUpdated: {
  46. f2.resizeContent(initialWidth * pinch.scale, initialHeight * pinch.scale, pinch.center)
  47. }
  48. }
  49. }
  50. }
To copy to clipboard, switch view to plain text mode 
When we put the target item beside the PinchArea we can resize the item (using the PinchArea) but, once we start moving a finger on the item, the Flickable steals all the touch events and the resizing (using the PinchArea) isn't applied.

Can anyone explain the difference of the behavior (between using an item inside or beside a PinchArea)?
Is there a way to make the wanted behavior (to apply moving when the user touch only with one finger and, when the user touch with two fingers apply resizing) to work also when we put the target item beside the PinchArea?