onEntered or onPressed does not work for custom type(QDeclarativeItem subclass)

[tuxit]

Hello,

I have a custom QDeclarativeItem subclass named Polygon. I add a MouseArea in it but onEntered or onPressed does not working, or am i expect wrong thing to happen? I can see my polygons on the window but nothing is writing on console onPressed or onEntered.

Here is QML file:

import MyTypes 1.0
import QtQuick 1.0
import Qt 4.7
 
Item {
    id: container
    width: 350; height: 250
 
     Polygon {
         id: aPolygon
 
         width: 20; height: 20
         name: "A simple polygon"
         color: "blue"
         vertices:[
 
         Point{x:20.0; y:40.0},
         Point{x:40.0; y:40.0},
         Point{x:40.0; y:20.0},
         Point{x:20.0; y:20.0}
         ]
 
         MouseArea{
             anchors.fill: parent
             drag.target: aPolygon
             drag.axis: Drag.XandYAxis
             drag.minimumX: 0
             drag.maximumX: container.width - parent.width
             drag.minimumY: 0
             drag.maximumY: container.height - parent.width
             onPressed:console.log("==============   ==onPressed")
 
         }
 
 
     }
 
     Polygon {
         id: bPolygon
         //anchors.centerIn: parent
         width: 20; height: 20
         name: "A simple polygon"
         color: "blue"
         vertices:[
 
         Point{x:60.0; y:80.0},
         Point{x:80.0; y:80.0},
         Point{x:80.0; y:60.0},
         Point{x:60.0; y:60.0}
         ]
 
         MouseArea{
             //hoverEnabled: false
             enabled: visible
             hoverEnabled: visible
             anchors.fill: parent
             acceptedButtons: Qt.LeftButton | Qt.RightButton
             onEntered: {
                 console.log("==============   ==onEntered")
 
             }
         }
 
 
     }
}

import MyTypes 1.0
import QtQuick 1.0
import Qt 4.7

Item {
    id: container
    width: 350; height: 250

     Polygon {
         id: aPolygon

         width: 20; height: 20
         name: "A simple polygon"
         color: "blue"
         vertices:[

         Point{x:20.0; y:40.0},
         Point{x:40.0; y:40.0},
         Point{x:40.0; y:20.0},
         Point{x:20.0; y:20.0}
         ]

         MouseArea{
             anchors.fill: parent
             drag.target: aPolygon
             drag.axis: Drag.XandYAxis
             drag.minimumX: 0
             drag.maximumX: container.width - parent.width
             drag.minimumY: 0
             drag.maximumY: container.height - parent.width
             onPressed:console.log("==============   ==onPressed")

         }


     }

     Polygon {
         id: bPolygon
         //anchors.centerIn: parent
         width: 20; height: 20
         name: "A simple polygon"
         color: "blue"
         vertices:[

         Point{x:60.0; y:80.0},
         Point{x:80.0; y:80.0},
         Point{x:80.0; y:60.0},
         Point{x:60.0; y:60.0}
         ]

         MouseArea{
             //hoverEnabled: false
             enabled: visible
             hoverEnabled: visible
             anchors.fill: parent
             acceptedButtons: Qt.LeftButton | Qt.RightButton
             onEntered: {
                 console.log("==============   ==onEntered")

             }
         }


     }
}

To copy to clipboard, switch view to plain text mode 

Thanks for any idea.

[laszlo.gosztola]

Try to draw a rectangle instead of the MouseArea.
I think, since you don't set x and y, but set width and height to 20, the MouseArea are in the upper-left corner of the screen. The reason why you see the polygons, that clipping property is set to false by default.

[tuxit]

Thanks very much, i saw it is the point.
I can see some event reaction after setting x and y on screen but not in polygons,
So I want to ask,
what should i set to x and y?

[laszlo.gosztola]

Did You draw the rectangles instead of the mouseAreas?

I think your first polygon now draws a square at point(20,20), point(20, 40), point(40,40), point(40,20).
But You set the width and height only to 20.

Maybe your function should look something like this:

Polygon {
  id: aPolygon
   x: 20; y: 20
  width: 20; height: 20
  name: "A simple polygon"
  color: "blue"
  vertices:[
 
  Point{x:0.0; y:20.0},
  Point{x:20.0; y:20.0},
  Point{x:20.0; y:0.0},
  Point{x:0.0; y:0.0}
]
 
MouseArea{
anchors.fill: parent
drag.target: aPolygon
drag.axis: Drag.XandYAxis
drag.minimumX: 0
drag.maximumX: container.width - parent.width
drag.minimumY: 0
drag.maximumY: container.height - parent.width
onPressed:console.log("============== ==onPressed")
 
}
 
 
}

Polygon {
  id: aPolygon
   x: 20; y: 20
  width: 20; height: 20
  name: "A simple polygon"
  color: "blue"
  vertices:[
 
  Point{x:0.0; y:20.0},
  Point{x:20.0; y:20.0},
  Point{x:20.0; y:0.0},
  Point{x:0.0; y:0.0}
]
 
MouseArea{
anchors.fill: parent
drag.target: aPolygon
drag.axis: Drag.XandYAxis
drag.minimumX: 0
drag.maximumX: container.width - parent.width
drag.minimumY: 0
drag.maximumY: container.height - parent.width
onPressed:console.log("============== ==onPressed")
 
}
 
 
}

To copy to clipboard, switch view to plain text mode 

[tuxit]

unfortunately can not working right.
thanks for attention

---

Added after 1 37 minutes:

i tried to draw a triangle with Polygon{} but MouseArea still cares the rectangle that is defined by x, y, width and height.
the shape function does not matter i think.

[laszlo.gosztola]

Of course. How should it know that you draw a polygon??
You just filled the rectangle with the MouseArea. If you want it, you have to get the x and y coordinates of the click, check if it's in the polygon decide if you want to react or not.