[Previewer] Inline function will cause the preview to fail

[zhangz1han]

Create the following function:

import androidx.compose.ui.graphics.BlendMode
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.DefaultGroupName
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.unit.Dp
import kotlin.contracts.InvocationKind
import kotlin.contracts.contract

inline fun buildImageVector(
    name: String = DefaultGroupName,
    defaultWidth: Dp,
    defaultHeight: Dp,
    viewportWidth: Float,
    viewportHeight: Float,
    tintColor: Color = Color.Unspecified,
    tintBlendMode: BlendMode = BlendMode.SrcIn,
    autoMirror: Boolean = false,
    builderAction: ImageVector.Builder.() -> Unit
): ImageVector {
    contract { callsInPlace(builderAction, InvocationKind.EXACTLY_ONCE) }
    return ImageVector.Builder(
        name, defaultWidth, defaultHeight,
        viewportWidth, viewportHeight,
        tintColor, tintBlendMode, autoMirror
    ).apply(builderAction).build()
}

Using this function in ImageVector will cause the preview to fail:

[egorikftp]

Hello, what is the expected behavior in this case?

[zhangz1han]

Hello, what is the expected behavior in this case?

Success code

package app.mihon.ui.icons.filled

import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.unit.dp
import app.mihon.ui.icons.MihonIcons

val MihonIcons.Filled.GitHub: ImageVector
    get() {
        if (_github != null) {
            return _github!!
        }
        _github = ImageVector.Builder(
            name = "GitHub",
            defaultWidth = 24.dp,
            defaultHeight = 24.dp,
            viewportWidth = 24f,
            viewportHeight = 24f
        ).apply {
            path(fill = SolidColor(Color.Black)) {
                moveTo(12f, 0.297f)
                curveToRelative(-6.63f, 0f, -12f, 5.373f, -12f, 12f)
                curveToRelative(0f, 5.303f, 3.438f, 9.8f, 8.205f, 11.385f)
                curveToRelative(0.6f, 0.113f, 0.82f, -0.258f, 0.82f, -0.577f)
                curveToRelative(0f, -0.285f, -0.01f, -1.04f, -0.015f, -2.04f)
                curveToRelative(-3.338f, 0.724f, -4.042f, -1.61f, -4.042f, -1.61f)
                curveTo(4.422f, 18.07f, 3.633f, 17.7f, 3.633f, 17.7f)
                curveToRelative(-1.087f, -0.744f, 0.084f, -0.729f, 0.084f, -0.729f)
                curveToRelative(1.205f, 0.084f, 1.838f, 1.236f, 1.838f, 1.236f)
                curveToRelative(1.07f, 1.835f, 2.809f, 1.305f, 3.495f, 0.998f)
                curveToRelative(0.108f, -0.776f, 0.417f, -1.305f, 0.76f, -1.605f)
                curveToRelative(-2.665f, -0.3f, -5.466f, -1.332f, -5.466f, -5.93f)
                curveToRelative(0f, -1.31f, 0.465f, -2.38f, 1.235f, -3.22f)
                curveToRelative(-0.135f, -0.303f, -0.54f, -1.523f, 0.105f, -3.176f)
                curveToRelative(0f, 0f, 1.005f, -0.322f, 3.3f, 1.23f)
                curveToRelative(0.96f, -0.267f, 1.98f, -0.399f, 3f, -0.405f)
                curveToRelative(1.02f, 0.006f, 2.04f, 0.138f, 3f, 0.405f)
                curveToRelative(2.28f, -1.552f, 3.285f, -1.23f, 3.285f, -1.23f)
                curveToRelative(0.645f, 1.653f, 0.24f, 2.873f, 0.12f, 3.176f)
                curveToRelative(0.765f, 0.84f, 1.23f, 1.91f, 1.23f, 3.22f)
                curveToRelative(0f, 4.61f, -2.805f, 5.625f, -5.475f, 5.92f)
                curveToRelative(0.42f, 0.36f, 0.81f, 1.096f, 0.81f, 2.22f)
                curveToRelative(0f, 1.606f, -0.015f, 2.896f, -0.015f, 3.286f)
                curveToRelative(0f, 0.315f, 0.21f, 0.69f, 0.825f, 0.57f)
                curveTo(20.565f, 22.092f, 24f, 17.592f, 24f, 12.297f)
                curveToRelative(0f, -6.627f, -5.373f, -12f, -12f, -12f)
            }
        }.build()
        return _github!!
    }

