π’ WhatsAppTextField
A fully customizable WhatsApp-style chat input field for Flutter with emoji picker, dynamic resizing, attachment options, and sleek modern UX.
π 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.