androidx.compose.ui.graphics.vector

Interfaces

VectorConfig

Holds a set of values that overwrite the original property values of an ImageVector.

Cmn

Classes

`ImageVector`	Vector graphics object that is generated as a result of `ImageVector.Builder` It can be composed and rendered by passing it as an argument to `rememberVectorPainter`	Cmn
`ImageVector.Builder`	Builder used to construct a Vector graphic tree.	Cmn
`PathBuilder`	`PathBuilder` provides a fluent API to creates a list of `PathNode`, used to describe a path.	Cmn
`PathNode`	Represents a single command in a vector graphics path.	Cmn
`PathNode.ArcTo`	Draws an elliptical arc from the current point to a new point using absolute coordinates.	Cmn
`PathNode.CurveTo`	Draws a cubic Bézier curve from the current point to a new point using absolute coordinates.	Cmn
`PathNode.HorizontalTo`	Draws a horizontal line from the current point to the specified absolute x-coordinate.	Cmn
`PathNode.LineTo`	Draws a line from the current point to the specified absolute (x,y) coordinate.	Cmn
`PathNode.MoveTo`	Starts a new subpath at the given absolute (x,y) coordinate.	Cmn
`PathNode.QuadTo`	Draws a quadratic Bézier curve from the current point to a new point using absolute coordinates.	Cmn
`PathNode.ReflectiveCurveTo`	Draws a smooth cubic Bézier curve using absolute coordinates.	Cmn
`PathNode.ReflectiveQuadTo`	Draws a smooth quadratic Bézier curve using absolute coordinates.	Cmn
`PathNode.RelativeArcTo`	Draws an elliptical arc from the current point to a new point using relative coordinates.	Cmn
`PathNode.RelativeCurveTo`	Draws a cubic Bézier curve from the current point to a new point using relative coordinates.	Cmn
`PathNode.RelativeHorizontalTo`	Draws a horizontal line from the current point, offset by a relative distance `dx`.	Cmn
`PathNode.RelativeLineTo`	Draws a line from the current point to a new point, defined by a relative offset.	Cmn
`PathNode.RelativeMoveTo`	Starts a new subpath at a point defined by a relative offset from the current point.	Cmn
`PathNode.RelativeQuadTo`	Draws a quadratic Bézier curve from the current point to a new point using relative coordinates.	Cmn
`PathNode.RelativeReflectiveCurveTo`	Draws a smooth cubic Bézier curve using relative coordinates.	Cmn
`PathNode.RelativeReflectiveQuadTo`	Draws a smooth quadratic Bézier curve using relative coordinates.	Cmn
`PathNode.RelativeVerticalTo`	Draws a vertical line from the current point, offset by a relative distance `dy`.	Cmn
`PathNode.VerticalTo`	Draws a vertical line from the current point to the specified absolute y-coordinate.	Cmn
`PathParser`		Cmn
`VNode`		Cmn
`VectorApplier`		Cmn
`VectorGroup`	Defines a group of paths or subgroups, plus transformation information.	Cmn
`VectorNode`		Cmn
`VectorPainter`	`Painter` implementation that abstracts the drawing of a Vector graphic.	Cmn
`VectorPath`	Leaf node of a Vector graphics tree.	Cmn
`VectorProperty`	Represents one of the properties for PathComponent or GroupComponent that can be overwritten when it is composed and drawn with `RenderVectorGroup`.	Cmn

Objects

`ImageVector.Companion`		Cmn
`PathNode.Close`	Closes the current subpath by drawing a straight line from the current point to the initial point of the subpath.	Cmn
`VectorProperty.Fill`		Cmn
`VectorProperty.FillAlpha`		Cmn
`VectorProperty.PathData`		Cmn
`VectorProperty.PivotX`		Cmn
`VectorProperty.PivotY`		Cmn
`VectorProperty.Rotation`		Cmn
`VectorProperty.ScaleX`		Cmn
`VectorProperty.ScaleY`		Cmn
`VectorProperty.Stroke`		Cmn
`VectorProperty.StrokeAlpha`		Cmn
`VectorProperty.StrokeLineWidth`		Cmn
`VectorProperty.TranslateX`		Cmn
`VectorProperty.TranslateY`		Cmn
`VectorProperty.TrimPathEnd`		Cmn
`VectorProperty.TrimPathOffset`		Cmn
`VectorProperty.TrimPathStart`		Cmn

Annotations

VectorComposable

An annotation that can be used to mark an composable function as being expected to be use in a composable function that is also marked or inferred to be marked as a VectorComposable.

Cmn

Constants summary