@Suppress("ObjectPropertyName")
private var _github: ImageVector? = null

Invalidation code

package app.mihon.ui.icons.filled

import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.unit.dp
import app.mihon.ui.graphics.vector.buildImageVector
import app.mihon.ui.icons.MihonIcons

val MihonIcons.Filled.GitHub2: ImageVector
    get() {
        if (_github != null) {
            return _github!!
        }
        _github = buildImageVector(
            name = "GitHub",
            defaultWidth = 24.dp,
            defaultHeight = 24.dp,
            viewportWidth = 24f,
            viewportHeight = 24f
        ) {
            path(fill = SolidColor(Color.Black)) {
                moveTo(12f, 0.297f)
                curveToRelative(-6.63f, 0f, -12f, 5.373f, -12f, 12f)
                curveToRelative(0f, 5.303f, 3.438f, 9.8f, 8.205f, 11.385f)
                curveToRelative(0.6f, 0.113f, 0.82f, -0.258f, 0.82f, -0.577f)
                curveToRelative(0f, -0.285f, -0.01f, -1.04f, -0.015f, -2.04f)
                curveToRelative(-3.338f, 0.724f, -4.042f, -1.61f, -4.042f, -1.61f)
                curveTo(4.422f, 18.07f, 3.633f, 17.7f, 3.633f, 17.7f)
                curveToRelative(-1.087f, -0.744f, 0.084f, -0.729f, 0.084f, -0.729f)
                curveToRelative(1.205f, 0.084f, 1.838f, 1.236f, 1.838f, 1.236f)
                curveToRelative(1.07f, 1.835f, 2.809f, 1.305f, 3.495f, 0.998f)
                curveToRelative(0.108f, -0.776f, 0.417f, -1.305f, 0.76f, -1.605f)
                curveToRelative(-2.665f, -0.3f, -5.466f, -1.332f, -5.466f, -5.93f)
                curveToRelative(0f, -1.31f, 0.465f, -2.38f, 1.235f, -3.22f)
                curveToRelative(-0.135f, -0.303f, -0.54f, -1.523f, 0.105f, -3.176f)
                curveToRelative(0f, 0f, 1.005f, -0.322f, 3.3f, 1.23f)
                curveToRelative(0.96f, -0.267f, 1.98f, -0.399f, 3f, -0.405f)
                curveToRelative(1.02f, 0.006f, 2.04f, 0.138f, 3f, 0.405f)
                curveToRelative(2.28f, -1.552f, 3.285f, -1.23f, 3.285f, -1.23f)
                curveToRelative(0.645f, 1.653f, 0.24f, 2.873f, 0.12f, 3.176f)
                curveToRelative(0.765f, 0.84f, 1.23f, 1.91f, 1.23f, 3.22f)
                curveToRelative(0f, 4.61f, -2.805f, 5.625f, -5.475f, 5.92f)
                curveToRelative(0.42f, 0.36f, 0.81f, 1.096f, 0.81f, 2.22f)
                curveToRelative(0f, 1.606f, -0.015f, 2.896f, -0.015f, 3.286f)
                curveToRelative(0f, 0.315f, 0.21f, 0.69f, 0.825f, 0.57f)
                curveTo(20.565f, 22.092f, 24f, 17.592f, 24f, 12.297f)
                curveToRelative(0f, -6.627f, -5.373f, -12f, -12f, -12f)
            }
        }
        return _github!!
    }

