How do you use compcreator and enhance extensions to create card list view?

Kindly need help to show me how to use compcreator and enhance extensions to create card list view.
I provided here the app view, the block code and the aia file as reference.
Actualy I need to display postal code vertically as card list view as the following display:

The use of the compcreator and enhance extensions looks advance to me so I don't know how to continue the current block code that I have created as follow:

blocks (18)

blocks (21)

The aia file as attached.
compcreator_01 (1).aia (59.0 KB)

Regards,
Asri

this demo did not use enhance, but it's should work same.

Thanks for this demo.
I will try to learn it.

This example by @Kevinkun uses enhance

1 Like

Thanks.
I will check it on Monday morning when I am online with my laptop.

How to get this template for our components (label or textbox) to display?

"{"$components":[{"$Name":"HorizontalArrangement1","$Type":"HorizontalArrangement","$Version":"4","Width":"-2","Uuid":"1931262341","$Components":[{"$Name":"VerticalArrangement1","$Type":"VerticalArrangement","$Version":"4","AlignHorizontal":"3","AlignVertical":"2","Height":"80","Width":"80","Uuid":"479817704","$Components":[{"$Name":"Image1","$Type":"Image","$Version":"6","Height":"50","Width":"50","Picture":"{1}","Uuid":"1437179931"}]},{"$Name":"VerticalArrangement2","$Type":"VerticalArrangement","$Version":"4","AlignVertical":"2","Height":"-2","Width":"-2","Uuid":"1591692913","$Components":[{"$Name":"Label1","$Type":"Label","$Version":"5","FontSize":"20","Text":"{2}","Uuid":"-380874673"},{"$Name":"Label2","$Type":"Label","$Version":"5","Text":"{3}","Uuid":"69457693"}]}]}],"$blocks":}"