用Flutter实现小Q聊天机器人（五）

2024-02-22 19:38:42

在之前的文章里，我们一步步搭建了 Flutter 工程，接入了 AI 引擎，封装了 NLP 协议，实现了对消息的解析和回复功能。万事俱备，现在我们可以开始动手创建一个简单的聊天机器人了。

聊天机器人的核心功能在于：它能够处理用户输入的文本，并据此生成合适的回复。这个过程通常包含以下几个关键步骤：

自然语言理解 (NLU) ：这一步的目标是将用户输入的文本转换成结构化的数据，从中提取出用户的意图和相关的实体信息。
对话管理 ：在理解了用户的意图后，对话管理模块会根据当前的对话状态和用户的意图，决定下一步应该采取什么行动，例如：提供信息、询问更多细节、或者执行某个操作。
自然语言生成 (NLG) ：最后，自然语言生成模块会将对话管理模块决定的回复内容转换成自然流畅的文本，呈现给用户。

在 Flutter 中，我们可以借助一些现成的库来简化聊天机器人的开发过程。比如，我们可以使用 dialogflow_flutter 这个库来集成 Google Dialogflow。Dialogflow 是一个非常流行的 NLP 平台，它提供了预先训练好的模型和对话管理功能，可以帮助我们快速构建聊天机器人。

首先，我们需要在 Flutter 项目中添加 dialogflow_flutter 依赖。打开 pubspec.yaml 文件，在 dependencies 部分添加以下内容：

dependencies:
  dialogflow_flutter: ^3.0.1

然后，我们可以创建一个新的 Dart 文件来编写聊天机器人的逻辑代码。例如，我们可以创建一个名为 chatbot.dart 的文件，并在其中添加以下代码：

import 'package:dialogflow_flutter/dialogflow_flutter.dart';
import 'package:dialogflow_flutter/dialogflow_v2.dart';

class Chatbot {
  final Dialogflow dialogflow;

  Chatbot({required this.dialogflow});

  Future<DetectIntentResponse> detectIntent(String text) async {
    DetectIntentRequest request = DetectIntentRequest(
      queryInput: QueryInput(text: QueryTextInput(text: text)),
      queryParams: QueryParameters(
        timeZone: 'Asia/Shanghai', 
        contexts: [Context(name: 'projects/YOUR_PROJECT_ID/agent/sessions/YOUR_SESSION_ID/contexts/DEFAULT')], 
      ),
    );
    return dialogflow.detectIntent(request);
  }
}

在这段代码中，我们创建了一个 Dialogflow 对象，并定义了一个名为 detectIntent 的方法。这个方法接收用户输入的文本作为参数，并向 Dialogflow 发送一个检测意图的请求。

接下来，我们需要创建一个新的 StatefulWidget 来构建聊天机器人的界面。例如，我们可以创建一个名为 ChatbotScreen 的 StatefulWidget，并在其中添加以下代码：

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

class ChatbotScreen extends StatefulWidget {
  @override
  _ChatbotScreenState createState() => _ChatbotScreenState();
}

class _ChatbotScreenState extends State<ChatbotScreen> {
  final Chatbot chatbot = Chatbot(dialogflow: Dialogflow()); 

  final TextEditingController _textController = TextEditingController();

  List<Message> _messages = []; 

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('聊天机器人'),
      ),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              itemCount: _messages.length,
              itemBuilder: (context, index) {
                return MessageWidget(message: _messages[index]); 
              },
            ),
          ),
          Divider(),
          Container(
            padding: EdgeInsets.all(8.0),
            child: Row(
              children: [
                Expanded(
                  child: TextField(
                    controller: _textController,
                    decoration: InputDecoration(
                      hintText: '输入您的消息...',
                      border: OutlineInputBorder(),
                    ),
                  ),
                ),
                IconButton(
                  icon: Icon(Icons.send),
                  onPressed: () async {
                    String text = _textController.text;
                    if (text.isNotEmpty) {
                      _textController.clear();
                      Message message = Message(text: text, type: MessageType.user); 
                      _messages.add(message);
                      DetectIntentResponse response = await chatbot.detectIntent(text);
                      Message botMessage = Message(text: response.queryResult.fulfillmentText, type: MessageType.bot); 
                      _messages.add(botMessage);
                      setState(() {}); 
                    }
                  },
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

在这段代码中，我们创建了一个 Chatbot 对象，并定义了一个 build 方法来构建聊天机器人的界面。这个界面包含一个 ListView，用于显示聊天消息；一个文本输入框，用于用户输入消息；以及一个发送按钮。

当用户输入消息并点击发送按钮时，我们会调用 detectIntent 方法向 Dialogflow 发送检测意图的请求。如果 Dialogflow 检测到了用户的意图，我们会根据 Dialogflow 返回的结果创建一个 Message 对象，并将其添加到消息列表中。

最后，我们将整个聊天机器人界面包装在一个 MaterialApp 中，并将其作为应用程序的入口点：

import 'package:flutter/material.dart';
import 'package:chatbot/chatbot_screen.dart'; 

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter 聊天机器人',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ChatbotScreen(),
    );
  }
}