# MeshGradientPainter

Artifact: [androidx.compose.ui:ui-graphics](https://developer.android.com/jetpack/androidx/releases/compose-ui) [View Source](https://cs.android.com/search?q=file:androidx/compose/ui/graphics/MeshGradient.kt+class:androidx.compose.ui.graphics.MeshGradientPainter) Added in [1.13.0-rc01](https://developer.android.com/jetpack/androidx/releases/compose-ui#1.13.0-rc01) Common/AllAndroid/JVM
- Cmn

  ```
  class MeshGradientPainter : Painter
  ```

|---|---|---|
| [kotlin.Any](https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-any/index.html) |||
| ↳ | [androidx.compose.ui.graphics.painter.Painter](https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter) ||
|   | ↳ | [androidx.compose.ui.graphics.MeshGradientPainter](https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/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 `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#(kotlin.Int,kotlin.Int,kotlin.Boolean,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#(kotlin.Int,kotlin.Int,kotlin.Boolean,kotlin.Function1)` (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 `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset` relative to the vertex position. The default value of a Bezier control point is `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset#Unspecified()`. If a control point is `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset#Unspecified()`, the renderer automatically infers a tangent based on the neighboring vertices to ensure C1 continuity (smooth transitions) across patches.

```kotlin
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 |
|---|---|
| `@https://developer.android.com/reference/kotlin/androidx/compose/runtime/annotation/RememberInComposition https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#MeshGradientPainter(kotlin.Int,kotlin.Int,kotlin.Boolean,kotlin.Function1)( rows: @https://developer.android.com/reference/kotlin/androidx/annotation/IntRange(from = 1) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html, columns: @https://developer.android.com/reference/kotlin/androidx/annotation/IntRange(from = 1) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html, hasBicubicColor: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html, block: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientScope.() -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html )` | Cmn |

| ### Public functions |
|---|---|---|
| `open operator https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#equals(kotlin.Any)(other: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-any/index.html?)` | Cmn |
| `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#hashCode()()` | Cmn |
| `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-string/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#toString()()` | Cmn |

| ### Protected functions |
|---|---|---|
| `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/drawscope/DrawScope.https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#(androidx.compose.ui.graphics.drawscope.DrawScope).onDraw()()` Implementation of drawing logic for instances of `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter`. | Cmn |

| ### Public properties |
|---|---|---|
| `open https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Size` | `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientPainter#intrinsicSize()` Return the intrinsic size of the `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter`. | Cmn |

### Inherited functions

From [androidx.compose.ui.graphics.painter.Painter](https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter) `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html` `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter#applyAlpha(kotlin.Float)(alpha: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html)`

Apply the provided alpha value returning true if it was applied successfully, or false if it could not be applied
Cmn `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html` `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter#applyColorFilter(androidx.compose.ui.graphics.ColorFilter)(colorFilter: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/ColorFilter?)`

Apply the provided color filter returning true if it was applied successfully, or false if it could not be applied
Cmn `open https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html` `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter#applyLayoutDirection(androidx.compose.ui.unit.LayoutDirection)(layoutDirection: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/LayoutDirection)`

Apply the appropriate internal configuration to positioning content with the given `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/LayoutDirection`
Cmn `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/drawscope/DrawScope.https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter#(androidx.compose.ui.graphics.drawscope.DrawScope).draw(androidx.compose.ui.geometry.Size,kotlin.Float,androidx.compose.ui.graphics.ColorFilter)(size: https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Size, alpha: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html, colorFilter: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/ColorFilter?)` Cmn

## Public constructors

### MeshGradientPainter

Cmn Added in [1.13.0-rc01](https://developer.android.com/jetpack/androidx/releases/compose-ui#1.13.0-rc01)

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

| Parameters |
|---|---|
| `rows: @https://developer.android.com/reference/kotlin/androidx/annotation/IntRange(from = 1) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html` | The number of patches along the vertical axis. Must be at least 1. |
| `columns: @https://developer.android.com/reference/kotlin/androidx/annotation/IntRange(from = 1) https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html` | The number of patches along the horizontal axis. Must be at least 1. |
| `hasBicubicColor: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html = false` | When true, uses Catmull-Rom interpolation for colors, resulting in smoother transitions compared to simpler and slightly faster bilinear interpolation. |
| `block: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientScope.() -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-unit/index.html` | Lambda invoked to configure the mesh. Use the provided `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/MeshGradientScope` to set the properties of each vertex. This block is executed in a `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/drawscope/DrawScope` and hence can observe reads to any mutable state. Any unconfigured vertex will have a default position of `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Offset#Zero()` and a default color of `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Color#Transparent()`. |

## Public functions

### equals

Cmn

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

### hashCode

Cmn

```
open fun hashCode(): Int
```

### toString

Cmn

```
open fun toString(): String
```

## Protected functions

### DrawScope.onDraw

Cmn Artifact: [androidx.compose.ui:ui-graphics](https://developer.android.com/jetpack/androidx/releases/compose-ui) [View Source](https://cs.android.com/search?q=file:androidx/compose/ui/graphics/MeshGradient.kt+function:onDraw)

```
protected open fun DrawScope.onDraw(): Unit
```

Implementation of drawing logic for instances of `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter`. This is invoked internally within `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter#(androidx.compose.ui.graphics.drawscope.DrawScope).draw(androidx.compose.ui.geometry.Size,kotlin.Float,androidx.compose.ui.graphics.ColorFilter)` after the positioning and configuring the `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter`

## Public properties

### intrinsicSize

Cmn

```
open val intrinsicSize: Size
```

Return the intrinsic size of the `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter`. If the there is no intrinsic size (i.e. filling bounds with an arbitrary color) return `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Size#Unspecified()`. If there is no intrinsic size in a single dimension, return `https://developer.android.com/reference/kotlin/androidx/compose/ui/geometry/Size` with `https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/-companion/-na-n.html` in the desired dimension. If a `https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/painter/Painter` does not have an intrinsic size, it will always draw within the full bounds of the destination