ChatBubbleSettings class

Customizes chat bubbles with these setttings for a better user experience.

The ChatBubbleSettings class provides options to customize the apearance and layout of chat bubbles, including styling, and padding, and display options for elements such as the username, timestamp, and avatar.

Example:


@override
Widget build(BuildContext context) {
  return SfChat(
    incomingBubbleSettings: ChatBubbleSettings(
      showUserName: true,
      showTimestamp: true,
      showUserAvatar: true,
      widthFactor: 0.8,
      avatarSize: const Size.square(32.0),
      padding: const EdgeInsets.all(2.0),
      contentPadding:
          const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
      headerPadding:
          const EdgeInsetsDirectional.only(top: 14.0, bottom: 4.0),
      footerPadding: const EdgeInsetsDirectional.only(top: 4.0),
    ),
    outgoingBubbleSettings: ChatBubbleSettings(
      showUserName: true,
      showTimestamp: true,
      showUserAvatar: true,
      widthFactor: 0.8,
      avatarSize: const Size.square(32.0),
      padding: const EdgeInsets.all(2.0),
      contentPadding:
          const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
      headerPadding:
          const EdgeInsetsDirectional.only(top: 14.0, bottom: 4.0),
      footerPadding: const EdgeInsetsDirectional.only(top: 4.0),
    ),
  );
}

Constructors

ChatBubbleSettings({bool showUserName = true, bool showTimestamp = true, bool showUserAvatar = true, DateFormat? timestampFormat, TextStyle? textStyle, TextStyle? headerTextStyle, Color? contentBackgroundColor, ShapeBorder? contentShape, double widthFactor = 0.8, Size avatarSize = const Size.square(32.0), EdgeInsetsGeometry padding = const EdgeInsets.all(2.0), EdgeInsetsGeometry contentPadding = const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0), EdgeInsetsGeometry? avatarPadding, EdgeInsetsGeometry headerPadding = const EdgeInsetsDirectional.only(top: 14.0, bottom: 4.0), EdgeInsetsGeometry footerPadding = const EdgeInsetsDirectional.only(top: 4.0)})
Creates a ChatBubbleSettings with the given customization options.
const

Properties

avatarPadding → EdgeInsetsGeometry?
Customizes the padding around the avatar within the bubble.
final
avatarSize → Size
Customizes the avatar's size within the chat bubble.
final
contentBackgroundColor → Color?
Background color of the message content.
final
contentPadding → EdgeInsetsGeometry
Customizes the padding around the bubble's content.
final
contentShape → ShapeBorder?
Shape of the message content, including border radius.
final
footerPadding → EdgeInsetsGeometry
Customizes the padding around the footer section of the bubble (if applicable).
final
hashCode → int
The hash code for this object.
no setterinherited
headerPadding → EdgeInsetsGeometry
Customizes padding to the header section of the bubble (if applicable).
final
headerTextStyle → TextStyle?
Style for the header text in the chat bubble.
final
padding → EdgeInsetsGeometry
Customizes the padding around the entire bubble.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
showTimestamp → bool
Customizes whether to display the timestamp within the chat bubble.
final
showUserAvatar → bool
Customizes whether to display the sender's avatar within the chat bubble.
final
showUserName → bool
Customizes whether to display the sender's username within the chat bubble.
final
textStyle → TextStyle?
Style for the chat bubble's text.
final
timestampFormat → DateFormat?
Customizes the format for displaying the timestamp of the message.
final
widthFactor → double
Customizes the chat bubble's width as a fraction of the screen width.
final

Methods

copyWith({bool? showUserName, bool? showTimestamp, bool? showUserAvatar, DateFormat? timestampFormat, TextStyle? textStyle, TextStyle? headerTextStyle, Color? contentBackgroundColor, ShapeBorder? contentShape, double? widthFactor, Size? avatarSize, EdgeInsetsGeometry? padding, EdgeInsetsGeometry? contentPadding, EdgeInsetsGeometry? avatarPadding, EdgeInsetsGeometry? headerPadding, EdgeInsetsGeometry? footerPadding}) → ChatBubbleSettings
merge(ChatBubbleSettings? other) → ChatBubbleSettings
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toString() → String
A string representation of this object.
inherited

Operators

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