`const String`	`DefaultGroupName`	Cmn
`const String`	`DefaultPathName`	Cmn
`const Float`	`DefaultPivotX = 0.0f`	Cmn
`const Float`	`DefaultPivotY = 0.0f`	Cmn
`const Float`	`DefaultRotation = 0.0f`	Cmn
`const Float`	`DefaultScaleX = 1.0f`	Cmn
`const Float`	`DefaultScaleY = 1.0f`	Cmn
`const Float`	`DefaultStrokeLineMiter = 4.0f`	Cmn
`const Float`	`DefaultStrokeLineWidth = 0.0f`	Cmn
`const Float`	`DefaultTranslationX = 0.0f`	Cmn
`const Float`	`DefaultTranslationY = 0.0f`	Cmn
`const Float`	`DefaultTrimPathEnd = 1.0f`	Cmn
`const Float`	`DefaultTrimPathOffset = 0.0f`	Cmn
`const Float`	`DefaultTrimPathStart = 0.0f`	Cmn
`const String`	`RootGroupName` Default identifier for the root group if a Vector graphic	Cmn

Top-level functions summary

`Unit`	`@Composable @VectorComposable Group( name: String, rotation: Float, pivotX: Float, pivotY: Float, scaleX: Float, scaleY: Float, translationX: Float, translationY: Float, clipPathData: List<PathNode>, content: @Composable @VectorComposable () -> Unit )` Defines a group of `Path`s and other `Group`s inside a `VectorPainter`.	Cmn
`Unit`	`@Composable @VectorComposable Path( pathData: List<PathNode>, pathFillType: PathFillType, name: String, fill: Brush?, fillAlpha: Float, stroke: Brush?, strokeAlpha: Float, strokeLineWidth: Float, strokeLineCap: StrokeCap, strokeLineJoin: StrokeJoin, strokeLineMiter: Float, trimPathStart: Float, trimPathEnd: Float, trimPathOffset: Float )` Defines a path inside a `VectorPainter`.	Cmn
`inline List<PathNode>`	`PathData(block: PathBuilder.() -> Unit)`	Cmn
`Unit`	`@Composable RenderVectorGroup(group: VectorGroup, configs: Map<String, VectorConfig>)` Recursively creates the vector graphic composition by traversing the tree structure.	Cmn
`List<PathNode>`	`addPathNodes(pathStr: String?)`	Cmn
`VectorPainter`	`@Composable rememberVectorPainter(image: ImageVector)` Create a `VectorPainter` with the given `ImageVector`.	Cmn
`VectorPainter`	`@Composable @ComposableOpenTarget(index = -1) rememberVectorPainter( defaultWidth: Dp, defaultHeight: Dp, viewportWidth: Float, viewportHeight: Float, name: String, tintColor: Color, tintBlendMode: BlendMode, content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit )` This function is deprecated. Replace rememberVectorPainter graphicsLayer that consumes the auto mirror flag	Cmn
`VectorPainter`	`@Composable @ComposableOpenTarget(index = -1) rememberVectorPainter( defaultWidth: Dp, defaultHeight: Dp, viewportWidth: Float, viewportHeight: Float, name: String, tintColor: Color, tintBlendMode: BlendMode, autoMirror: Boolean, content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit )` Create a `VectorPainter` with the Vector defined by the provided sub-composition.	Cmn

Extension functions summary

`inline ImageVector.Builder`	`ImageVector.Builder.group( name: String, rotate: Float, pivotX: Float, pivotY: Float, scaleX: Float, scaleY: Float, translationX: Float, translationY: Float, clipPathData: List<PathNode>, block: ImageVector.Builder.() -> Unit )` DSL extension for adding a `VectorGroup` to `this`.	Cmn
`inline ImageVector.Builder`	`ImageVector.Builder.path( name: String, fill: Brush?, fillAlpha: Float, stroke: Brush?, strokeAlpha: Float, strokeLineWidth: Float, strokeLineCap: StrokeCap, strokeLineJoin: StrokeJoin, strokeLineMiter: Float, pathFillType: PathFillType, pathBuilder: PathBuilder.() -> Unit )` DSL extension for adding a `VectorPath` to `this`.	Cmn
`Path`	`List<PathNode>.toPath(target: Path)` Converts this list of `PathNode` into a `Path` by adding the appropriate commands to the `target` path.	Cmn

Top-level properties summary

`PathFillType`	`DefaultFillType`	Cmn
`StrokeCap`	`DefaultStrokeLineCap`	Cmn
`StrokeJoin`	`DefaultStrokeLineJoin`	Cmn
`BlendMode`	`DefaultTintBlendMode`	Cmn
`Color`	`DefaultTintColor`	Cmn
`List<PathNode>`	`EmptyPath`	Cmn

