Skip to content

Commit 1d426b8

Browse files
Merge remote-tracking branch 'remotes/origin/hotfix/hotfix-v28.1.33' into development
2 parents 2518f28 + 5c06402 commit 1d426b8

File tree

257 files changed

+1293
-711
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

257 files changed

+1293
-711
lines changed
Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
---
2+
layout: post
3+
title: Getting Started with WPF AI AssistView control | Syncfusion
4+
description: Learn about getting started with the Syncfusion WPF AI AssistView (SfAIAssistView) control with its basic features.
5+
platform: wpf
6+
control: AI AssistView
7+
documentation: ug
8+
---
9+
10+
# Getting Started with WPF AI AssistView
11+
12+
This section explains the steps required to add the Wpf [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control with its basic features.
13+
14+
## Structure of SfAIAssistView
15+
16+
![WPF SfAIAssistView Structure](aiassistview_images/wpf_aiassistview_control_structure.png)
17+
18+
## Adding WPF SfAIAssistview via xaml
19+
20+
1. Create a [Wpf desktop app for C# and .NET 6](https://learn.microsoft.com/en-us/dotnet/desktop/wpf/get-started/create-app-visual-studio?view=netdesktop-9.0).
21+
2. Add reference to [Syncfusion.SfChat.Wpf](https://www.nuget.org/packages/Syncfusion.SfChat.Wpf) NuGet.
22+
3. Import the control namespace `Syncfusion.UI.Xaml.Chat` in XAML or C# code.
23+
4. Initialize the [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control.
24+
25+
{% tabs %}
26+
{% highlight xaml %}
27+
28+
<Page
29+
x:Class="GettingStarted.MainPage"
30+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
31+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
32+
xmlns:local="using:GettingStarted"
33+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
34+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
35+
xmlns:syncfusion="using:Syncfusion.UI.Xaml.Chat"
36+
mc:Ignorable="d"
37+
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
38+
<Grid>
39+
<syncfusion:SfAIAssistView />
40+
</Grid>
41+
</Page>
42+
43+
{% endhighlight %}
44+
{% endtabs %}
45+
46+
## Adding WPF SfAIAssistview via C#
47+
48+
1. Create a [Wpf desktop app for C# and .NET 6](https://learn.microsoft.com/en-us/dotnet/desktop/wpf/get-started/create-app-visual-studio?view=netdesktop-9.0).
49+
2. Add reference to [Syncfusion.SfChat.Wpf](https://www.nuget.org/packages/Syncfusion.SfChat.Wpf) NuGet.
50+
3. Import the control namespace `Syncfusion.UI.Xaml.Chat` in XAML or C# code.
51+
4. Initialize the [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control.
52+
53+
{% tabs %}
54+
{% highlight C# %}
55+
56+
using Syncfusion.UI.Xaml.Chat;
57+
58+
namespace GettingStarted
59+
{
60+
/// <summary>
61+
/// Interaction logic for MainWindow.xaml
62+
/// </summary>
63+
public partial class MainWindow : Window
64+
{
65+
public MainWindow()
66+
{
67+
this.InitializeComponent();
68+
// Creating an instance of the AIAssistView control
69+
SfAIAssistView assistView = new SfAIAssistView();
70+
grid.Children.Add(assistView);
71+
}
72+
}
73+
}
74+
75+
{% endhighlight %}
76+
{% endtabs %}
77+
78+
79+
## Creating ViewModel for AI AssistView
80+
81+
Create a simple chat collection as shown in the following code example in a new class file. Save it as ViewModel.cs file.
82+
83+
{% tabs %}
84+
{% highlight C# %}
85+
86+
public class ViewModel : INotifyPropertyChanged
87+
{
88+
private ObservableCollection<object> chats;
89+
private Author currentUser;
90+
public ViewModel()
91+
{
92+
this.Chats = new ObservableCollection<object>();
93+
this.CurrentUser = new Author { Name="John"};
94+
this.GenerateMessages();
95+
}
96+
97+
private async void GenerateMessages()
98+
{
99+
this.Chats.Add( new TextMessage { Author = CurrentUser, Text = "What is WPF?" } );
100+
await Task.Delay(1000);
101+
this.Chats.Add( new TextMessage { Author = new Author { Name = "Bot" }, Text = "WPF is a user interface layer that contains modern controls and styles for building Windows apps." });
102+
}
103+
104+
public ObservableCollection<object> Chats
105+
{
106+
get
107+
{
108+
return this.chats;
109+
}
110+
set
111+
{
112+
this.chats = value;
113+
RaisePropertyChanged("Messages");
114+
}
115+
}
116+
117+
public Author CurrentUser
118+
{
119+
get
120+
{
121+
return this.currentUser;
122+
}
123+
set
124+
{
125+
this.currentUser = value;
126+
RaisePropertyChanged("CurrentUser");
127+
}
128+
}
129+
130+
131+
public void RaisePropertyChanged(string propName)
132+
{
133+
if (PropertyChanged != null)
134+
{
135+
PropertyChanged(this, new PropertyChangedEventArgs(propName));
136+
}
137+
}
138+
139+
140+
public event PropertyChangedEventHandler PropertyChanged;
141+
}
142+
143+
{% endhighlight %}
144+
{% endtabs %}
145+
146+
## Bind Messages
147+
148+
Set the ViewModel as the DataContext for the AI AssistView or the parent window. This allows data binding between the UI and the ViewModel properties.
149+
To populate AI AssistView, bind the chats in ViewModel to Messages property of AI AssistView.
150+
151+
{% tabs %}
152+
{% highlight xaml %}
153+
154+
<Page
155+
x:Class="GettingStarted.MainPage"
156+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
157+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
158+
xmlns:local="using:GettingStarted"
159+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
160+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
161+
xmlns:syncfusion="using:Syncfusion.UI.Xaml.Chat"
162+
mc:Ignorable="d"
163+
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
164+
<Grid>
165+
<Grid.DataContext>
166+
<local:ViewModel/>
167+
</Grid.DataContext>
168+
<syncfusion:SfAIAssistView CurrentUser="{Binding CurrentUser}"
169+
Messages="{Binding Chats}"/>
170+
</Grid>
171+
</Page>
172+
173+
{% endhighlight %}
174+
{% endtabs %}
175+
176+
![WPF AI AssistView control getting started](aiassistview_images/wpf_aiassistview_gettingstarted.png)

wpf/AI-AssistView/Getting-started.md

Lines changed: 72 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,26 @@
11
---
22
layout: post
33
title: Getting Started with WPF AI AssistView control | Syncfusion
4-
description: Learn about getting started with the Syncfusion WinUI AI AssistView (SfAIAssistView) control with its basic features.
4+
description: Learn about getting started with the Syncfusion WPF AI AssistView (SfAIAssistView) control with its basic features.
55
platform: wpf
66
control: AI AssistView
77
documentation: ug
88
---
99

1010
# Getting Started with WPF AI AssistView
1111

12-
This section explains the steps required to add the WinUI [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control with its basic features.
12+
This section explains the steps required to add the Wpf [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control with its basic features.
1313

14-
## Creating an application with WPF AI AssistView
14+
## Structure of SfAIAssistView
1515

16-
1. Create a [Wpf desktop app for C# and .NET 6](https://docs.microsoft.com/en-us/windows/apps/winui/winui3/get-started-winui3-for-desktop).
16+
![WPF SfAIAssistView Structure](aiassistview_images/wpf_aiassistview_control_structure.png)
17+
18+
## Adding WPF SfAIAssistview via xaml
19+
20+
1. Create a [Wpf desktop app for C# and .NET 6](https://learn.microsoft.com/en-us/dotnet/desktop/wpf/get-started/create-app-visual-studio?view=netdesktop-9.0).
1721
2. Add reference to [Syncfusion.SfChat.Wpf](https://www.nuget.org/packages/Syncfusion.SfChat.Wpf) NuGet.
1822
3. Import the control namespace `Syncfusion.UI.Xaml.Chat` in XAML or C# code.
19-
4. Initialize the [SfAIAssistView](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control.
20-
21-
## Initialize AI AssistView
23+
4. Initialize the [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control.
2224

2325
{% tabs %}
2426
{% highlight xaml %}
@@ -38,42 +40,47 @@ This section explains the steps required to add the WinUI [SfAIAssistView](https
3840
</Grid>
3941
</Page>
4042

41-
{% endhighlight %}
43+
{% endhighlight %}
44+
{% endtabs %}
4245

46+
## Adding WPF SfAIAssistview via C#
47+
48+
1. Create a [Wpf desktop app for C# and .NET 6](https://learn.microsoft.com/en-us/dotnet/desktop/wpf/get-started/create-app-visual-studio?view=netdesktop-9.0).
49+
2. Add reference to [Syncfusion.SfChat.Wpf](https://www.nuget.org/packages/Syncfusion.SfChat.Wpf) NuGet.
50+
3. Import the control namespace `Syncfusion.UI.Xaml.Chat` in XAML or C# code.
51+
4. Initialize the [SfAIAssistView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Chat.SfAIAssistView.html) control.
52+
53+
{% tabs %}
4354
{% highlight C# %}
4455

45-
// Creating an instance of the AI AssistView control.
46-
SfAIAssistView aiAssistView = new SfAIAssistView();
56+
using Syncfusion.UI.Xaml.Chat;
57+
58+
namespace GettingStarted
59+
{
60+
/// <summary>
61+
/// Interaction logic for MainWindow.xaml
62+
/// </summary>
63+
public partial class MainWindow : Window
64+
{
65+
public MainWindow()
66+
{
67+
this.InitializeComponent();
68+
// Creating an instance of the AIAssistView control
69+
SfAIAssistView assistView = new SfAIAssistView();
70+
grid.Children.Add(assistView);
71+
}
72+
}
73+
}
4774

4875
{% endhighlight %}
4976
{% endtabs %}
5077

78+
5179
## Creating ViewModel for AI AssistView
5280

5381
Create a simple chat collection as shown in the following code example in a new class file. Save it as ViewModel.cs file.
5482

5583
{% tabs %}
56-
57-
{% highlight xaml %}
58-
59-
<Page
60-
x:Class="GettingStarted.MainPage"
61-
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
62-
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
63-
xmlns:local="using:GettingStarted"
64-
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
65-
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
66-
xmlns:syncfusion="using:Syncfusion.UI.Xaml.Chat"
67-
mc:Ignorable="d"
68-
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
69-
<Grid>
70-
<syncfusion:SfAIAssistView CurrentUser="{Binding CurrentUser}"
71-
Messages="{Binding Chats}"/>
72-
</Grid>
73-
</Page>
74-
75-
{% endhighlight %}
76-
7784
{% highlight C# %}
7885

7986
public class ViewModel : INotifyPropertyChanged
@@ -89,9 +96,9 @@ Create a simple chat collection as shown in the following code example in a new
8996

9097
private async void GenerateMessages()
9198
{
92-
this.Chats.Add( new TextMessage { Author = CurrentUser, Text = "What is WinUI?" } );
99+
this.Chats.Add( new TextMessage { Author = CurrentUser, Text = "What is WPF?" } );
93100
await Task.Delay(1000);
94-
this.Chats.Add( new TextMessage { Author = new Author { Name = "Bot" }, Text = "WinUI is a user interface layer that contains modern controls and styles for building Windows apps." });
101+
this.Chats.Add( new TextMessage { Author = new Author { Name = "Bot" }, Text = "WPF is a user interface layer that contains modern controls and styles for building Windows apps." });
95102
}
96103

97104
public ObservableCollection<object> Chats
@@ -135,3 +142,35 @@ Create a simple chat collection as shown in the following code example in a new
135142

136143
{% endhighlight %}
137144
{% endtabs %}
145+
146+
## Bind Messages
147+
148+
Set the ViewModel as the DataContext for the AI AssistView or the parent window. This allows data binding between the UI and the ViewModel properties.
149+
To populate AI AssistView, bind the chats in ViewModel to Messages property of AI AssistView.
150+
151+
{% tabs %}
152+
{% highlight xaml %}
153+
154+
<Page
155+
x:Class="GettingStarted.MainPage"
156+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
157+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
158+
xmlns:local="using:GettingStarted"
159+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
160+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
161+
xmlns:syncfusion="using:Syncfusion.UI.Xaml.Chat"
162+
mc:Ignorable="d"
163+
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
164+
<Grid>
165+
<Grid.DataContext>
166+
<local:ViewModel/>
167+
</Grid.DataContext>
168+
<syncfusion:SfAIAssistView CurrentUser="{Binding CurrentUser}"
169+
Messages="{Binding Chats}"/>
170+
</Grid>
171+
</Page>
172+
173+
{% endhighlight %}
174+
{% endtabs %}
175+
176+
![WPF AI AssistView control getting started](aiassistview_images/wpf_aiassistview_gettingstarted.png)

0 commit comments

Comments
 (0)