Flutter聊天机器人插件ikchatbot的使用

发布于 1周前 作者 itying888 来自 Flutter

Flutter 聊天机器人插件 ikchatbot 的使用

简介

ikChatBot 是一个 Flutter 插件，用于在 Flutter 应用程序中快速集成可定制的聊天机器人。该插件提供了丰富的配置选项，使你能够轻松地创建一个用户友好的聊天界面。

特性

  • 可定制的聊天机器人外观
  • 用户和机器人的图标
  • 可定制的聊天气泡颜色
  • 控制不活跃和关闭行为
  • 背景图片支持
  • 初始问候和默认响应
  • 用户输入占位符
  • 轻松集成到 Flutter 应用程序
  • 添加评分功能
  • 将评分反馈发送到你的邮箱
  • 使用 SMTP 进行安全邮件发送
  • 显示机器人正在输入的效果
  • 显示评分功能
  • 使用资产或互联网图片作为背景

快速开始

安装

在你的 pubspec.yaml 文件中添加 ikchatbot 依赖：

dependencies:
  ikchatbot: ^1.0.5

导入包

在你的 Dart 文件中导入 ikchatbot 包：

import 'package:ikchatbot/ikchatbot.dart';

配置聊天机器人

创建一个 IkChatBotConfig 对象来配置你的聊天机器人：

final chatBotConfig = IkChatBotConfig(
  // SMTP 评分到你的邮箱设置
  ratingIconYes: const Icon(Icons.star),
  ratingIconNo: const Icon(Icons.star_border),
  ratingIconColor: Colors.black,
  ratingBackgroundColor: Colors.white,
  ratingButtonText: '提交评分',
  thankyouText: '感谢您的评分！',
  ratingText: '评价您的体验：',
  ratingTitle: '感谢您使用聊天机器人！',
  body: '这是一封来自 Flutter 和 Dart 的测试邮件。',
  subject: '测试评分',
  recipient: 'recipient@example.com',
  isSecure: false,
  senderName: '您的名字',
  smtpUsername: '您的邮箱',
  smtpPassword: '您的密码',
  smtpServer: 'smtp.gmail.com',
  smtpPort: 587,

  // 系统配置设置
  sendIcon: const Icon(Icons.send, color: Colors.black),
  userIcon: const Icon(Icons.person, color: Colors.white),
  botIcon: const Icon(Icons.android, color: Colors.white),
  botChatColor: const Color.fromARGB(255, 81, 80, 80),
  delayBot: 100,
  closingTime: 1,
  delayResponse: 1,
  userChatColor: Colors.blue,
  waitingTime: 1,
  keywords: keywords,
  responses: responses,
  backgroundColor: Colors.white,
  backgroundImageUrl: 'https://cdn.wallpapersafari.com/54/0/HluF7g.jpg',
  initialGreeting: "👋 您好！\n欢迎来到 IkBot\n有什么我可以帮助您的吗？",
  defaultResponse: "对不起，我不理解您的回复。",
  inactivityMessage: "还有其他需要帮助的吗？",
  closingMessage: "本次对话即将结束。",
  inputHint: '发送消息',
  waitingText: '请稍等...',
);

创建关键词和响应列表

创建一个包含关键词和响应的列表：

final List<String> keywords = [
  '你是谁',
  '什么是 Flutter',
  'fuck',
  '对不起'
];

final List<String> responses = [
  '我是由 Iksoft Original 创建的机器人，一位自豪的加纳人',
  'Flutter 改变了应用开发过程。从单个代码库构建、测试和部署美丽的移动、Web、桌面和嵌入式应用。',
  '你真是太愚蠢了，竟然对我说这样的话。你没有未来。找 Iksoft Original 并寻求知识。这是他的电话号码 +233550138086。给他打电话吧，你这个懒惰的人',
  '好吧，我已经原谅你了。不要再这样做了！'
];

完整示例

以下是一个完整的示例，展示了如何在 Flutter 应用程序中使用 ikChatBot 插件：

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

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

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

  @override
  Widget build(BuildContext context) {
    final chatBotConfig = IkChatBotConfig(
      // SMTP 评分到你的邮箱设置
      ratingIconYes: const Icon(Icons.star),
      ratingIconNo: const Icon(Icons.star_border),
      ratingIconColor: Colors.black,
      ratingBackgroundColor: Colors.white,
      ratingButtonText: '提交评分',
      thankyouText: '感谢您的评分！',
      ratingText: '评价您的体验：',
      ratingTitle: '感谢您使用聊天机器人！',
      body: '这是一封来自 Flutter 和 Dart 的测试邮件。',
      subject: '测试评分',
      recipient: 'recipient@example.com',
      isSecure: false,
      senderName: '您的名字',
      smtpUsername: '您的邮箱',
      smtpPassword: '您的密码',
      smtpServer: 'smtp.gmail.com',
      smtpPort: 587,

      // 系统配置设置
      sendIcon: const Icon(Icons.send, color: Colors.black),
      userIcon: const Icon(Icons.person, color: Colors.white),
      botIcon: const Icon(Icons.android, color: Colors.white),
      botChatColor: const Color.fromARGB(255, 81, 80, 80),
      delayBot: 100,
      closingTime: 1,
      delayResponse: 1,
      userChatColor: Colors.blue,
      waitingTime: 1,
      keywords: keywords,
      responses: responses,
      backgroundColor: Colors.white,
      backgroundImageUrl: 'https://cdn.wallpapersafari.com/54/0/HluF7g.jpg',
      initialGreeting: "👋 您好！\n欢迎来到 IkBot\n有什么我可以帮助您的吗？",
      defaultResponse: "对不起，我不理解您的回复。",
      inactivityMessage: "还有其他需要帮助的吗？",
      closingMessage: "本次对话即将结束。",
      inputHint: '发送消息',
      waitingText: '请稍等...',
    );

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: MyHomePage(chatBotConfig: chatBotConfig),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final IkChatBotConfig chatBotConfig;

  const MyHomePage({Key? key, required this.chatBotConfig}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final bool _chatIsOpened = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: const Text('ikChatBot 示例'),
      ),
      body: IkChatBot(config: widget.chatBotConfig),
    );
  }
}