Constants

DefaultGroupName

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultGroupName: String

DefaultPathName

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultPathName: String

DefaultPivotX

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultPivotX = 0.0f: Float

DefaultPivotY

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultPivotY = 0.0f: Float

DefaultRotation

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultRotation = 0.0f: Float

DefaultScaleX

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultScaleX = 1.0f: Float

DefaultScaleY

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultScaleY = 1.0f: Float

DefaultStrokeLineMiter

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultStrokeLineMiter = 4.0f: Float

DefaultStrokeLineWidth

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultStrokeLineWidth = 0.0f: Float

DefaultTranslationX

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultTranslationX = 0.0f: Float

DefaultTranslationY

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultTranslationY = 0.0f: Float

DefaultTrimPathEnd

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultTrimPathEnd = 1.0f: Float

DefaultTrimPathOffset

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultTrimPathOffset = 0.0f: Float

DefaultTrimPathStart

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val DefaultTrimPathStart = 0.0f: Float

RootGroupName

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

const val RootGroupName: String

Default identifier for the root group if a Vector graphic

Top-level functions

Group

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.10.0

@Composable
@VectorComposable
fun Group(
    name: String = DefaultGroupName,
    rotation: Float = DefaultRotation,
    pivotX: Float = DefaultPivotX,
    pivotY: Float = DefaultPivotY,
    scaleX: Float = DefaultScaleX,
    scaleY: Float = DefaultScaleY,
    translationX: Float = DefaultTranslationX,
    translationY: Float = DefaultTranslationY,
    clipPathData: List<PathNode> = EmptyPath,
    content: @Composable @VectorComposable () -> Unit
): Unit

Defines a group of Paths and other Groups inside a VectorPainter. This is not a regular UI composable, it can only be called inside composables called from the content parameter to rememberVectorPainter.

Parameters
`name: String = DefaultGroupName`	Optional name of the group used when describing the vector as a string.
`rotation: Float = DefaultRotation`	The rotation of the group around the Z axis, in degrees.
`pivotX: Float = DefaultPivotX`	The horizontal pivot point used for rotation, in pixels.
`pivotY: Float = DefaultPivotY`	The vertical pivot point used for rotation, in pixels.
`scaleX: Float = DefaultScaleX`	Factor to scale the group by horizontally.
`scaleY: Float = DefaultScaleY`	Factor to scale the group by vertically.
`translationX: Float = DefaultTranslationX`	Horizontal offset of the group, in pixels.
`translationY: Float = DefaultTranslationY`	Vertical offset of the group, in pixels.
`clipPathData: List<PathNode> = EmptyPath`	A list of `PathNode`s that define how to clip the group. Empty by default.
`content: @Composable @VectorComposable () -> Unit`	A composable that defines the contents of the group.

Path

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.10.0

@Composable
@VectorComposable
fun Path(
    pathData: List<PathNode>,
    pathFillType: PathFillType = DefaultFillType,
    name: String = DefaultPathName,
    fill: Brush? = null,
    fillAlpha: Float = 1.0f,
    stroke: Brush? = null,
    strokeAlpha: Float = 1.0f,
    strokeLineWidth: Float = DefaultStrokeLineWidth,
    strokeLineCap: StrokeCap = DefaultStrokeLineCap,
    strokeLineJoin: StrokeJoin = DefaultStrokeLineJoin,
    strokeLineMiter: Float = DefaultStrokeLineMiter,
    trimPathStart: Float = DefaultTrimPathStart,
    trimPathEnd: Float = DefaultTrimPathEnd,
    trimPathOffset: Float = DefaultTrimPathOffset
): Unit

Defines a path inside a VectorPainter. This is not a regular UI composable, it can only be called inside composables called from the content parameter to rememberVectorPainter.

