Back to Doc.qt.io
Contact Us Blog Download Qt

C

PathArc QML Type

Defines an arc with the given radius. More...

Import Statement: import QtQuick
Since: Qt Quick Ultralite 1.8

Properties

Detailed Description

PathArc offers a simple way to define an arc that ends at a given position and uses the given radius. It's design is based on SVG's elliptical arc command.

The following QML produces the path shown below:

import QtQuick
import QtQuick.Shapes
Rectangle {
    width: 350
    height: 350
    Shape {
        ShapePath {
            startX: 100; startY: 0
            strokeColor: "skyblue"
            PathArc {
                x: 0; y: 100
                radiusX: 100; radiusY: 100
                useLargeArc: true
            }
        }
    }
}

Note: You must also link the Qul::Shapes module library to your project. For more information, see Qt Quick Ultralite Shapes QML Types.

In the earlier snippet, you can see that a single PathArc is not enough to define a circle. You need at least two PathArc items, each defining one half of the circle.

See also Path, PathLine, PathQuad, PathCubic, and PathSvg.

Property Documentation

radiusX : real

radiusY : real

Defines the radius of the arc.

The following QML demonstrates how different radius values can be used to change the shape of the arc:

import QtQuick
import QtQuick.Shapes
Rectangle {
    width: 350
    height: 350
    Shape {
        ShapePath {
            startX: 0; startY: 100
            strokeColor: "skyblue"
            PathArc {
                x: 50; y: 100
                radiusX: 25; radiusY: 15
            }
            PathArc {
                x: 100; y: 100
                radiusX: 25; radiusY: 25
            }
            PathArc {
                x: 150; y: 100
                radiusX: 25; radiusY: 50
            }
            PathArc {
                x: 200; y: 100
                radiusX: 50; radiusY: 100
            }
        }
    }
}

Note: You must also link the Qul::Shapes module library to your project. For more information, see Qt Quick Ultralite Shapes QML Types.


x : real

y : real

Defines the end point of the arc.


direction : enumeration

Defines the direction of the arc. Possible values are PathArc.Clockwise (default) and PathArc.Counterclockwise.


useLargeArc : bool

Whether to use a large arc as defined by the arc points.

Given fixed start and end positions, radius, and direction, there are two possible arcs that can fit the data. useLargeArc is used to distinguish between these. For example, the following QML can produce either of the two illustrated arcs below by changing the value of useLargeArc.

import QtQuick
import QtQuick.Shapes
Rectangle {
    width: 350
    height: 350
    Repeater {
        id: repeater
        model: 2
        Shape {
            ShapePath {
                startX: 0; startY: 100
                strokeColor: index === 0 ? "brown" : "skyblue"
                PathArc {
                    x: 100; y: 200
                    radiusX: 100; radiusY: 100
                    useLargeArc: index === 0 ? true : false
                    direction: PathArc.Clockwise
                }
            }
        }
    }
}

The default value is false.

Note: You must also link the Qul::Shapes module library to your project. For more information, see Qt Quick Ultralite Shapes QML Types.


xAxisRotation : real

Defines the rotation of the arc, in degrees. The default value is 0.

An arc is a section of circles or ellipses. Given the radius and the start and end points, there are two ellipses that connect the points. This property defines the rotation of the X axis of these ellipses.

Note: The value is only useful when the x and y radius differ, meaning the arc is a section of ellipses.


Available under certain Qt licenses.
Find out more.