Border radius doesn't render the same way as ViewOutlineProvider radius.

[hipczor]

• I have searched existing issues and this is not a duplicate

Version

0.39.0

Issues and Steps to Reproduce

The sample below creates a rounded border with a background. Since, currently, it is not possible to clip background to its border (#235), I've tried to create a ViewOutlineProvider and set the same radius as I set to the border.

val componentContext = ComponentContext(this)

        val radius = 56 //px
        
        val row = Row.create(componentContext)
            .marginDip(YogaEdge.ALL, 56f)
            .backgroundColor(Color.RED)
            .border(
                Border.create(componentContext)
                    .radiusPx(radius)
                    .color(YogaEdge.ALL, Color.YELLOW)
                    .widthPx(YogaEdge.ALL, 24)
                    .build()
            )
            .clipToOutline(true)
            .outlineProvider(
                object : ViewOutlineProvider() {
                    override fun getOutline(view: View, outline: Outline) {
                        outline.setRoundRect(0, 0, view.width, view.height, radius.toFloat())
                    }
                }
            )
            .child(
                Text.create(componentContext)
                    .text("Border sample")
                    .marginDip(YogaEdge.ALL, 16f)
                    .build()
            )
            .build()

        setContentView(
            LithoView.create(
                componentContext,
                Column.create(componentContext).child(row).build()
            )
        )

This is the result, the radius on the border is not calculated the same way it is on the view outline provider (and any Canvas since I've tried to align it also with an image using Glide image transformer)

Expected Behavior

The border should render the radius correctly so it can be aligned with other methods to round edges of other components.