Arc QML Type

An arc that ends at the specified position and uses the specified radius. More...

Import Statement: import QtQuick.Studio.Components 1.0
Since: QtQuick.Studio.Components 1.0
Inherits:

ShapePath

Properties

Detailed Description

An arc is specified by setting values in degrees for the begin and end properties. The arc can be just a line or a filled outline. The strokeColor, strokeWidth, and strokeStyle properties specify the appearance of the line or outline. The dashPattern and dashOffset properties specify the appearance of dashed lines.

The area between the arc's start and end points or the area inside the outline are painted using either a solid fill color, specified using the fillColor property, or a gradient, defined using one of the ShapeGradient subtypes and set using the gradient property. If both a color and a gradient are specified, the gradient is used.

To create an arc with an outline, set the outlineArc property to true. The arcWidth property specifies the width of the arc outline, including the stroke. The arcWidthBegin and arcWidthEnd properties can be used to specify the width of the start and end points of the outline separately. The width of the outline between the start and end points is calculated automatically. The inner and outer curves or the outline can be adjusted by specifying values for the radiusInnerAdjust and radiusOuterAdjust properties.

The round, roundBegin, and roundEnd properties specify whether the end points of the arc outline have rounded caps. For an arc that does not have an outline, the capStyle property specifies whether the line ends are square or rounded.

Because an arc has curves, it may be appropriate to set the antialiasing property to improve its appearance.

Example Usage

You can use the Arc component in Qt Design Studio to create different kinds of arcs.

The QML code looks as follows:

ArcItem {
    id: arc
    x: 31
    y: 31
    capStyle: 32
    end: 180
    strokeWidth: 6
    strokeColor: "#000000"
}

ArcItem {
    id: arcOutline
    strokeColor: "gray"
    arcWidth: 13
    end: 180
    fillColor: "light gray"
    antialiasing: true
    round: true
    outlineArc: true
}

ArcItem {
    id: circle
    end: 360
    strokeWidth: 5
    strokeColor: "#000000"
}

ArcItem {
    id: circleOutline
    outlineArc: true
    round: true
    strokeColor: "gray"
    fillColor: "light gray"
    strokeWidth: 1
    end: 360
}

Property Documentation

alpha : real

The area between the begin and end points of the arc.


antialiasing : bool

Whether the arc should be antialiased.

Antialiasing might require more memory and slow down drawing the type.


arcWidth : real

The total width of an arc that has an outline, including the outline and fill.

See also arcWidthBegin, arcWidthEnd, and strokeWidth.


arcWidthBegin : real

The width of the beginning of an arc outline.

See also arcWidthEnd and arcWidth.


arcWidthEnd : real

The width of the end of an arc outline.

See also arcWidthBegin and arcWidth.


begin : real

The position in degrees where the arc begins.

The default value is 0.

To create a circle, set the value of this property to 0 and the value of the end property to 360.


capStyle : enumeration

The cap style of the line if the arc does not have an outline.

ConstantDescription
ShapePath.FlatCapA square line end that does not cover the end point of the line.
ShapePath.SquareCapA square line end that covers the end point and extends beyond it by half the line width. This is the default value.
ShapePath.RoundCapA rounded line end.

See also round, roundBegin, roundEnd, and Qt::PenCapStyle.


dashOffset : ShapePath

The starting point of the dash pattern for the arc or arc outline.

The offset is measured in terms of the units used to specify the dash pattern. For example, a pattern where each stroke is four units long, followed by a gap of two units, will begin with the stroke when drawn as a line. However, if the dash offset is set to 4.0, any line drawn will begin with the gap. Values of the offset up to 4.0 will cause part of the stroke to be drawn first, and values of the offset between 4.0 and 6.0 will cause the line to begin with part of the gap.

The default value is 0.

See also QPen::setDashOffset().


dashPattern : ShapePath

The dash pattern of the arc or arc outline specified as the dashes and the gaps between them.

The dash pattern is specified in units of the pen's width. That is, a dash with the length 5 and width 10 is 50 pixels long.

Each dash is also subject to cap styles, and therefore a dash of 1 with square cap set will extend 0.5 pixels out in each direction resulting in a total width of 2.

The default capStyle is ShapePath.SquareCap, meaning that a square line end covers the end point and extends beyond it by half the line width.

The default value is (4, 2), meaning a dash of 4 * strokeWidth pixels followed by a space of 2 * strokeWidth pixels.

See also QPen::setDashPattern().


end : real

The position in degrees where the arc ends.

To create a circle, set the value of this property to 360 and the value of the begin property to 0.


fillColor : ShapePath

The arc fill color.

If the arc is just a line, the area between its begin and end points is filled.

If the arc has an outline, the area within the outline is filled.

A gradient for the fill can be specified by using gradient. If both a color and a gradient are specified, the gradient is used.

When set to transparent, no filling occurs.

The default value is white.


gradient : ShapePath

The gradient of the arc fill color.

By default, no gradient is enabled and the value is null. In this case, the fill uses a solid color based on the value of fillColor.

When set, fillColor is ignored and filling is done using one of the ShapeGradient subtypes.

Note: The Gradient type cannot be used here. Rather, prefer using one of the advanced subtypes, like LinearGradient.


outlineArc : bool

Whether the arc has an outline.

See also arcWidth, arcWidthBegin, arcWidthEnd, round, roundBegin, and roundEnd.


radiusInnerAdjust : real

The radius of the inside edge of the arc outline.

This property can be used to adjust the inner curve of the arc outline.


radiusOuterAdjust : real

The radius of the outside edge of the arc outline.

This property can be used to adjust the outer curve of the arc outline.


round : bool

Whether the arc outline end points have round caps.

The roundBegin and roundEnd properties can be used to specify the caps separately for the end points.


roundBegin : bool

Whether the arc outline begins with a round cap.

See also Qt::PenCapStyle, round, and roundEnd.


roundEnd : bool

Whether the arc outline ends with a round cap.

See also Qt::PenCapStyle, round, and roundBegin.


strokeColor : ShapePath

The color of the arc line or outline.

When set to transparent, no line is drawn.

The default value is white.

See also QColor.


strokeStyle : enumeration

The style of the arc line or outline.

ConstantDescription
ShapePath.SolidLineA solid line. This is the default value.
ShapePath.DashLineDashes separated by a few pixels. The dashPattern property specifies the dash pattern.

See also Qt::PenStyle.


strokeWidth : ShapePath

The width of the arc line or outline.

When set to a negative value, no line is drawn.

The default value is 1.

The total width of an arc that has an outline (that is, the outline and the fill) is specified by arcWidth.


Available under certain Qt licenses.
Find out more.