How to create drawable/bitmap with a nested image which has one corner out of the circle background?

Question

I need to create smth like below. Image should be nested inside the circle background and one of the corners should be out of this circle "pocket". I think we need smth like a mask but don't understand what instruments I can use to achieve this effect.

Answer 1

You can apply a custom shape to an Image composable.
Something like:

    Image(
        painter = painterResource(R.drawable.xxx),
        contentDescription = "xxxx",
        contentScale = ContentScale.Crop,
        modifier = Modifier
            .size(100.dp)
            .clip(
                RoundedCornerShape(
                    topStartPercent = 50,
                    topEndPercent = 0, //square corner
                    bottomEndPercent = 50,
                    bottomStartPercent = 50
                )
            )
    )

Otherwise you can define you custom path using:

class MyShape(topStart: CornerSize) : Shape {

    override fun createOutline(
        size: Size,
        layoutDirection: LayoutDirection,
        density: Density
    ): Outline {
        val myPath = Path().apply {
            //....
        }
        return Outline.Generic(path = myPath)
    }
}