SfAIAssistView class

The SfAIAssistView widget is designed to build a chat interface for chatbots powered by AI.

It provides extensive customization options, allowing developers to modify the appearance and behavior of chat bubbles, input composer, action buttons, and more.

The SfAIAssistView includes the following elements and features:

  • Messages: A list of AssistMessage objects that will be displayed in the chat interface as either a request message from the user or a response message from AI. Each AssistMessage includes details such as the message text, timestamp, and author information.
  • Composer: This is the primary text editor where the user can compose new request messages.
  • Action Button: This represents the send button. Pressing this action button invokes the AssistActionButton.onPressed callback with the text entered in the default AssistComposer.
  • Suggestions: The response set for a message can be included with the response itself, and choosing this suggestion can be treated as a new request message.
  • Footer items: This is a collection action bar items for a response message. Particularly useful for adding a action items such as like, dislike, copy, retry and etc.
  • Placeholder Builder: The SfAIAssistView.placeholderBuilder allows you to specify a custom widget to display when there are no messages in the chat. This is particularly useful for presenting users with a relevant or visually appealing message indicating that the conversation is currently empty.
  • Bubble Header Builder: The SfAIAssistView.bubbleHeaderBuilder allows you to specify a custom widget to display as a header for each chat bubble. This is particularly useful for displaying additional information such as the sender's name and the timestamp associated with each message.
  • Bubble Avatar Builder: The SfAIAssistView.bubbleAvatarBuilder allows you to specify a custom widget to display as an avatar within each chat bubble. This feature is especially useful for showing user avatars or profile pictures within the chat interface.
  • Bubble Content Builder: The SfAIAssistView.bubbleContentBuilder allows you to specify a custom widget to display as the content within each chat bubble. This is useful for customizing how the message content is presented, such as using different background colors, borders, or padding.
  • Bubble Footer Builder: The SfAIAssistView.bubbleFooterBuilder allows you to specify a custom widget that will be displayed as a footer within each chat bubble. This is particularly useful for displaying timestamps or other additional information related to the message.

The following example demonstrates how to create a simple chat interface using the SfAIAssistView widget.

List<AssistMessage> _messages = <AssistMessage>[];

void _generateAIResponse(String request) {
  // Connect to your preferred AI and get response for the request.
  String response = 'AI response'; // Replace with actual AI response.
  setState(() {
    _messages.add(AssistMessage.response(data: response));
  });
}

SfAIAssistView view = SfAIAssistView(
  messages: _messages,
  actionButton: AssistActionButton(
    onPressed: (String data) {
      _messages.add(AssistMessage.request(data: data));
      _generateAIResponse(data);
    },
  ),
);
Inheritance

Constructors

SfAIAssistView({Key? key, required List<AssistMessage> messages, AssistComposer? composer = const AssistComposer(), AssistActionButton? actionButton, WidgetBuilder? placeholderBuilder, AssistWidgetBuilder? bubbleHeaderBuilder, AssistWidgetBuilder? bubbleAvatarBuilder, AssistWidgetBuilder? bubbleContentBuilder, AssistWidgetBuilder? bubbleFooterBuilder, AssistWidgetBuilder? responseLoadingBuilder, AssistPlaceholderBehavior placeholderBehavior = AssistPlaceholderBehavior.scrollWithMessage, AssistBubbleAlignment bubbleAlignment = AssistBubbleAlignment.auto, AssistSuggestionItemSelectedCallback? onSuggestionItemSelected, AssistBubbleToolbarItemSelectedCallback? onBubbleToolbarItemSelected, AssistBubbleSettings requestBubbleSettings = const AssistBubbleSettings(), AssistBubbleSettings responseBubbleSettings = const AssistBubbleSettings(), AssistMessageToolbarSettings responseToolbarSettings = const AssistMessageToolbarSettings()})
const

Properties

actionButton → AssistActionButton?
Represents a send button.
final
bubbleAlignment → AssistBubbleAlignment
Determines the alignment of the message bubbles.
final
bubbleAvatarBuilder → AssistWidgetBuilder?
A callback function creates a widget to display as an avatar within each message bubble.
final
bubbleContentBuilder → AssistWidgetBuilder?
A callback function creates a widget to display as the content of each message bubble.
final
bubbleFooterBuilder → AssistWidgetBuilder?
A callback function creates a widget to display as a footer within each message bubble.
final
bubbleHeaderBuilder → AssistWidgetBuilder?
A callback function creates a widget to serve as a header for each message bubble.
final
composer → AssistComposer?
A primary text editor for composing the request messages.
final
hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
messages → List<AssistMessage>
A list of AssistMessage objects that will be displayed in the chat interface.
final
onBubbleToolbarItemSelected → AssistBubbleToolbarItemSelectedCallback?
Called when the response bubble toolbar is selected.
final
onSuggestionItemSelected → AssistSuggestionItemSelectedCallback?
Called when the suggestion is selected.
final
placeholderBehavior → AssistPlaceholderBehavior
Manages the visibility of the placeholder widget.
final
placeholderBuilder → WidgetBuilder?
A callback function creates a widget to display initially or top of all messages.
final
requestBubbleSettings → AssistBubbleSettings
Options for changing the appearance and behavior of request message bubble.
final
responseBubbleSettings → AssistBubbleSettings
Options for changing the appearance and behavior of response message bubble.
final
responseLoadingBuilder → AssistWidgetBuilder?
A callback function creates a widget to display as a loading indicator while waiting for a response.
final
responseToolbarSettings → AssistMessageToolbarSettings
Options for changing the appearance of the response message toolbar.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<SfAIAssistView>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited