Как я могу нарисовать тень для пути на холсте в jetpack compose

#android #canvas #draw #android-jetpack-compose #shadow

#Android #холст #рисовать #android-jetpack-compose #тень

Вопрос:

Я рисую пользовательскую форму для верхней панели в jetpack compose. Я хочу нарисовать тень для пути.

  val topBarShapePath = Path().apply {
        moveTo(dpToPixels(leftPadding), 0f)
        lineTo(dpToPixels(leftPadding), dpToPixels(dpValue = 110.dp))
        arcTo(
                Rect(
                        dpToPixels(leftPadding),
                        dpToPixels(dpValue = 110.dp),
                        dpToPixels(dpValue = 32.dp),
                        dpToPixels(dpValue = 135.dp)
                ), -180f, -90f, true)
        lineTo(
                dpToPixels(dpValue = triangleStartX),
                dpToPixels(dpValue = rectHeight))
        lineTo(
                dpToPixels(dpValue = screenWidth),
                dpToPixels(dpValue = triangleEndY)
        )
        lineTo(dpToPixels(dpValue = screenWidth), 0f)
        lineTo(dpToPixels(dpValue = leftPadding), 0f)
    }
    
    Column(
            modifier = Modifier
                    .fillMaxWidth()
                    .height(400.dp)
                    .drawBehind {
                        val finalWidth = 40.dp.toPx()
                        drawPath(
                                topBarShapePath,
                                color = topbarcolor)
                        drawOutline(
                            outline = Outline.Generic(
                                topBarShapePath),
                            brush = Brush.horizontalGradient(),
                            style = Stroke(
                                width = 1.dp.toPx(),
                            )
                        )
                    }
    )
 

Это код, который я использую для рисования фигуры, «drawOutline» должен был попытаться нарисовать тень для пути, но я не могу понять, как размыть линию.

Любая помощь приветствуется.

Вот скриншот результата, который я ищу: Изображение результата

Ответ №1:

На данный момент невозможно нарисовать тень на холсте, но вы можете сделать это Modifier.shadow , указав необходимую пользовательскую форму, например:

 class TopBarShape(/*some parameters*/): Shape {
    override fun createOutline(
        size: Size,
        layoutDirection: LayoutDirection,
        density: Density,
    ) = Outline.Generic(Path().apply {
        // your path code
    })
}

Modifier.shadow(elevation = 10.dp, shape = TopBarShape(/*your parameters*/))
 

К сожалению, этот модификатор не допускает особых изменений, это одна из самых популярных проблем с составлением, поэтому, надеюсь, это изменится в будущем, но, поскольку это не последняя 1.1-beta версия, я бы не ожидал этого, по крайней мере, до 1.2 .

Если вы все еще считаете, что рисование тени вручную является необходимой функцией, вы можете создать запрос функции.