MeshGradientPainter


A MeshGradient is a 2D grid of patches defined by vertices. Each vertex has a position, color, and four optional Bezier control points (tangents) that define the curvature of the edges connecting neighboring vertices.

Grid Dimensions: For a given rows and columns (representing the number of patches), there are a total of (rows + 1) * (columns + 1) vertices. For example, a 1x1 mesh consists of 4 vertices forming a single rectangular patch.

Coordinate System: All positions and Bezier offsets use a normalized coordinate system where (0,0) is the top-left and (1,1) is the bottom-right of the drawing bounds.

Bezier Tangents: Bezier control points are provided as an Offset relative to the vertex position. The default value of a Bezier control point is Offset.Unspecified. If a control point is Offset.Unspecified, the renderer automatically infers a tangent based on the neighboring vertices to ensure C1 continuity (smooth transitions) across patches.

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.paint
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.MeshGradientPainter

val gradientPainter = remember {
    MeshGradientPainter(1, 1, hasBicubicColor = true) {
        // (row, column, position, color)
        setVertex(
            0,
            0,
            Offset(0f, 0f),
            Color.Red,
            rightControlPoint = Offset(0.5f, 0.5f),
        ) // Top-Left
        setVertex(0, 1, Offset(1f, 0f), Color.Blue) // Top-Right
        setVertex(1, 0, Offset(0f, 1f), Color.Green) // Bottom-Left
        setVertex(1, 1, Offset(1f, 1f), Color.Yellow) // Bottom-Right
    }
}

Box(Modifier.fillMaxSize().paint(gradientPainter))

Summary

Public constructors

@RememberInComposition
MeshGradientPainter(
    rows: @IntRange(from = 1) Int,
    columns: @IntRange(from = 1) Int,
    hasBicubicColor: Boolean,
    block: MeshGradientScope.() -> Unit
)
Cmn

Public functions

open operator Boolean
equals(other: Any?)
Cmn
open Int
Cmn
open String
Cmn

Protected functions

open Unit

Implementation of drawing logic for instances of Painter.

Cmn

Public properties

open Size

Return the intrinsic size of the Painter.

Cmn

Inherited functions

From androidx.compose.ui.graphics.painter.Painter
open Boolean
applyAlpha(alpha: Float)

Apply the provided alpha value returning true if it was applied successfully, or false if it could not be applied

Cmn
open Boolean

Apply the provided color filter returning true if it was applied successfully, or false if it could not be applied

Cmn
open Boolean

Apply the appropriate internal configuration to positioning content with the given LayoutDirection

Cmn
Unit
DrawScope.draw(size: Size, alpha: Float, colorFilter: ColorFilter?)
Cmn

Public constructors

MeshGradientPainter

@RememberInComposition
MeshGradientPainter(
    rows: @IntRange(from = 1) Int,
    columns: @IntRange(from = 1) Int,
    hasBicubicColor: Boolean = false,
    block: MeshGradientScope.() -> Unit
)
Parameters
rows: @IntRange(from = 1) Int

The number of patches along the vertical axis. Must be at least 1.

columns: @IntRange(from = 1) Int

The number of patches along the horizontal axis. Must be at least 1.

hasBicubicColor: Boolean = false

When true, uses Catmull-Rom interpolation for colors, resulting in smoother transitions compared to simpler and slightly faster bilinear interpolation.

block: MeshGradientScope.() -> Unit

Lambda invoked to configure the mesh. Use the provided MeshGradientScope to set the properties of each vertex. This block is executed in a DrawScope and hence can observe reads to any mutable state. Any unconfigured vertex will have a default position of Offset.Zero and a default color of Color.Transparent.

Public functions

equals

open operator fun equals(other: Any?): Boolean

hashCode

open fun hashCode(): Int

toString

open fun toString(): String

Protected functions

DrawScope.onDraw

protected open fun DrawScope.onDraw(): Unit

Implementation of drawing logic for instances of Painter. This is invoked internally within draw after the positioning and configuring the Painter

Public properties

intrinsicSize

open val intrinsicSizeSize

Return the intrinsic size of the Painter. If the there is no intrinsic size (i.e. filling bounds with an arbitrary color) return Size.Unspecified. If there is no intrinsic size in a single dimension, return Size with Float.NaN in the desired dimension. If a Painter does not have an intrinsic size, it will always draw within the full bounds of the destination