You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: wpf/AI-AssistView/Open-AI.md
+87-86Lines changed: 87 additions & 86 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -211,95 +211,16 @@ Set the ViewModel as the DataContext for the AI AssistView or the parent window.
211
211

212
212
213
213
## Customize AI Response Rendering with ViewTemplateSelector in SfAIAssistView
214
+
Use the [ViewTemplateSelector](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html#Syncfusion_UI_Xaml_Chat_SfAIAssistView_ViewTemplateSelector) property to assign a DataTemplateSelector that controls how messages (including AI responses) are rendered in SfAIAssistView. The selector can return different DataTemplates based on the message type or role (user/assistant/system), enabling rich presentations such as:
215
+
- Markdown (via a Markdown viewer like MdXaml)
216
+
- FlowDocument-based layouts
217
+
- Images and custom visuals
218
+
- HTML (via a WebBrowser control or third-party HTML renderer)
214
219
215
-
ViewTemplateSelector allows you to control how AI responses are visually rendered in SfAIAssistView. By assigning a custom DataTemplate, you can format messages using markdown, HTML, or other visual layouts to enable rich, styled content in the message view.
216
-
217
-
{% tabs %}
218
-
{% highlight C# %}
219
-
220
-
public class AIMessage : NotificationObject, ITextMessage
221
-
{
222
-
223
-
private string solution;
224
-
225
-
/// <summary>
226
-
/// Gets or sets the text to be display as the message.
227
-
/// </summary>
228
-
public string Solution
229
-
{
230
-
get
231
-
{
232
-
return this.solution;
233
-
}
234
-
set
235
-
{
236
-
this.solution = value;
237
-
RaisePropertyChanged(nameof(Solution));
238
-
}
239
-
}
240
-
241
-
private Author author;
242
-
243
-
/// <summary>
244
-
/// Gets or sets the author to be display in the message.
245
-
/// </summary>
246
-
public Author Author
247
-
{
248
-
get { return author; }
249
-
set
250
-
{
251
-
author = value;
252
-
RaisePropertyChanged(nameof(Author));
253
-
}
254
-
}
255
-
256
-
private DateTime dateTime;
257
-
258
-
/// <summary>
259
-
/// Gets or sets the date and time details when the message was created.
260
-
/// </summary>
261
-
public DateTime DateTime
262
-
{
263
-
get { return dateTime; }
264
-
set
265
-
{
266
-
dateTime = value;
267
-
RaisePropertyChanged(nameof(DateTime));
268
-
}
269
-
}
270
-
271
-
private string text;
272
-
273
-
/// <summary>
274
-
/// Gets or sets the text to be display as the message.
275
-
/// </summary>
276
-
public string Text
277
-
{
278
-
get { return text; }
279
-
set { text = value; RaisePropertyChanged(nameof(Text)); }
280
-
}
281
-
}
282
-
283
-
public class ViewTemplateSelector : DataTemplateSelector
284
-
{
285
-
public DataTemplate AITemplate { get; set; }
286
-
287
-
public override DataTemplate SelectTemplate(object item, DependencyObject container)
288
-
{
289
-
if (item is AIMessage)
290
-
{
291
-
return AITemplate;
292
-
}
293
-
return null;
294
-
}
295
-
}
296
-
297
-
{% endhighlight %}
298
-
{% endtabs %}
220
+
This approach lets you tailor the appearance of assistant messages without modifying your data model.
0 commit comments