Flutter即时通讯聊天插件nim_chatkit的使用

Flutter即时通讯聊天插件nim_chatkit的使用

kit.nim_chatkit

nim_chatkit 提供聊天消息业务层实现。

声明依赖

如果要添加 ChatKit 的依赖项，您必须将 pub 库添加到项目中。

在应用或模块的 pubspec.yaml 文件中添加所需的依赖项：

dependencies:
  nim_chatkit: ^1.0.0

接下来，我们将通过一个完整的示例来展示如何使用 nim_chatkit 插件进行即时通讯聊天。

完整示例Demo

首先，确保在项目的 pubspec.yaml 文件中已经添加了 nim_chatkit 依赖：

dependencies:
  flutter:
    sdk: flutter
  nim_chatkit: ^1.0.0

然后，运行 flutter pub get 来获取依赖项。

接下来，我们创建一个简单的聊天界面。首先，在 main.dart 中初始化并配置 nim_chatkit。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ChatScreen(),
    );
  }
}

接着，定义 ChatScreen 类来展示聊天界面：

class ChatScreen extends StatefulWidget {
  [@override](/user/override)
  _ChatScreenState createState() => _ChatScreenState();
}

class _ChatScreenState extends State<ChatScreen> {
  final _chatController = ChatController();

  [@override](/user/override)
  void initState() {
    super.initState();
    // 初始化聊天控制器
    _chatController.init();
  }

  [@override](/user/override)
  void dispose() {
    // 清理资源
    _chatController.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('即时通讯聊天'),
      ),
      body: Column(
        children: [
          Expanded(
            child: ChatView(
              controller: _chatController,
              onMessageSent: (message) {
                // 消息发送成功回调
                print('消息发送成功: $message');
              },
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Row(
              children: [
                Expanded(
                  child: TextField(
                    decoration: InputDecoration(hintText: '输入消息...'),
                    onSubmitted: (text) {
                      // 发送消息
                      _chatController.sendMessage(text);
                    },
                  ),
                ),
                IconButton(
                  icon: Icon(Icons.send),
                  onPressed: () {
                    // 发送消息
                    _chatController.sendMessage(_chatController.text);
                  },
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}