问题
I have some trouble with ListView
where the ItemsSource
can be very important (over 5'000 items).
My application is that of a Chat Application consisting of two ListViews.
- One on the left, the thread ListView showing a list of active thread (conversation)
- One on the right, the conversation ListView showing all messages exchanged.
I am using the DataTemplate
pattern so that each item of my conversation ListView is customized as follow :
A chat Bubble using Coding4Fun
package : http://www.geekchamp.com/articles/getting-started-with-the-coding4fun-toolkit-windows-phone-chatbubble-control
Each Chat Bubble has two TextBlock
(one for the message content, the other for the timestamp).
Later, I intend to add pictures to this messages.
When user clicks on a conversation from the left-panel ListView, the main conversation ListView is loaded with the corresponding conversation (observable) collection. If that collection is particularly big (in one case, I have more than 10'000 messages), the conversation ListView does show the content, but as soon as a switch to another thread and back to the previous, the content does not show anymore, although it's here, it's loaded. Starting to scroll, makes the ListView flickering and the content, therefore, is visible but severly flickering. If I stop scrolling, no content is showed, showing an empty list.
Further tests showed that this problem occurs only with large collection in concordance of usage of ScrollIntoView()
method: indeed, I whish to show the bottom of my conversation ListView each time a user clicks on a thread so that he can read the last messages instead of the oldes, therefore saving him to have to scroll all the way to the bottom, each time.
I confirmed this issue by commenting out the line where I make the ListView to scroll to the bottom. The flickering problem is gone.
Finally, as I wrote my question, I found a stackoverflow question that seems to be my case: Windows Store universal app - ListView oddity
Unfortunately, the solution is not very clear. How can I solve my issue ? How should I use VirtualizingStackPanel/>
inside a ListView that uses alread <ListView.ItemContainerStyle>
, ListView.ItemTemplate>
and <DataTemplate>
?
回答1:
The solution to my flickering problem and how to implement UI Virtualization (normaly introduced in Windows 8.1) as described here https://www.microsoftpressstore.com/articles/article.aspx?p=2216995&seqNum=4 is as follow :
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
To be placed within a ListView
scope !
Orientation
must be defined ( Vertical | Horizontal
) otherwise a Critial Failure
occurs !
UI Virtualization enhance large GridViews and ListViews so that huge amount data can be effeciently loaded without slowing down the UI nore blocking it for too long.
回答2:
Honnestly the answer to your problem would be to redesign your application.
Never should there be so many items in a listview. You need to filter out some results
Example : Sort the question names /types/ etc and only show the corresponding (such as tags in Stack Overflow)
Only show the last lines of the conversation when you load it and allow the user to load more (like facebook's messenger)
Take a look at this C# listview maximum number of rows
As the answer says. The amount of items in your listview should be limited by common sense. 5k items in one listview is an incredibly high amount for a user to scroll through.
I am assuming your bubbles are in some kind of list or array. You can use Linq to get what you want. Take a look at this LINQ query to select top five
来源:https://stackoverflow.com/questions/29845771/windows-store-app-listview-flickering-content-dispappearing