1 Answer, 1 is accepted
Hello Luke,
You can use the byte array to image source converter: https://learn.microsoft.com/en-us/dotnet/communitytoolkit/maui/converters/byte-array-to-image-source-converter to convert the images.
Then pass the source to the image element.
Display Images in Chat:
To achieve this, you first must be able to render such a message requires a custom ItemTemplate for a message that contains images. In that template you can have an Image control or whatever else you need, it's an empty canvas ready for your code.
We surface a property called ItemTemplateSelector that will let you programmatically decide which ItemTemplate to use for every single data item in the ItemsSource. How you make that determination depends on how your data is structured and how you can even determine if there's media content to begin with.
To help you get started, we have a tutorial in our documentation that you can follow which will show you how to set up a ItemTemplateSelector. Please follow that completely in a side project. Please visit this documentation to get started => .NET MAUI Conversational UI Documentation - RadChat ItemTemplateSelector.
Regards,
Didi
Progress Telerik
Rank 1
Hi Luke,
I am not sure I understand what is missing from the docs to get started with the control.
Regarding to the Travel Assistance Example, the example is part of the Telerik MAUI Controls samples application. You can open the app in Visual Studio and debug its code.
In general the example uses a service and a complex scenario. For the image you have a method inside the TravelBotViewModel:
private ImageCardContext CreateImageContext(PickerItem cardPickerItem, Attachment attachment)
Also there is a CustomChatItemTemplateSelector.cs file. Inside the OnSelectTemplate you can check the logic which template to be selected.
The templates are defined inside the TravelAssistanceView.xaml file. You can review the complete example code and its implementation.