Commands View Styling
The Commands View of the AIPrompt control provides the following customization properties:
-
CommandStyle
(Style
)—Defines the style that is to be applied to the AIPrompt command. -
CommandGroupStyle
(Style
)—Defines the style that is to be applied to theRadExpander
representing an AIPrompt command group.
The following example demonstrates how to modify the commands' appearance:
1. Add Style
properties with TargetType
set to AIPromptCommandItemView
for each command representation and AIPromptCommandGroupView
for a command group to the page's resources:
<Style x:Key="MyCommandLabelStyle" TargetType="Label">
<Setter Property="TextColor" Value="#00897B" />
</Style>
<Style x:Key="MyCommandStyle" TargetType="telerik:AIPromptCommandItemView">
<Setter Property="LabelStyle" Value="{StaticResource MyCommandLabelStyle}" />
</Style>
<Style x:Key="MyExpanderHeaderTextStyle" TargetType="Label">
<Setter Property="TextColor" Value="#00897B" />
</Style>
<Style x:Key="MyCommandExpanderStyle" TargetType="telerik:RadExpander">
<Setter Property="HeaderTextStyle" Value="{StaticResource MyExpanderHeaderTextStyle}" />
</Style>
<Style x:Key="MyCommandGroupStyle" TargetType="telerik:AIPromptCommandGroupView">
<Setter Property="ExpanderStyle" Value="{StaticResource MyCommandExpanderStyle}" />
</Style>
2. Add the RadAIPrompt
control with CommandStyle
and CommandGroupStyle
properties applied:
<telerik:RadAIPrompt x:Name="aiPrompt"
InputText="{Binding InputText}"
PromptRequestCommand="{Binding PromptRequestCommand}"
OutputItems="{Binding OutputItems}"
Commands="{Binding Commands}"
CommandStyle="{StaticResource MyCommandStyle}"
CommandGroupStyle="{StaticResource MyCommandGroupStyle}" />
Here is the result after applying the CommandStyle
and CommandGroupStyle
: