CurvedModifier

Artifact: androidx.wear.compose:compose-foundation

Added in 1.0.0

Kotlin |Java

sealed interface CurvedModifier

Known direct subclasses

CurvedModifier.Companion

CurvedModifier.Companion

The companion object CurvedModifier is the empty, default, or starter CurvedModifier that contains no Elements.

An ordered, immutable, collection of modifier elements that work with curved components, in a polar coordinate space.

This plays the same role as androidx.compose.ui.Modifier, but for the Curved composables.

Summary

Nested types
`object CurvedModifier.Companion : CurvedModifier` The companion object `CurvedModifier` is the empty, default, or starter `CurvedModifier` that contains no Elements.

Public companion functions
`open String`	`toString()`

Public functions
`open infix CurvedModifier`	`then(other: CurvedModifier)` Concatenates this curved modifier with another.

Extension functions
`CurvedModifier`	`CurvedModifier.angularGradientBackground( vararg colorStops: Pair<Float, Color>, cap: StrokeCap )` Specifies a sweep gradient background for a curved element.
`CurvedModifier`	`CurvedModifier.angularGradientBackground( colors: List<Color>, cap: StrokeCap )` Specifies a sweep gradient background for a curved element.
`CurvedModifier`	`CurvedModifier.background(color: Color, cap: StrokeCap)` Specified a solid background for a curved element.
`CurvedModifier`	`CurvedModifier.radialGradientBackground( vararg colorStops: Pair<Float, Color>, cap: StrokeCap )` Specifies a radial gradient background for a curved element.
`CurvedModifier`	`CurvedModifier.radialGradientBackground( colors: List<Color>, cap: StrokeCap )` Specifies a radial gradient background for a curved element.
`CurvedModifier`	`CurvedModifier.padding(all: Dp)` Apply `all` dp space around the component.
`CurvedModifier`	`CurvedModifier.padding(paddingValues: ArcPaddingValues)` Apply additional space along the edges of the content.
`CurvedModifier`	`CurvedModifier.padding(radial: Dp, angular: Dp)` Apply `angular` dp space before and after the component, and `radial` dp space to the outer and inner edges.
`CurvedModifier`	`CurvedModifier.padding(outer: Dp, inner: Dp, before: Dp, after: Dp)` Apply additional space along the edges of the content.
`CurvedModifier`	`CurvedModifier.parentDataModifier(modifyParentData: (Any?) -> Any)` A `CurvedModifier` that provides data to the parent layout.
`CurvedModifier`	`CurvedModifier.weight( weight: @FloatRange(from = 0.0, fromInclusive = false) Float )` Size the element's proportional to its `weight` relative to other weighted sibling elements in the container (this will be the height in a `curvedColumn` and the width in a `curvedRow`).
`CurvedModifier`	`CurvedModifier.angularSize(sweepDegrees: Float)` Specify the sweep (angular size) for the content.
`CurvedModifier`	`CurvedModifier.angularSizeDp(angularWidth: Dp)` Specify the sweep (arc length) for the content in Dp.
`CurvedModifier`	`CurvedModifier.radialSize(thickness: Dp)` Specify the radialSize (thickness) for the content.
`CurvedModifier`	`CurvedModifier.size( sweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float, thickness: Dp )` Specify the dimensions (sweep and thickness) for the content.
`CurvedModifier`	`CurvedModifier.sizeIn( minSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float, maxSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float, minThickness: Dp, maxThickness: Dp )` Specify the dimensions of the content to be restricted between the given bounds.

Public companion functions

toString

open fun toString(): String

Public functions

then

Added in 1.0.0

open infix fun then(other: CurvedModifier): CurvedModifier

Concatenates this curved modifier with another.

Returns a CurvedModifier representing this curved modifier followed by other in sequence.

Extension functions

angularGradientBackground

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.angularGradientBackground(
    vararg colorStops: Pair<Float, Color>,
    cap: StrokeCap = StrokeCap.Butt
): CurvedModifier

Specifies a sweep gradient background for a curved element.

Example usage:

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.wear.compose.foundation.CurvedLayout
import androidx.wear.compose.foundation.CurvedModifier
import androidx.wear.compose.foundation.CurvedTextStyle
import androidx.wear.compose.foundation.angularGradientBackground
import androidx.wear.compose.foundation.basicCurvedText
import androidx.wear.compose.foundation.padding
import androidx.wear.compose.foundation.radialGradientBackground

CurvedLayout(modifier = Modifier.fillMaxSize()) {
    basicCurvedText(
        "Radial",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .radialGradientBackground(0f to Color.White, 1f to Color.Black)
            .padding(5.dp)
    )
    basicCurvedText(
        "Angular",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .angularGradientBackground(0f to Color.White, 1f to Color.Black)
            .padding(5.dp)
    )
}

Parameters
`vararg colorStops: Pair<Float, Color>`	Colors and their offset in the gradient area. Note that the offsets should be in ascending order. 0 means where the curved element starts laying out, 1 means the end
`cap: StrokeCap = StrokeCap.Butt`	How to start and end the background.

angularGradientBackground

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.angularGradientBackground(
    colors: List<Color>,
    cap: StrokeCap = StrokeCap.Butt
): CurvedModifier

Specifies a sweep gradient background for a curved element.

Parameters
`colors: List<Color>`	Colors in the gradient area. Gradient goes in the clockwise direction.
`cap: StrokeCap = StrokeCap.Butt`	How to start and end the background.

background

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.background(color: Color, cap: StrokeCap = StrokeCap.Butt): CurvedModifier

Specified a solid background for a curved element.

Parameters
`color: Color`	The color to use to paint the background.
`cap: StrokeCap = StrokeCap.Butt`	How to start and end the background.

radialGradientBackground

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.radialGradientBackground(
    vararg colorStops: Pair<Float, Color>,
    cap: StrokeCap = StrokeCap.Butt
): CurvedModifier

Specifies a radial gradient background for a curved element.

Example usage:

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.wear.compose.foundation.CurvedLayout
import androidx.wear.compose.foundation.CurvedModifier
import androidx.wear.compose.foundation.CurvedTextStyle
import androidx.wear.compose.foundation.angularGradientBackground
import androidx.wear.compose.foundation.basicCurvedText
import androidx.wear.compose.foundation.padding
import androidx.wear.compose.foundation.radialGradientBackground

CurvedLayout(modifier = Modifier.fillMaxSize()) {
    basicCurvedText(
        "Radial",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .radialGradientBackground(0f to Color.White, 1f to Color.Black)
            .padding(5.dp)
    )
    basicCurvedText(
        "Angular",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .angularGradientBackground(0f to Color.White, 1f to Color.Black)
            .padding(5.dp)
    )
}

Parameters
`vararg colorStops: Pair<Float, Color>`	Colors and their offset in the gradient area. Note that the offsets should be in ascending order. 0 means the outer curve and 1 means the inner curve of the curved element.
`cap: StrokeCap = StrokeCap.Butt`	How to start and end the background.

radialGradientBackground

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.radialGradientBackground(
    colors: List<Color>,
    cap: StrokeCap = StrokeCap.Butt
): CurvedModifier

Specifies a radial gradient background for a curved element.

Parameters
`colors: List<Color>`	Colors in the gradient area. Gradient goes from the outer curve to the inner curve of the curved element.
`cap: StrokeCap = StrokeCap.Butt`	How to start and end the background.

padding

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.padding(all: Dp = 0.dp): CurvedModifier

Apply all dp space around the component.

Parameters
`all: Dp = 0.dp`	The space added to all edges.

padding

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.padding(paddingValues: ArcPaddingValues): CurvedModifier

Apply additional space along the edges of the content.

Parameters
`paddingValues: ArcPaddingValues`	The `ArcPaddingValues` to use. See that class and factory methods to see how paddings can be specified.

padding

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.padding(radial: Dp = 0.dp, angular: Dp = 0.dp): CurvedModifier

Apply angular dp space before and after the component, and radial dp space to the outer and inner edges.

Parameters
`radial: Dp = 0.dp`	The space added to the outer and inner edges of the content, in dp.
`angular: Dp = 0.dp`	The space added before and after the content, in dp.

padding

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.padding(outer: Dp, inner: Dp, before: Dp, after: Dp): CurvedModifier

Apply additional space along the edges of the content. Dimmensions are in dp. For before and after they will be considered as if they are at the midpoint of the content (for conversion between dimension and angle).

Parameters
`outer: Dp`	The space to add to the outer edge of the content (away from the center of the containing CurvedLayout)
`inner: Dp`	The space to add to the inner edge of the content (towards the center of the containing CurvedLayout)
`before: Dp`	The space added before the component, if it was draw clockwise. This is the edge of the component with the "smallest" angle.
`after: Dp`	The space added after the component, if it was draw clockwise. This is the edge of the component with the "biggest" angle.

parentDataModifier

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.parentDataModifier(modifyParentData: (Any?) -> Any): CurvedModifier

A CurvedModifier that provides data to the parent layout. The parent data is commonly used to inform the parent how the child Layout should be measured and positioned.

Parameters
`modifyParentData: (Any?) -> Any`	provides a parentData, given the parentData provided through the modifier's chain.

weight

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.weight(
    weight: @FloatRange(from = 0.0, fromInclusive = false) Float
): CurvedModifier

Size the element's proportional to its weight relative to other weighted sibling elements in the container (this will be the height in a curvedColumn and the width in a curvedRow). The parent will divide the space remaining after measuring unweighted child elements and distribute it according to this weight.

