It is possible to create Ribbon on Card View

Discuss
, , ,
14

Import :dove: Floating View: float your component. [FREE] :dove: Extension.

And Use It’s OverlapView Block.

component_method
component_method270×129 3.16 KB

mainComponent Will Be Your CardView
[Make Sure Elevation Of This Main CardView Is Set To 0]

childComponent Will Be Your Ribbon Image

In gravity Set Numbers From 0 To 8.
This Number Will Set Where Your Image Will Overlap On The Main CardView.

Untitled
Untitled149×190 3.38 KB

In margins Set A List Of 4 Items, Each Item Will Be A Number, From 0 To ∞

blocks
blocks163×104 2.04 KB

This Number List Will Set Margins Between The Main CardView And Overlapped Image, In This Order -
Untitled

Usage Example :

These Are The 2 Components On Screen -
[Surely You Can Do It With Dynamic Components :slightly_smiling_face:]

Untitled
Untitled385×790 23.2 KB

  1. Green Card Is The Main Card View

  2. Orange Card Is The Ribbon Image

Blocks -

blocks
blocks426×211 9.7 KB

gravity = 2 = TopRight

Result -

image
image540×1200 33.7 KB

3 Likes