🟒 WhatsAppTextField

A fully customizable WhatsApp-style chat input field for Flutter with emoji picker, dynamic resizing, attachment options, and sleek modern UX.


pub version license


πŸš€ Features

🌟 Feature πŸ’¬ Description
πŸ’¬ WhatsApp-style UI A clean, responsive, chat input field inspired by WhatsApp
πŸ˜€ Emoji Picker Built-in emoji picker toggle or plug in your own
πŸ“Ž Attachment Sheet Camera, gallery, audio, documents, contacts β€” fully customizable
🎯 Custom Send Button Icon, radius, and color can be tailored to your app's branding
βš™οΈ Configurable Input Autofocus, keyboard type, max lines, suggestions, capitalization, etc.
πŸ“± Responsive Layout Adapts seamlessly with keyboard and overlays
πŸ”Œ Callback Support onSendTap, onChanged, emoji tap, and attachment hooks

πŸ“¦ Installation

Add the package to your pubspec.yaml:

dependencies:
  whatsapp_field: ^1.0.7

Then run:

flutter pub get

πŸ”§ Parameters

Parameter Type Default Description
hintText String "Type a message" Placeholder text
onSendTap Function(String) required Callback when the send button is tapped
showEmojiPicker bool true Toggle to display emoji picker
backgroundColor Color Colors.white Background color of the input field
sendButtonColor Color Colors.green Color of the send button
sendButtonIcon IconData Icons.send Icon used for the send button
maxLines int 5 Maximum number of lines allowed
attachmentIcons List<Widget> [] Custom attachment icons to show in sheet
onAttachmentTap Function(List<File>)? null Callback for selected attachments
controller TextEditingController? null Optional controller for the field
focusNode FocusNode? null Custom focus node for managing focus

πŸ§ͺ Example

WhatsAppTextField(
  hintText: "Send a message...",
  onSendTap: (text) {
    print("Message sent: $text");
  },
  onAttachmentTap: (files) {
    print("Files selected: $files");
  },
)

πŸ“Έ Screenshots

Already provided above for visual preview.


πŸ‘¨β€πŸ’» Contributing

Feel free to fork the repo and submit PRs! For major changes, please open an issue first.


πŸ“„ License

MIT License