Form Bubble

Form Bubble — CometChat documentation.

The CometChatFormBubble component is used to render a form within a chat bubble. The form fields are dynamically built based on the data passed in the message prop. The form fields can include TextInput Element, Label Element, Checkbox Element, Radio Button Element, Dropdown, Single Select Element, Button Element. Once the form is filled out and submitted, the data will be sent to the provided URL or handled by a custom function.

Properties

Properties	Type	Description
title	String
formMessage	FormMessage	An instance of the FormMessage class which holds information about the form fields. The form inputs are dynamically built based on the form fields’ information in the message.
formBubbleStyle	FormBubbleStyle	An object of styles for customizing the UI of the form bubble. You can override styles for the wrapper, title, goal completion text, and form inputs, etc. If a style is not provided, the default style will be used.
onSubmitTap	Function(Map<String, dynamic>)	A parameter that defines if a custom callback is available or not.
theme	CometChatTheme	Passes theme to the form bubble.
loggedInUser	User	An instance of the logged-in user object.
QuickViewStyle	QuickViewStyle	An instance for setting goal completion styling properties.

FormBubbleStyle

FormBubbleStyle is a class extending BaseStyle containing attributes to customize the appearance of the CometChatFormBubble component.

Properties	Type	Description
dropDownElementStyle	DropDownElementStyle	Used to set the font style of the title. The object should include fontFamily, fontSize, and fontWeight.
submitButtonStyle	ButtonStyle	Used to set the color of the title.
buttonElementStyle	ButtonStyle	Used to set the background color of the message bubble.
labelStyle	TextStyle	Used to set the border radius of the message bubble.
textInputStyle	TextInputElementStyle	Used to set the padding of the message bubble.
checkBoxStyle	CheckBoxElementStyle	Used to set the font style of the goal completion text. The object should include fontFamily, fontSize, and fontWeight.
quickViewStyle	QuickViewStyle	Used to set the color of the goal completion text.

Usage

Dart

CometChatFormBubble(
  formMessage: formMessage,
  loggedInUser: loggedInUser, // replace this with the logged-in user
)