Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

New Shapes plugin for drawing user defined shapes



  • Hi,
    I would like to use the new Shapes API for drawing user defined shapes or polygons with fill effects. The shape points (vertices) will be dynamically created and not hard coded.

    The example code below works but the resulting polygon is composed of several shapes (each one drawing an edge) and therefore the polygon cannot be filled with the ShapePath fill features. This is done because it seems that the Repeater cannot reside inside the ShapePath item and repeat the PathLine, but only outside of the Shape item.

    Thanks,
    Yair

    import QtQuick 2.9
    import QtQuick.Shapes 1.0
    
    Item{
        property var points: []
    
        id:  polygonId
    
        Component.onCompleted: {
            var x = 0, y = 0, r = 100, n = 8
    
            for (var i = 0; i < n; i++) {
                points.push(Qt.point(x + r * Math.cos(2 * Math.PI * i / n), y + r * Math.sin(2 * Math.PI * i / n)) )
            }
            repeaterId.model = points.length
        }
    
        Repeater{
            id: repeaterId
    
            Shape {
                property var myPoints: []
    
                anchors.centerIn: parent
    
                ShapePath {
                    id:             shapePathId
                    strokeWidth:    1
                    strokeColor:    "red"
    
                    startX: polygonId.points[index].x
                    startY: polygonId.points[index].y
    
                    PathLine {  x: polygonId.points[(index + 1) % polygonId.points.length ].x;
                                y: polygonId.points[(index + 1) % polygonId.points.length ].y}
                }
            }
        }
    }
    
    

Log in to reply