ListView add more items in Metro apps?

Question

I have a metro application in which I have a Listview and service data contains above 100 items. Initially when am loading listview in my page it has to display only 8 items plu

Answer 1

Take a look to this article: http://www.silverlightplayground.org/post/2012/06/10/Metro-Incrementally-load-GridView-and-ListView-with-ISupportIncrementalLoading.aspx.

Answer 2

There are a couple of solutions -- all depending on the work that you want to undertake. Also, I would suggest that you don't have a "More" button if you can help it -- it's not the best user interaction. Option 2 is going to give you the best experience.

Option 1

Use WinJS.Binding.List as your data source -- using this you can manipulate it like a JavaScript Array (e.g. push, pop etc). As you add & remove items from the list, the list view will react to those changes.

Full details are here.

Option 2

Create a VirtualDataSource derivation that is intimately aware of the ways in which you can request your data, and can offer up a consistent interface to the ListView. This enables your UI to be completely flexible to it's layout, and request enough data to satisfy the available space, while virtualizing the UI elements (better memory/performance), and the data (ensuring only the data needed by the user is requested.

Full worked example here.