NativeScript ListView with Too Many Rows

Question

When I render a ListView in NativeScript, I get more rows than I have data. Is there a way to control this? I would like to see the minimum number of rows required to display my data.

 <Page xmlns="http://www.nativescript.org/tns.xsd"
       loaded="load">
  <ListView items="{{ data }}">
    <ListView.itemTemplate>
      <Button text="{{ name }}" tap="{{ action }}"/>
    </ListView.itemTemplate>
  </ListView>
</Page>

I tried adding a height={{ data.length }} attribute to my ListView, but that just served to make all the data disappear, suggesting I don't know what the height is. — Doug, Dec 11 '15 at 03:06
Behind the ListView, there is UITavleView in iOS and it is its default behavior. So far there isn't a suitable way of changing this. — Neli Chakarova, Dec 11 '15 at 11:38
To be clear, there is no way to change this in the iOS API? This has nothing to do with not knowing a NativeScript attribute? — Doug, Dec 12 '15 at 19:34
Currently there isn't a way to do it with NativeScript. For changes through the native platform, this [link](http://stackoverflow.com/questions/14520185/how-to-remove-empty-cells-in-uitableview) might be helpful. — Neli Chakarova, Dec 14 '15 at 11:19
I ran into a similar problem, and ended up jamming a Repeater inside of a ScrollView. It's a little hacky, but it gets the job done. — SpoonIsBad, Dec 23 '15 at 02:25

score 1 · Answer 1 · answered Mar 20 '16 at 01:41

For short lists, use a Repeater. For the separators, just use a StackLayout with a height of 1 and set the background-color to some grey. It will look just like a ListView. ListViews are meant to be used with large datasets that require virtualization of the rows.

NativeScript ListView with Too Many Rows

1 Answers1