Telerik blogs
Building Beautiful Conversational UI with Telerik UI for WPF_870x220

Learn how to use the Conversational UI control in Telerik UI for WPF to style the UI of your chatbot, easily aligning it with the rest of your application's user interface.

Chatbots are a very convenient way to handle a limited amount of specialized processes that replace the need to talk to an expert over the phone, or to use complicated UIs such as long forms or processes. If you are looking for a way to implement one in your WPF application, then you should look no further, because Progress has got your back:

IntroductionGif

Telerik UI for WPF has a Conversational UI component (or RadChat, the name of the control), which is our answer to the increasing demand for an easy way to create a chatbot UI that fits the style of the rest of your desktop application. In general, RadChat is designed to be used with any of the chatbot services available today. It is also suitable for creation of peer to peer chats. You can check the available QSF demos, which demonstrate possible integrations with Azure and DialogFlow.

Here are some of the main features of the control:

Messages

What is a chat without messages 😊. The RadChat provides a range of them which can be used for a variety of different scenarios. You can add anything from basic text messages and GIF messages, to more complex carousel messages containing a list of other image messages. You can check them all out in our documentation.

GifMessage

CarouselMessage

Cards

Some messages need to display more information and here is where all the available cards come in to play. Currently there are specialized cards for displaying images, products, weather and flight information. However, you can easily extend them or create a new one if you need.

WeatherCard

FlightCard

ToolBar

If you would like to provide additional functionality, you can do that by adding a command to the ToolBarCommands collection of the RadChat. A button will be created for each command and you can customize its look by providing a ToolBarCommandTemplateSelector.

ToolBar

Suggested Actions

The RadChat gives you the ability to easily interact with users by adding items to its SuggestedActions collection. You also have the option to control what happens when an action is chosen by handling the SuggestedActionReported event.

Suggested Actions

Typing Indicator

You have the option to include a typing indicator to indicate that a user/bot is typing. You can control its visibility, text and add an icon. This is done though the TypeIndicatorVisibility, TypeIndicatorText and TypeIndicatorIcon properties of the RadChat.

TypingIndicator

Check It Out and Share Your Feedback

So, what are you waiting for? Go ahead and try Conversational UI yourself. There isn’t any better way of getting a feel for it. If you have any questions or suggestions, don’t hesitate to contact us. You can post on our forum, propose improvements in our feedback portal, or just reach out in the comments below.

If this is the first time you are hearing about Telerik UI for WPF, it's a comprehensive suite of over 120 UI controls for building high-performance office-inspired WPF business applications. You can learn more about the toolkit at our website and take it out for a spin with a free 30-day trial.


Vladimir Stoyanov
About the Author

Vladimir Stoyanov

Vladimir Stoyanov is a technical support engineer at Progress. He is passionate about his work and really enjoys learning new things. In his free time he likes to travel as much as possible, play all kinds of sports and go on hiking trips with friends.

Related Posts

Comments

Comments are disabled in preview mode.