How to set the repeater item layout?


#1

Hi,

I am trying to implement a repeater inside a flexboxlayout but I am not getting the behaviour of flexboxlayout to the repeated elements. all elements are rendering in the first line only.
My code looks like this

<FlexboxLayout width="100%" flexWrap="wrap">
<Repeater items="{{ displayImages }}">
<Repeater.itemTemplate>
<Label text="{{ $value }}" backgroundColor="red" />
</Repeater.itemTemplate>
</Repeater>
</FlexboxLayout>

after the row filled up I want the next element to be placed in the next row.!!
can anyone suggest me how can I do that ??
I never done this before.

Thanks.


#2

@sagar1911
That is not how you set the repeater’s layout,

you have to set it inside

<Repeater.itemsLayout>
      <FlexboxLayout width="100%" flexWrap="wrap" />
</Repeater.itemsLayout>

you can refer the docs here

https://docs.nativescript.org/cookbook/ui/repeater#define-the-repeater-itemslayout-property-default-is-stacklayout-with-orientationvertical


#3

Oldest post but saved my day.