flutter_chatflow 2.0.0 copy "flutter_chatflow: ^2.0.0" to clipboard
flutter_chatflow: ^2.0.0 copied to clipboard

A versatile chat solution for Flutter apps, offering fast messaging, customizable UI, user management, media sharing, and group chats. Ideal for building robust communication apps


ChatFlow Logo

Fast and flexibile chat package with full features for easy app development. Actively maintained, community-driven chat UI implementation

Chat Image

A powerful and flexible chat solution for Flutter apps. Features include real-time messaging, private chats, group chats, customizable UI, user management, media sharing, rich text support, typing user(s), etc.

Current Status #

pub package pub points popularity likes

Features #

  1. Fast Messaging: The UI updates instantly as soon as it receives a new data. The developing sees to how the application stores the messages and it passes the same messages to the ChatFlow component for either private chats or group chats.
  2. Customizable UI: Easily customizable chat themes, use builders to create more customized UI and layouts to match your app’s design.
  3. User Management: Support for user authentication and profile management.
  4. Media Sharing: Send and receive images, videos, and other media files.
  5. Group Chats: Create and manage group conversations effortlessly.
  6. Generic Media Type: Aside from the default message types which include Text, Image, Info, Audio, Video, PDF, Doc and File, there's a Custom type for you to extend and do more just in case the already available types aren't enough which we believe should be enough for most use cases.
  7. Typing User: Listen to user typing events and do what you want such as notifying other users in the chat about that event.
  8. Media Preview: By default, chatflow automatically shows images preview when a user taps on an image message. [See image above]
  9. Select Message: A user can select message(s) in the chat. You get the list of selected message(s) and do what you want by providing a callback. [See API in Documentation]
  10. Message Reply: Messages can be replied to easily. This makes your app more intuitive, modern and engaging.

Etc.

Getting started #

To get started with flutter_chatflow, check out the documentation for installation instructions, usage guides, and examples.

Installation #

Easiest way is to run the flutter pub add flutter_chatflow

Usage #

Here is a basic example to get you started:

import 'dart:io';
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter_chatflow/chatflow.dart';
import 'package:flutter_chatflow/models.dart';
import 'package:flutter_chatflow/notifier.dart';
import 'package:flutter_chatflow/utils/types.dart';
import 'package:flutter_chatflow/widgets/image/image_upload_preview_with_text_input.dart';
import 'package:flutter_chatflow/widgets/media_selection_with_text.dart';



void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ChatScreen(),
    );
  }
}

class ChatScreen extends StatelessWidget {

  List<Message> _messages = [];
  ChatUser author = ChatUser({
    /// It should be unique and persistent for each user
    userID: 'randomID'
  })

  void _addMessage(Message message) {
    /// Handle sending message to server

    ///Sending to local collection below [OPTIONAL if sent to server and listened correctly]
    setState((){
      _messages.insert(0, message);
    });
  }

  void _handleSendPressed(String message, {Message? repliedTo}) {
    int createdAt = DateTime.now().millisecondsSinceEpoch;
    
    final textMessage = TextMessage(
      author: author,
      createdAt: createdAt,
      text: message,
      status: DeliveryStatus.sending
    );

    _addMessage(textMessage);
  }

  void _handleOnAttachmentPressed({Message? repliedTo}) async {
    /// logic for adding image to chat.
    /// You could use a dialog to choose between different media types
    /// And rename the function accordingly
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Chat')),
      body: ChatFlow(
        messages: _messages,
        chatUser: author,
        onSendPressed: _handleSendPressed,
        onAttachmentPressed: _handleOnAttachmentPressed
      ),
    );
  }
}

Sponsors #

A huge thank you to our amazing sponsors! Your support is essential in maintaining and improving this project.

OUR GOLD SPONSORS

Chat Image

Become Our Sponsor #

If you or your organization would like to support this project and be featured here, please consider becoming a sponsor. Your contributions help us to keep the project alive and growing.

Thank you for your generosity!

Reach Out #

For support kindly send a mail to Engr. Isaiah Pius

Contributing #

We welcome contributions! Please see our contributing guidelines for more information.

License #

flutter_chatflow is released under the BSD license.

13
likes
160
pub points
44%
popularity

Publisher

unverified uploader

A versatile chat solution for Flutter apps, offering fast messaging, customizable UI, user management, media sharing, and group chats. Ideal for building robust communication apps

Repository (GitHub)
View/report issues

Topics

#chat #message #whatsapp #chat-ui #telegram

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter, link_utils

More

Packages that depend on flutter_chatflow