@Suppress("ObjectPropertyName")
private var _github: ImageVector? = null

But I just found that this code will also fail to preview, I don't know why

package app.mihon.ui.icons.filled

import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.group
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.unit.dp
import app.mihon.ui.icons.MihonIcons

val MihonIcons.Filled.History: ImageVector
    get() {
        if (_history != null) {
            return _history!!
        }
        _history = ImageVector.Builder(
            name = "History",
            defaultWidth = 24.dp,
            defaultHeight = 24.dp,
            viewportWidth = 24f,
            viewportHeight = 24f
        ).apply {
            path(fill = SolidColor(Color.Black)) {
                moveTo(12f, 8f)
                lineTo(12f, 13f)
                lineTo(16.28f, 15.54f)
                lineTo(17f, 14.33f)
                lineTo(13.5f, 12.25f)
                lineTo(13.5f, 8f)
                lineTo(12f, 8f)
                close()
            }
            group(pivotX = 13f, pivotY = 12f) {
                path(fill = SolidColor(Color.Black)) {
                    moveTo(13f, 3f)
                    curveTo(8.03f, 3f, 4f, 7.03f, 4f, 12f)
                    lineTo(1f, 12f)
                    lineTo(4.89f, 15.89f)
                    lineTo(4.96f, 16.03f)
                    lineTo(9f, 12f)
                    lineTo(6f, 12f)
                    curveTo(6f, 8.13f, 9.13f, 5f, 13f, 5f)
                    curveTo(16.87f, 5f, 20f, 8.13f, 20f, 12f)
                    curveTo(20f, 15.87f, 16.87f, 19f, 13f, 19f)
                    curveTo(11.07f, 19f, 9.32f, 18.21f, 8.06f, 16.94f)
                    lineTo(6.64f, 18.36f)
                    curveTo(8.27f, 19.99f, 10.51f, 21f, 13f, 21f)
                    curveTo(17.97f, 21f, 22f, 16.97f, 22f, 12f)
                    curveTo(22f, 7.03f, 17.97f, 3f, 13f, 3f)
                    close()
                    moveTo(13f, 3f)
                    close()
                }
            }
        }.build()
        return _history!!
    }

@Suppress("ObjectPropertyName")
private var _history: ImageVector? = null

[egorikftp]

Thanks, will check
Last case will be covered by #231

[zhangz1han]

Thanks, will check Last case will be covered by #231

I have checked this issue. In the first example, I used path(fill = SolidColor(Color.Black)), but it can still be previewed successfully. Maybe this is not the reason.

[egorikftp]

@zhangzih4n
For now I'm not supporting custom functions for building ImageVector like

inline fun buildImageVector(
    name: String = DefaultGroupName,
    defaultWidth: Dp,
    defaultHeight: Dp,
    viewportWidth: Float,
    viewportHeight: Float,
    tintColor: Color = Color.Unspecified,
    tintBlendMode: BlendMode = BlendMode.SrcIn,
    autoMirror: Boolean = false,
    builderAction: ImageVector.Builder.() -> Unit
): ImageVector {}

Will keep this if I found solution later.

Also, I tried to run preview for this icon and it's working. Maybe you faced some cache issue and you saw message from error icon

package app.mihon.ui.icons.filled

import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.unit.dp
import app.mihon.ui.graphics.vector.buildImageVector
import app.mihon.ui.icons.MihonIcons