Example usage:

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.sp
import androidx.wear.compose.foundation.CurvedLayout
import androidx.wear.compose.foundation.CurvedModifier
import androidx.wear.compose.foundation.angularSize
import androidx.wear.compose.foundation.background
import androidx.wear.compose.foundation.basicCurvedText
import androidx.wear.compose.foundation.curvedRow
import androidx.wear.compose.foundation.weight

CurvedLayout(modifier = Modifier
    .fillMaxSize()
    .background(Color.White)) {
    // Evenly spread A, B & C in a 90 degree angle.
    curvedRow(
        modifier = CurvedModifier.angularSize(90f)
    ) {
        basicCurvedText("A")
        curvedRow(
            modifier = CurvedModifier.weight(1f),
        ) { }
        basicCurvedText("B")
        curvedRow(
            modifier = CurvedModifier.weight(1f),
        ) { }
        basicCurvedText("C")
    }
}

Parameters
`weight: @FloatRange(from = 0.0, fromInclusive = false) Float`	The proportional size to give to this element, as related to the total of all weighted siblings. Must be positive.

angularSize

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.angularSize(sweepDegrees: Float): CurvedModifier

Specify the sweep (angular size) for the content.

Parameters
`sweepDegrees: Float`	Indicates the sweep (angular size) of the content.

angularSizeDp

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.angularSizeDp(angularWidth: Dp): CurvedModifier

Specify the sweep (arc length) for the content in Dp. The arc length will be measured at the center of the item, except for basicCurvedText, where it will be measured at the text baseline.

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.size
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.wear.compose.foundation.CurvedLayout
import androidx.wear.compose.foundation.CurvedModifier
import androidx.wear.compose.foundation.CurvedTextStyle
import androidx.wear.compose.foundation.angularSize
import androidx.wear.compose.foundation.angularSizeDp
import androidx.wear.compose.foundation.background
import androidx.wear.compose.foundation.basicCurvedText
import androidx.wear.compose.foundation.radialSize
import androidx.wear.compose.foundation.size

CurvedLayout(modifier = Modifier.fillMaxSize()) {
    basicCurvedText(
        "45 deg",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .background(Color.White)
            .size(sweepDegrees = 45f, thickness = 40.dp),
    )
    basicCurvedText(
        "40 dp",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .background(Color.Yellow)
            .radialSize(40.dp)
            .angularSizeDp(40.dp),
    )
}

Parameters
`angularWidth: Dp`	Indicates the arc length of the content in Dp.

radialSize

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.radialSize(thickness: Dp): CurvedModifier

Specify the radialSize (thickness) for the content.

Parameters
`thickness: Dp`	Indicates the thickness of the content.

size

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.size(
    sweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float,
    thickness: Dp
): CurvedModifier

Specify the dimensions (sweep and thickness) for the content.

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.size
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.wear.compose.foundation.CurvedLayout
import androidx.wear.compose.foundation.CurvedModifier
import androidx.wear.compose.foundation.CurvedTextStyle
import androidx.wear.compose.foundation.angularSize
import androidx.wear.compose.foundation.angularSizeDp
import androidx.wear.compose.foundation.background
import androidx.wear.compose.foundation.basicCurvedText
import androidx.wear.compose.foundation.radialSize
import androidx.wear.compose.foundation.size

CurvedLayout(modifier = Modifier.fillMaxSize()) {
    basicCurvedText(
        "45 deg",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .background(Color.White)
            .size(sweepDegrees = 45f, thickness = 40.dp),
    )
    basicCurvedText(
        "40 dp",
        style = {
            CurvedTextStyle(
                fontSize = 16.sp,
                color = Color.Black
            )
        },
        modifier = CurvedModifier
            .background(Color.Yellow)
            .radialSize(40.dp)
            .angularSizeDp(40.dp),
    )
}

Parameters
`sweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float`	Indicates the sweep (angular size) of the content.
`thickness: Dp`	Indicates the thickness (radial size) of the content.

sizeIn

Artifact: androidx.wear.compose:compose-foundation

View Source

fun CurvedModifier.sizeIn(
    minSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float = 0.0f,
    maxSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float = 360.0f,
    minThickness: Dp = 0.dp,
    maxThickness: Dp = Dp.Infinity
): CurvedModifier

Specify the dimensions of the content to be restricted between the given bounds.

Parameters
`minSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float = 0.0f`	the minimum angle (in degrees) for the content.
`maxSweepDegrees: @FloatRange(from = 0.0, to = 360.0) Float = 360.0f`	the maximum angle (in degrees) for the content.
`minThickness: Dp = 0.dp`	the minimum thickness (radial size) for the content.
`maxThickness: Dp = Dp.Infinity`	the maximum thickness (radial size) for the content.

CurvedModifier

Summary

Nested types

Public companion functions

Public functions

Extension functions

Public companion functions

toString

Public functions

then

Extension functions

angularGradientBackground

angularGradientBackground

background

radialGradientBackground

radialGradientBackground

padding

padding

padding

padding

parentDataModifier

weight

angularSize

angularSizeDp

radialSize

size

sizeIn