Litho: The component should be transparent outside the border

[ooga]

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

Version

0.6.2-SNAPSHOT (b0b286e1aeb45fd368b8e2764a6269f1590afa2e)

Issues and Steps to Reproduce

Apply rounded corner and background color on a component

Expected Behavior

The component should be transparent outside the border

Example code

Row.create(c)
    .child(
        Text.create(c)
            .textSizeSp(20)
            .text("This component has rounded corners + background color"))
    .border(
        Border.create(c)
            .widthDip(YogaEdge.ALL, 10)
            .color(YogaEdge.ALL, NiceColor.GREEN)
            .cornerEffect(40f)
            .build()
    )
    .backgroundColor(NiceColor.BLUE)
    .paddingDip(YogaEdge.ALL, 10)

[passy]

cc @xiphirx

[xiphirx]

Thanks for the report, I'll see what I can do about this. The issue is that the background and border are both handled separately, so one does not know of the other.

[xiphirx]

So looking more into this, there are some issues with adding in support. The biggest issue is clipping to an arbitrary border outline. While technically possible, it will introduce pretty big performance issues, especially on lower API levels, since clipPath is only hardware accelerated on APIs 18+. Additionally, clipPath isn't anti aliased with hardware acceleration.

We can definitely add in this support later on in the project's lifetime if we update the min sdk to 21+

[caiiiycuk]

Any updates on this?

[LukeXeon]

So looking more into this, there are some issues with adding in support. The biggest issue is clipping to an arbitrary border outline. While technically possible, it will introduce pretty big performance issues, especially on lower API levels, since clipPath is only hardware accelerated on APIs 18+. Additionally, clipPath isn't anti aliased with hardware acceleration.

We can definitely add in this support later on in the project's lifetime if we update the min sdk to 21+

Any updates on this?

[LukeXeon]

Maybe you can use outlineProvider(Outline) as a substitute.

[ihenk]

Any updates on this issure? We can't use "outlineProvider" to clip view in different corners.