Parameters
`pathData: List<PathNode>`	List of `PathNode`s that define the path.
`pathFillType: PathFillType = DefaultFillType`	The `PathFillType` that specifies how to fill the path.
`name: String = DefaultPathName`	Optional name of the path used when describing the vector as a string.
`fill: Brush? = null`	The `Brush` used to fill the path.
`fillAlpha: Float = 1.0f`	The alpha value to use for `fill`.
`stroke: Brush? = null`	The `Brush` used to stroke the path.
`strokeAlpha: Float = 1.0f`	The alpha value to use for `stroke`.
`strokeLineWidth: Float = DefaultStrokeLineWidth`	The width of the `stroke`. See `Stroke.width` for details.
`strokeLineCap: StrokeCap = DefaultStrokeLineCap`	The `StrokeCap` of `stroke`. See `Stroke.cap` for details.
`strokeLineJoin: StrokeJoin = DefaultStrokeLineJoin`	The `StrokeJoin` of `stroke`. See `Stroke.join` for details.
`strokeLineMiter: Float = DefaultStrokeLineMiter`	The stroke miter value. See `Stroke.miter` for details.
`trimPathStart: Float = DefaultTrimPathStart`	The fraction of the path that specifies the start of the clipped region of the path. See `PathMeasure.getSegment`.
`trimPathEnd: Float = DefaultTrimPathEnd`	The fraction of the path that specifies the end of the clipped region of the path. See `PathMeasure.getSegment`.
`trimPathOffset: Float = DefaultTrimPathOffset`	The amount to offset both `trimPathStart` and `trimPathEnd`.

PathData

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

inline fun PathData(block: PathBuilder.() -> Unit): List<PathNode>

RenderVectorGroup

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.10.0

@Composable
fun RenderVectorGroup(
    group: VectorGroup,
    configs: Map<String, VectorConfig> = emptyMap()
): Unit

Recursively creates the vector graphic composition by traversing the tree structure.

Parameters
`group: VectorGroup`	The vector group to render.
`configs: Map<String, VectorConfig> = emptyMap()`	An optional map of `VectorConfig` to provide animation values. The keys are the node names. The values are `VectorConfig` for that node.

addPathNodes

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

fun addPathNodes(pathStr: String?): List<PathNode>

rememberVectorPainter

Cmn

Artifact: androidx.compose.ui:ui

View Source

Added in 1.0.0

@Composable
fun rememberVectorPainter(image: ImageVector): VectorPainter

Create a VectorPainter with the given ImageVector. This will create a sub-composition of the vector hierarchy given the tree structure in ImageVector

Parameters
`image: ImageVector`	ImageVector used to create a vector graphic sub-composition

rememberVectorPainter

Cmn

Artifact: androidx.compose.ui:ui

View Source

@Composable
@ComposableOpenTarget(index = -1)
fun rememberVectorPainter(
    defaultWidth: Dp,
    defaultHeight: Dp,
    viewportWidth: Float = Float.NaN,
    viewportHeight: Float = Float.NaN,
    name: String = RootGroupName,
    tintColor: Color = Color.Unspecified,
    tintBlendMode: BlendMode = BlendMode.SrcIn,
    content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit
): VectorPainter

Create a VectorPainter with the Vector defined by the provided sub-composition

Parameters
`defaultWidth: Dp`	Intrinsic width of the Vector in `Dp`
`defaultHeight: Dp`	Intrinsic height of the Vector in `Dp`
`viewportWidth: Float`	Width of the viewport space. The viewport is the virtual canvas where paths are drawn on. This parameter is optional. Not providing it will use the `defaultWidth` converted to pixels
`viewportHeight: Float`	Height of the viewport space. The viewport is the virtual canvas where paths are drawn on. This parameter is optional. Not providing it will use the `defaultHeight` converted to pixels
`name: String = RootGroupName`	optional identifier used to identify the root of this vector graphic
`tintColor: Color = Color.Unspecified`	optional color used to tint the root group of this vector graphic
`tintBlendMode: BlendMode = BlendMode.SrcIn`	BlendMode used in combination with `tintColor`
`content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit`	Composable used to define the structure and contents of the vector graphic

rememberVectorPainter

Cmn

Artifact: androidx.compose.ui:ui

View Source

@Composable
@ComposableOpenTarget(index = -1)
fun rememberVectorPainter(
    defaultWidth: Dp,
    defaultHeight: Dp,
    viewportWidth: Float = Float.NaN,
    viewportHeight: Float = Float.NaN,
    name: String = RootGroupName,
    tintColor: Color = Color.Unspecified,
    tintBlendMode: BlendMode = BlendMode.SrcIn,
    autoMirror: Boolean = false,
    content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit
): VectorPainter

Create a VectorPainter with the Vector defined by the provided sub-composition.

Inside content use the Group and Path composables to define the vector.