其他信息

  • 更多文档：查看包的文档以获取更多信息。
  • 贡献：欢迎贡献！如果你希望为这个包做出贡献，请在 GitHub 上提交问题或拉取请求。
  • 支持：如果遇到任何问题或需要支持，请在 GitHub 上提交问题或联系我们的邮箱：iksofttechnologiesgh@gmail.com。
  • 团队支持：我们的团队会尽力及时响应问题和询问。

希望这个指南能帮助你在 Flutter 应用程序中成功集成 ikChatBot 聊天机器人插件！


更多关于Flutter聊天机器人插件ikchatbot的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
1 回复

更多关于Flutter聊天机器人插件ikchatbot的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是一个关于如何在Flutter项目中使用ikchatbot插件的示例代码案例。请注意，这个插件可能是一个假设的或者特定于某个库的插件，因为实际中并没有一个广泛认可的名为ikchatbot的Flutter插件。不过，我会基于常见的Flutter插件使用模式给出一个示例。

1. 添加依赖

首先，你需要在pubspec.yaml文件中添加ikchatbot插件的依赖（假设这个插件存在）。

dependencies:
  flutter:
    sdk: flutter
  ikchatbot: ^1.0.0  # 假设的版本号

2. 导入插件

在你的Flutter项目中，你需要导入这个插件才能使用它。通常这会在你的Dart文件顶部完成。

import 'package:ikchatbot/ikchatbot.dart';

3. 初始化插件

在Flutter的生命周期中，你可能需要在某个地方初始化这个插件。这通常在State类的initState方法中进行，或者在一个全局的初始化函数中。

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

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

class ChatScreen extends StatefulWidget {
  @override
  _ChatScreenState createState() => _ChatScreenState();
}

class _ChatScreenState extends State<ChatScreen> {
  late IkChatBot chatBot;

  @override
  void initState() {
    super.initState();
    // 初始化插件
    chatBot = IkChatBot.init();
    // 你可以在这里添加任何需要的配置或者监听器
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Chat Bot'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          children: [
            // 聊天历史记录显示区域
            Expanded(
              child: ChatHistory(chatBot: chatBot),
            ),
            // 输入框和发送按钮
            ChatInput(onSubmit: (message) {
              chatBot.sendMessage(message);
            }),
          ],
        ),
      ),
    );
  }
}

4. 自定义小部件

你可能需要自定义一些小部件来显示聊天历史和输入消息。这里是一个简单的示例：

class ChatHistory extends StatelessWidget {
  final IkChatBot chatBot;

  ChatHistory({required this.chatBot});

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: chatBot.messages.length,
      itemBuilder: (context, index) {
        var message = chatBot.messages[index];
        return Padding(
          padding: const EdgeInsets.symmetric(vertical: 4.0),
          child: Text(message),
        );
      },
    );
  }
}

class ChatInput extends StatefulWidget {
  final ValueChanged<String> onSubmit;

  ChatInput({required this.onSubmit});

  @override
  _ChatInputState createState() => _ChatInputState();
}

class _ChatInputState extends State<ChatInput> {
  final TextEditingController _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Expanded(
          child: TextField(
            controller: _controller,
            decoration: InputDecoration(
              border: OutlineInputBorder(),
              hintText: 'Type a message...',
            ),
          ),
        ),
        Button(
          onPressed: () {
            widget.onSubmit(_controller.text);
            _controller.clear();
          },
          child: Text('Send'),
        ),
      ],
    );
  }
}

5. 插件方法调用

你可能需要调用插件提供的一些方法来与聊天机器人交互。这通常是通过插件实例的方法来实现的。

// 假设IkChatBot有一个sendMessage方法
chatBot.sendMessage("Hello, how are you?");

// 假设IkChatBot有一个监听器可以监听新消息
chatBot.onNewMessage.listen((message) {
  // 更新UI以显示新消息
  setState(() {
    // 假设有一个方法可以将新消息添加到chatBot.messages列表中
    chatBot.messages.add(message);
  });
});

请注意，以上代码是一个示例，实际的ikchatbot插件可能会有不同的API和初始化方法。你应该查阅该插件的官方文档来获取准确的用法和API信息。如果ikchatbot插件不存在，你可能需要寻找一个类似的Flutter聊天机器人插件或者自己实现一个。

回到顶部