val MihonIcons.Filled.GitHub2: ImageVector
    get() {
        if (_github != null) {
            return _github!!
        }
        _github = buildImageVector(
            name = "GitHub",
            defaultWidth = 24.dp,
            defaultHeight = 24.dp,
            viewportWidth = 24f,
            viewportHeight = 24f
        ) {
            path(fill = SolidColor(Color.Black)) {
                moveTo(12f, 0.297f)
                curveToRelative(-6.63f, 0f, -12f, 5.373f, -12f, 12f)
                curveToRelative(0f, 5.303f, 3.438f, 9.8f, 8.205f, 11.385f)
                curveToRelative(0.6f, 0.113f, 0.82f, -0.258f, 0.82f, -0.577f)
                curveToRelative(0f, -0.285f, -0.01f, -1.04f, -0.015f, -2.04f)
                curveToRelative(-3.338f, 0.724f, -4.042f, -1.61f, -4.042f, -1.61f)
                curveTo(4.422f, 18.07f, 3.633f, 17.7f, 3.633f, 17.7f)
                curveToRelative(-1.087f, -0.744f, 0.084f, -0.729f, 0.084f, -0.729f)
                curveToRelative(1.205f, 0.084f, 1.838f, 1.236f, 1.838f, 1.236f)
                curveToRelative(1.07f, 1.835f, 2.809f, 1.305f, 3.495f, 0.998f)
                curveToRelative(0.108f, -0.776f, 0.417f, -1.305f, 0.76f, -1.605f)
                curveToRelative(-2.665f, -0.3f, -5.466f, -1.332f, -5.466f, -5.93f)
                curveToRelative(0f, -1.31f, 0.465f, -2.38f, 1.235f, -3.22f)
                curveToRelative(-0.135f, -0.303f, -0.54f, -1.523f, 0.105f, -3.176f)
                curveToRelative(0f, 0f, 1.005f, -0.322f, 3.3f, 1.23f)
                curveToRelative(0.96f, -0.267f, 1.98f, -0.399f, 3f, -0.405f)
                curveToRelative(1.02f, 0.006f, 2.04f, 0.138f, 3f, 0.405f)
                curveToRelative(2.28f, -1.552f, 3.285f, -1.23f, 3.285f, -1.23f)
                curveToRelative(0.645f, 1.653f, 0.24f, 2.873f, 0.12f, 3.176f)
                curveToRelative(0.765f, 0.84f, 1.23f, 1.91f, 1.23f, 3.22f)
                curveToRelative(0f, 4.61f, -2.805f, 5.625f, -5.475f, 5.92f)
                curveToRelative(0.42f, 0.36f, 0.81f, 1.096f, 0.81f, 2.22f)
                curveToRelative(0f, 1.606f, -0.015f, 2.896f, -0.015f, 3.286f)
                curveToRelative(0f, 0.315f, 0.21f, 0.69f, 0.825f, 0.57f)
                curveTo(20.565f, 22.092f, 24f, 17.592f, 24f, 12.297f)
                curveToRelative(0f, -6.627f, -5.373f, -12f, -12f, -12f)
            }
        }
        return _github!!
    }

@Suppress("ObjectPropertyName")
private var _github: ImageVector? = null

[zhangz1han]

Also, I tried to run preview for this icon and it's working. Maybe you faced some cache issue and you saw message from error icon

I tried Invalidate Caches in Android Studio, but it still fails to preview.

Is there any way to check the cause of the problem?

[dev-gvs]

I've encountered similar problem with functions:

import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.PathData
import androidx.compose.ui.graphics.vector.group
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.unit.dp

val TestIcon: ImageVector
    get() {
        if (_TestIcon != null) {
            return _TestIcon!!
        }
        _TestIcon = getTestIcon()
        return _TestIcon!!
    }