Parameters
`defaultWidth: Dp`	Intrinsic width of the Vector in `Dp`
`defaultHeight: Dp`	Intrinsic height of the Vector in `Dp`
`viewportWidth: Float`	Width of the viewport space. The viewport is the virtual canvas where paths are drawn on. This parameter is optional. Not providing it will use the `defaultWidth` converted to pixels
`viewportHeight: Float`	Height of the viewport space. The viewport is the virtual canvas where paths are drawn on. This parameter is optional. Not providing it will use the `defaultHeight` converted to pixels
`name: String = RootGroupName`	optional identifier used to identify the root of this vector graphic
`tintColor: Color = Color.Unspecified`	optional color used to tint the root group of this vector graphic
`tintBlendMode: BlendMode = BlendMode.SrcIn`	BlendMode used in combination with `tintColor`
`autoMirror: Boolean = false`	Determines if the contents of the Vector should be mirrored for right to left layouts.
`content: @Composable @VectorComposable (viewportWidth: Float, viewportHeight: Float) -> Unit`	Composable used to define the structure and contents of the vector graphic

Extension functions

group

Cmn

Artifact: androidx.compose.ui:ui

View Source

inline fun ImageVector.Builder.group(
    name: String = DefaultGroupName,
    rotate: Float = DefaultRotation,
    pivotX: Float = DefaultPivotX,
    pivotY: Float = DefaultPivotY,
    scaleX: Float = DefaultScaleX,
    scaleY: Float = DefaultScaleY,
    translationX: Float = DefaultTranslationX,
    translationY: Float = DefaultTranslationY,
    clipPathData: List<PathNode> = EmptyPath,
    block: ImageVector.Builder.() -> Unit
): ImageVector.Builder

DSL extension for adding a VectorGroup to this.

See ImageVector.Builder.pushGroup for the corresponding builder function.

Parameters
`name: String = DefaultGroupName`	the name of the group
`rotate: Float = DefaultRotation`	the rotation of the group in degrees
`pivotX: Float = DefaultPivotX`	the x coordinate of the pivot point to rotate or scale the group
`pivotY: Float = DefaultPivotY`	the y coordinate of the pivot point to rotate or scale the group
`scaleX: Float = DefaultScaleX`	the scale factor in the X-axis to apply to the group
`scaleY: Float = DefaultScaleY`	the scale factor in the Y-axis to apply to the group
`translationX: Float = DefaultTranslationX`	the translation in virtual pixels to apply along the x-axis
`translationY: Float = DefaultTranslationY`	the translation in virtual pixels to apply along the y-axis
`clipPathData: List<PathNode> = EmptyPath`	the path information used to clip the content within the group
`block: ImageVector.Builder.() -> Unit`	builder lambda to add children to this group

path

Cmn

Artifact: androidx.compose.ui:ui

View Source

inline fun ImageVector.Builder.path(
    name: String = DefaultPathName,
    fill: Brush? = null,
    fillAlpha: Float = 1.0f,
    stroke: Brush? = null,
    strokeAlpha: Float = 1.0f,
    strokeLineWidth: Float = DefaultStrokeLineWidth,
    strokeLineCap: StrokeCap = DefaultStrokeLineCap,
    strokeLineJoin: StrokeJoin = DefaultStrokeLineJoin,
    strokeLineMiter: Float = DefaultStrokeLineMiter,
    pathFillType: PathFillType = DefaultFillType,
    pathBuilder: PathBuilder.() -> Unit
): ImageVector.Builder

DSL extension for adding a VectorPath to this.

See ImageVector.Builder.addPath for the corresponding builder function.

Parameters
`name: String = DefaultPathName`	the name for this path
`fill: Brush? = null`	specifies the `Brush` used to fill the path
`fillAlpha: Float = 1.0f`	the alpha to fill the path
`stroke: Brush? = null`	specifies the `Brush` used to fill the stroke
`strokeAlpha: Float = 1.0f`	the alpha to stroke the path
`strokeLineWidth: Float = DefaultStrokeLineWidth`	the width of the line to stroke the path
`strokeLineCap: StrokeCap = DefaultStrokeLineCap`	specifies the linecap for a stroked path
`strokeLineJoin: StrokeJoin = DefaultStrokeLineJoin`	specifies the linejoin for a stroked path
`strokeLineMiter: Float = DefaultStrokeLineMiter`	specifies the miter limit for a stroked path
`pathFillType: PathFillType = DefaultFillType`	specifies the winding rule that decides how the interior of a `Path` is calculated.
`pathBuilder: PathBuilder.() -> Unit`	`PathBuilder` lambda for adding `PathNode`s to this path.

toPath

Cmn

Artifact: androidx.compose.ui:ui-graphics

View Source

fun List<PathNode>.toPath(target: Path = Path()): Path

Converts this list of PathNode into a Path by adding the appropriate commands to the target path. If target is not specified, a new Path instance is created. This method returns target or the newly created Path.