Windowscommunitytoolkit: ChatView control

[TheSETJ]

I suggest adding a new control specific for displaying chat messages, especially for those developers who want to always display the bottom of the list (like Telegram app). In this case, any new message should be inserted into the bottom of the list and also when user scroll up, older messages should load. It's exactly reverse of a normal ListView.

I tried to achieve this using 2 method:

1. Transform ListView's ScrollViewer and ListViewItem with ScaleY="-1" (with RenderTransformOrigin=".5,.5")
   or
2. Get ScrollViewer of the ListView and work with it

The first method will give both functionalities, but it has 2 problems. One is that scrolling is inverted (as expected) and next is that ListViewItem's transformation can be seen after page loads and every time a new item is added. Also, it's good to mention in this method, new items should be added using Insert method (I use an ObservableCollection).

The second method's problem is that many functionalities must be implemented (such as scroll down every time collection changes, load more item when user scroll up enough to pass threshold which needs many coding).

Sorry for bad grammar.

[Odonno]

I think I got exactly what you seek. https://docs.microsoft.com/en-us/windows/uwp/controls-and-patterns/inverted-lists

[TheSETJ]

Unfortunately:

The KeepLastItemInView enum value is available starting with Windows 10, version 1607. You can't use this value when your app runs on earlier versions of Windows 10.

Edit: I'm currently targeting version 1507 and it needs a huge amount of effort to change that and I think there are other developers like me (I've seen one on StackOverflow).

@Odonno

[Odonno]

Ok, so the objective is to backport the new features of ListView to previous versions of Windows 10.

[TheSETJ]

@Odonno I've created a small project to test ItemsUpdatingScrollMode property on ListView. It works fine for displaying bottom item in the list, although it seems not working properly with incremental loading.

More items should be loaded if the user scrolls up and passes the threshold at the _top_. But what I've seen in my project was that ListView loads more and more items without stopping (which means loading more items still is triggered at the _bottom_).

Edit: Here is a sample project: https://github.com/TheSETJ/InvertedListWithIncrementalLoading

[Odonno]

@TheSETJ Ok. I checked your sample and I take a look at the UWP samples here https://github.com/Microsoft/Windows-universal-samples/tree/master/Samples/XamlBottomUpList

About your samples, you tried to add more items (to the bottom) using IncrementalLoading but I suppose it was not designed to work with the "Chat" ListView because the IncrementalLoading is only at the bottom edge. In the UWP samples, devs are using the ScrollViewer and events to handle IncrementalLoading at the top.

The ListView even with new features does not contain enough features to properly make a ChatView. Here is what can add to a new control :

• IncrementalLoading at the Top of the list (and not bottom). We can take the UWP samples as a guide.
• When new messages are added, we could add a "button" that tells how many messages have been added and we could jump to the first unread message

[TheSETJ]

There is a note in XamlBottomUpList sample which I noticed:

Note: This is just delay loading the data, but isn't true data virtualization. A user that scrolls all the way to the beginning of the list will cause all the data to be loaded.

I think for implementation of new control it should be considered.

[nmetulev]

@TheSETJ, per our principles, all features will be supported for two Windows SDK for Windows 10 release cycles, meaning 1507 is no longer supported. My recommendation is to target a newer supported version of Windows 10 or use the sample that @Odonno has referred to.

I will close this issue for now, but feel free to re-open it if I misunderstood.

[Odonno]

@nmetulev Wouldn't be even better to have a control which mimic XamlBottomUpList in the Toolkit?

The fact is that it is not so easy to implement a nice ChatView control even with the current features of the ListView in the latest version of Windows 10. I mean, the IncrementalLoading of previous messages needs a lot of plumbing we can handle in the Toolkit.

[nmetulev]

@Odonno, I see. In that case, I'd propose we create a new issue and submit User Voice to gauge interest.

[Odonno]

@nmetulev And how will you name that control?

[skendrot]

Are chat view controls super common? How many apps need this capability?

[Odonno]

@skendrot Not so many I suppose. Not a top 1 priority but still needed, in my opinion.

[hermitdave]

@Odonno While it might be significant for those that need it, I agree with @skendrot it's a very specialised want / need. Not sure toolkit is the right place

[Pinox]

The consumer market probably won't need this, but go and look at most web based admin theme templates out there. Most of them include a chat view. So why would most theme templates include a chat view when nobody needs them ?

Following your logic that all controls in UWP toolkit must have "mass appeal" I feel IMHO is slightly flawed. Should the toolkit not cater for all segments including "niche" sometimes ?

I agree with @Odonno , my opinion is not based on what I think should be in the toolkit but what I see out there being used in 1000's of templates.

[hermitdave]

@Pinox, most people go to web / online support pages when needing to contact customer services. Maybe I don't use enough apps but can you look at the top 50 apps (desktop and mobile) and tell me how many super chat with customer services?

If you use Android or iOS, the same would be very helpful.

We could create all possible controls.. However there has to be an ask for it, otherwise toolkit will become unmaintainable every quickly. Create a uservoice save let's gauge community interest. Surely if that's such an important function, devs will want to show their interest.

[Pinox]

@hermitdave That is exactly my point. Don't look at the top 50 themes but at the top "admin" themes , most of them includes user profile, settings, messages and notifications.