RadItemsControl ScrollTo(index) - How Do I Scroll An items Control Programatically

1 Answer 77 Views
ItemsControl
billy
Top achievements
Rank 2
Iron
Iron
Iron
billy asked on 23 Aug 2023, 12:28 AM

I have an items control that I am loading in a descending order (chat formate) and then will add new messages async.

I need to be able to scroll to the bottom of the list when I load the collection, and again after every message. I see a handler , but not sure how to implement this in codebehind file.

Do you have an example of how to scroll programatically or is there a way to invert the RaditemsControl orientation?

Thanks


Billy

1 Answer, 1 is accepted

Sort by
1
Accepted
Maria
Telerik team
answered on 24 Aug 2023, 12:04 PM

Hello Billy, 

The ItemsControl does not have ScrollTo method. I could suggest you to use our Chat control. For additional information you can refer to our documentation article and check if it fits your scenario: .NET MAUI Conversational UI (Chat) Overview. Another option that I can suggest is to use our ItemsView control. This is not an official Telerik control, but the API of the control is public and you can take a look. The control has a public ScrollTo method there. In addition this control is used in Chat and TreeView controls we have.  

If the scenario you want to achieve cannot be covered from the ItemsView or Chat, send me some videos/images with the exact case. 

Regards,
Maria
Progress Telerik

A brand new .NET MAUI course was just added to the Virtual Classroom. The training course is developed to help you get started with the Telerik UI for .NET MAUI components and features. It aims to put you in the shoes of an engineer who adds new features to an existing application. You can check it out at https://learn.telerik.com
billy
Top achievements
Rank 2
Iron
Iron
Iron
commented on 24 Aug 2023, 03:10 PM

The chat UI is awesome. Can't believe I missed it in my research. One last question, how can I swap the alignment between the agent and the user? Right now it shows the end user messages left aligned and the "agent" right aligned. Standard chat is reverse of that. I haven't seen a flag or anything to set to swap those. Can you help me? I'm attaching a screen below. I just want to swap the alignment showing agent left and end user right.
billy
Top achievements
Rank 2
Iron
Iron
Iron
commented on 24 Aug 2023, 03:20 PM

neverming. Sheesh. Just swapping the default "Author" on the Xaml control. 

Thanks again for the response. Great control.

Lance | Manager Technical Support
Telerik team
commented on 24 Aug 2023, 03:39 PM

Hi Billy, that's correct. The reason for this is because the TemplateSelector that chooses which ItemTemplate to use, has logic that return a left-aligned template or right-aligned template based on the author's value.

As an example, take a look at how I broke this out in my CRM demo https://github.com/telerik/telerik-xamarin-forms-samples/blob/671b6c7292f2566e353d9351868f4402592067fc/ArtGalleryCRM/ArtGalleryCRM.Forms/Views/SupportPage.xaml#L253 That's the selector. Now, look farther up in the resources and notice how some templates are left-aligned, and others are right-aligned? This is the magic of what's happening.

Learn more here => .NET MAUI Conversational UI Documentation - RadChat ItemTemplateSelector.

Tags
ItemsControl
Asked by
billy
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Maria
Telerik team
Share this question
or