Flutter实时聊天功能插件firestore_chat的使用

开始使用

要开始使用Firebase，请参阅文档：https://firebase.flutter.dev/docs/overview

在项目中添加Firestore Chat插件，按照以下步骤操作：

import 'package:firestore_chat/firestore_chat.dart';

可以通过Material路由或直接推送聊天页面来打开聊天页面。

await openChatPage(BuildContext context, ChatEntity chatEntity);

或者

FirestoreChat().chatPageWidget(chatEntity)

示例

打开聊天

final chatEntity = ChatEntity(
    onMessageSent: (message, chatEntity){
    //
    },
    mainUser: mainUser,
    peers: peers,
    path: chatPath,
    title: "FIFA 2022 Games",
);

//方式一
Navigator.push(
    context,
    FirestoreChat().chatPageWidget(chatEntity),
);

//方式二
await openChatPage(context, chatEntity);
...

模型

Peer User

字段

• id - 用户ID
• image - 用户头像URL
• name - 用户显示名称

Chat Entity

字段

• mainUser - 登录用户
• peers - 用户映射表 <user ID, PeerUser>
• title - 聊天名称（可以为 nullable）
• path - 在Firestore中存储消息/聊天的位置
• onMessageSent - 当消息保存到Firestore时的回调

许可证

• MIT

问题与反馈

如果您有任何建议或发现任何问题，请随时在Github上提交问题进行讨论。

示例代码

// 忽略不必要的const

import 'package:firestore_chat/firestore_chat.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

import 'firebase_options.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const MyApp());
}

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

  // 这个小部件是你的应用的根。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
        DefaultCupertinoLocalizations.delegate,
      ],
      supportedLocales: const [
        Locale('en', ''), // 英语
        Locale('ar', ''), // 阿拉伯语
      ],
      locale: const Locale('ar'), // 设置初始语言为阿拉伯语
      title: 'Firestore Chat Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        // Center 是一个布局小部件。它只接受一个子元素并将其置于父元素的中心。
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            ElevatedButton(
              onPressed: () => openChatFirst(context),
              child: const Text("Open Chat"),
            ),
            const SizedBox(height: 50),
            ElevatedButton(
              onPressed: () => openChatSecond(context),
              child: const Text("Open Chat"),
            ),
          ],
        ),
      ),
      // 这个逗号使得自动格式化更美观。
    );
  }

  // 直接方法调用打开聊天
  openChatFirst(context) async {
    final mainUser = PeerUser(id: "1", name: "User 1");
    final peers = {
      "1": mainUser,
      "2": PeerUser(id: "2", name: "User 2"),
      "3": PeerUser(id: "3", name: "User 3"),
      "4": PeerUser(id: "4", name: "User 4"),
      "5": PeerUser(id: "5", name: "User 5"),
    };

    final chatEntity = ChatEntity(
      mainUser: mainUser,
      peers: peers,
      path: "sport/football/2022/worldcup-1",
      title: "FIFA 2022 Games - Photo Sharing - 1",
      supportMedia: true,
      onMessageSent: (String message, ChatEntity chatEntity) {
        // 处理当聊天已发送到Firestore时的情况
        // 您可以使用它来发送通知或显示一个Toast/SnackBar
      },
    );

    await FirestoreChat().openChatPage(context, chatEntity);
  }

  // 通过导航路由打开聊天
  openChatSecond(context) async {
    final mainUser = PeerUser(id: "1", name: "User 1");
    final peers = {
      "1": mainUser,
      "2": PeerUser(id: "2", name: "User 2"),
      "3": PeerUser(id: "3", name: "User 3"),
      "4": PeerUser(id: "4", name: "User 4"),
      "5": PeerUser(id: "5", name: "User 5"),
    };

    final chatEntity = ChatEntity(
      mainUser: mainUser,
      peers: peers,
      path: "sport/football/2022/worldcup",
      title: "FIFA 2022 Games",
      onMessageSent: (String message, ChatEntity chatEntity) {
        // 处理当聊天已发送到Firestore时的情况
        // 您可以使用它来发送通知或显示一个Toast/SnackBar
      },
    );
    Navigator.push(
      context,
      FirestoreChat().chatPageWidget(chatEntity),
    );
  }
}