fun getTestIcon(fill: Brush = SolidColor(Color(0xFF121A48))): ImageVector {
    return ImageVector.Builder(
        name = "TestIcon",
        defaultWidth = 16.dp,
        defaultHeight = 16.dp,
        viewportWidth = 16f,
        viewportHeight = 16f
    ).apply {
        group(
            clipPathData = PathData {
                moveTo(0f, 0.936f)
                horizontalLineToRelative(16f)
                verticalLineToRelative(16f)
                horizontalLineToRelative(-16f)
                close()
            }
        ) {
            path(fill = fill) {
                moveTo(8f, 6.976f)
                horizontalLineTo(0.703f)
                curveTo(0.777f, 4.863f, 1.878f, 3.009f, 3.523f, 1.903f)
                curveTo(3.902f, 1.649f, 4.401f, 1.78f, 4.661f, 2.154f)
                lineTo(8f, 6.976f)
                close()
                moveTo(11.65f, 6.063f)
                curveTo(11.65f, 5.056f, 12.468f, 4.238f, 13.475f, 4.238f)
                horizontalLineTo(14.387f)
                curveTo(14.892f, 4.238f, 15.3f, 4.646f, 15.3f, 5.151f)
                curveTo(15.3f, 5.655f, 14.892f, 6.063f, 14.387f, 6.063f)
                horizontalLineTo(13.475f)
                verticalLineTo(7.888f)
                curveTo(13.475f, 8.607f, 13.31f, 9.32f, 12.99f, 9.984f)
                curveTo(12.671f, 10.648f, 12.198f, 11.253f, 11.604f, 11.76f)
                curveTo(11.011f, 12.268f, 10.307f, 12.673f, 9.531f, 12.947f)
                curveTo(8.756f, 13.22f, 7.926f, 13.363f, 7.087f, 13.363f)
                curveTo(6.249f, 13.363f, 5.419f, 13.22f, 4.644f, 12.947f)
                curveTo(3.868f, 12.673f, 3.164f, 12.268f, 2.571f, 11.76f)
                curveTo(1.977f, 11.253f, 1.507f, 10.648f, 1.185f, 9.984f)
                curveTo(0.862f, 9.32f, 0.7f, 8.607f, 0.7f, 7.888f)
                horizontalLineTo(11.65f)
                verticalLineTo(6.063f)
                close()
                moveTo(2.981f, 13.363f)
                curveTo(3.344f, 13.363f, 3.692f, 13.507f, 3.949f, 13.764f)
                curveTo(4.206f, 14.021f, 4.35f, 14.369f, 4.35f, 14.732f)
                curveTo(4.35f, 15.095f, 4.206f, 15.443f, 3.949f, 15.7f)
                curveTo(3.692f, 15.956f, 3.344f, 16.101f, 2.981f, 16.101f)
                curveTo(2.618f, 16.101f, 2.27f, 15.956f, 2.013f, 15.7f)
                curveTo(1.757f, 15.443f, 1.612f, 15.095f, 1.612f, 14.732f)
                curveTo(1.612f, 14.369f, 1.757f, 14.021f, 2.013f, 13.764f)
                curveTo(2.27f, 13.507f, 2.618f, 13.363f, 2.981f, 13.363f)
                close()
                moveTo(9.825f, 14.732f)
                curveTo(9.825f, 14.369f, 9.969f, 14.021f, 10.226f, 13.764f)
                curveTo(10.483f, 13.507f, 10.831f, 13.363f, 11.194f, 13.363f)
                curveTo(11.557f, 13.363f, 11.905f, 13.507f, 12.162f, 13.764f)
                curveTo(12.418f, 14.021f, 12.563f, 14.369f, 12.563f, 14.732f)
                curveTo(12.563f, 15.095f, 12.418f, 15.443f, 12.162f, 15.7f)
                curveTo(11.905f, 15.956f, 11.557f, 16.101f, 11.194f, 16.101f)
                curveTo(10.831f, 16.101f, 10.483f, 15.956f, 10.226f, 15.7f)
                curveTo(9.969f, 15.443f, 9.825f, 15.095f, 9.825f, 14.732f)
                close()
            }
        }
    }.build()
}

@Suppress("ObjectPropertyName")
private var _TestIcon: ImageVector? = null

IDE: Android Studio Meerkat 2024.3.1 Patch 1