Commands View
The Commands View displays a set of predefined commands, which the user can browse and execute. The commands are passed to the component through the Commands property, which expects a collection of AIPromptCommandBase objects.
The Commands View is represented by the AIPromptCommandView class and provides the following properties:
-
Commands(IList<AIPromptCommandBase>)—Defines a list of AIPrompt commands. -
CommandTappedCommand(ICommand)—Defines a command that is executed an AIPrompt command is pressed.
For more details on how you can define a
AIPromptCommand, go to the Commands topic.
Here is an example of a simple AIPromptCommandView:
<telerik:AIPromptCommandView Commands="{Binding Commands}"
CommandTappedCommand="{Binding CommandTappedCommand}" />
and the referenced ViewModel class:
public class ViewModel : NotifyPropertyChangedBase
{
private string inputText = string.Empty;
private IList<AIPromptOutputItem> outputItems = new ObservableCollection<AIPromptOutputItem>();
private ICommand promptRequestCommand;
private ICommand copyCommand;
private ICommand retryCommand;
private IList<AIPromptCommandBase> commands = new ObservableCollection<AIPromptCommandBase>();
private ICommand commandTappedCommand;
private ICommand outputItemRatingChangedCommand;
public ViewModel()
{
this.promptRequestCommand = new Command(this.ExecutePromptRequestCommand, this.CanExecutePromptRequestCommand);
this.copyCommand = new Command(this.ExecuteCopyCommand);
this.retryCommand = new Command(this.ExecuteRetryCommand);
this.commands.Add(new AIPromptCommand { ImageSource = new FontImageSource() { FontFamily = TelerikFont.Name, Size = 12, Glyph = TelerikFont.IconPaste}, Text = "Simplify", });
this.commands.Add(new AIPromptCommand { ImageSource = new FontImageSource() { FontFamily = TelerikFont.Name, Size = 12, Glyph = TelerikFont.IconReset }, Text = "Check Syntax" });
this.commandTappedCommand = new Command(this.ExecuteCommandTappedCommand);
this.outputItemRatingChangedCommand = new Command(this.ExecuteOutputItemRatingChangedCommand);
}
public string InputText { get { return this.inputText; } set { this.UpdateValue(ref this.inputText, value); } }
public IList<AIPromptOutputItem> OutputItems { get { return this.outputItems; } }
public ICommand PromptRequestCommand { get { return this.promptRequestCommand; } }
public ICommand CopyCommand { get { return this.copyCommand; } }
public ICommand RetryCommand { get { return this.retryCommand; } }
public IList<AIPromptCommandBase> Commands { get { return this.commands; } }
public ICommand CommandTappedCommand { get { return this.commandTappedCommand; } }
public ICommand OutputItemRatingChangedCommand { get { return this.outputItemRatingChangedCommand; } }
private bool CanExecutePromptRequestCommand(object arg)
{
string text = (string)arg;
return !string.IsNullOrEmpty(text?.Trim());
}
private void ExecutePromptRequestCommand(object arg)
{
AIPromptOutputItem outputItem = new AIPromptOutputItem
{
Title = "Generated with AI:",
InputText = arg?.ToString(),
ResponseText = "This is the response from the AI in relation to your request. For real prompt processing, please connect the component to a preferred AI service."
};
this.OutputItems.Insert(0, outputItem);
this.InputText = string.Empty;
}
private async void ExecuteCopyCommand(object arg)
{
AIPromptOutputItem outputItem = (AIPromptOutputItem)arg;
await Clipboard.Default.SetTextAsync(outputItem.ResponseText);
await Application.Current.MainPage.DisplayAlert("Copied to clipboard:", outputItem.ResponseText, "Ok");
}
private void ExecuteRetryCommand(object arg)
{
AIPromptOutputItem outputItem = (AIPromptOutputItem)arg;
this.ExecutePromptRequestCommand(outputItem.InputText);
this.InputText = string.Empty;
}
private void ExecuteOutputItemRatingChangedCommand(object arg)
{
AIPromptOutputItem outputItem = (AIPromptOutputItem)arg;
Application.Current.MainPage.DisplayAlert("Response rating changed:", $"The rating of response {outputItems.IndexOf(outputItem)} has changed.", "Ok");
}
private void ExecuteCommandTappedCommand(object arg)
{
AIPromptCommand aiPromptCommand = arg as AIPromptCommand;
if (aiPromptCommand == null)
{
return;
}
Application.Current.MainPage.DisplayAlert("Command executed:", aiPromptCommand.Text + " command has been executed.", "Ok");
}
}