Прямоугольник qml с настраиваемыми закругленными границами

Поэтому понадобился прямоугольник qml с настраиваемыми закругленными углами. В итоге я создал один с фигурами, pathLines, pathArcs и немного математики.

Почему-то мои дуги/закругленные углы не такие острые/тонкие, как прямоугольник со свойством радиуса. Как я могу сделать эти углы более тонкими?

Item {
        anchors.centerIn: parent
        id: root
        width: 300
        height: 300
        property string color: 'red'
        property int rightTopCornerRadius: 10
        property int rightBottomCornerRadius: 20
        property int leftBottomCornerRadius: 30
        property int leftTopCornerRadius: 40

        Shape {

             ShapePath {

                strokeWidth: 5
                strokeColor: root.color
                startX: root.leftTopCornerRadius > 0 ? root.leftTopCornerRadius : 0
                startY: 0
                fillColor: "transparent"
                capStyle: ShapePath.RoundCap
                 fillRule:ShapePath.WindingFill

                PathLine { y: 0; x:root.width - root.rightTopCornerRadius}
                PathArc {
                    x: root.width; y: root.rightTopCornerRadius
                    radiusX: root.rightTopCornerRadius; radiusY: root.rightTopCornerRadius

                }

                PathLine { x:root.width; y:root.height - root.rightBottomCornerRadius}
                PathArc {
                    x:root.width - root.rightBottomCornerRadius; y: root.height
                    radiusX: root.rightBottomCornerRadius; radiusY: root.rightBottomCornerRadius
                }

                PathLine { x:root.leftBottomCornerRadius; y:root.height}
                PathArc {
                    x:0; y: root.height - root.leftBottomCornerRadius
                    radiusX: root.leftBottomCornerRadius; radiusY: root.leftBottomCornerRadius
                }

                PathLine { x:0; y:root.leftTopCornerRadius}
                PathArc {
                    x:root.leftTopCornerRadius; y: 0
                    radiusX: root.leftTopCornerRadius; radiusY: root.leftTopCornerRadius
                }
            }
        }
    }
}

где еще Обычный прямоугольник с закругленными углами с очень тонкими границами.

Rectangle {
       anchors.centerIn: parent
       width: 300
       height: 300
       radius: 30
       border.width: 5
    }

Я пробовал играть с некоторыми свойствами общего доступа, но ничего не помогло. как joinstyle, capstyle, fillrule