New Chat - CometChat Docs

AI Integration Quick Reference

Field	Value
Package	`cometchat_chat_uikit`
Import	`import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';`
Purpose	Create a CometChat Flutter UI Kit new chat screen for discovering users and groups and opening one-to-one or group conversations.
Key widgets	`CometChatGroups` · `CometChatMessageComposer` · `CometChatMessageHeader` · `CometChatMessageList` · `CometChatUsers`
Prerequisites	`CometChatUIKit` initialised and a user logged in.
Related	Users · Groups · Conversations

Offer a unified discovery screen for users and groups and launch new chats quickly using CometChat V6 UIKit.

Overview

The “New Chat” feature provides a screen where users can browse available users and groups to start a new conversation.

Integration

Create a New Chat Screen

Dart

import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';
import 'package:flutter/material.dart';

class NewChatScreen extends StatelessWidget {
  const NewChatScreen({super.key});

  void _openChat(BuildContext context, {User? user, Group? group}) {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (_) => Scaffold(
          appBar: CometChatMessageHeader(user: user, group: group),
          body: SafeArea(
            child: Column(
              children: [
                Expanded(child: CometChatMessageList(user: user, group: group)),
                CometChatMessageComposer(user: user, group: group),
              ],
            ),
          ),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Scaffold(
        appBar: AppBar(
          title: const Text('New Chat'),
          bottom: const TabBar(
            tabs: [
              Tab(text: 'Users'),
              Tab(text: 'Groups'),
            ],
          ),
        ),
        body: TabBarView(
          children: [
            CometChatUsers(
              hideAppbar: true,
              onItemTap: (context, user) => _openChat(context, user: user),
            ),
            CometChatGroups(
              hideAppbar: true,
              onItemTap: (context, group) => _openChat(context, group: group),
            ),
          ],
        ),
      ),
    );
  }
}

Launch from a FAB

Dart

FloatingActionButton(
  onPressed: () {
    Navigator.push(
      context,
      MaterialPageRoute(builder: (_) => const NewChatScreen()),
    );
  },
  child: const Icon(Icons.chat),
)