Диалоговый поток во флаттере
Оригинальная (и устаревшая) инструкция для этого приложения. Моя реализация в этой статье.
Шаг №1: Создайте агент Dialogflow ES
- Убедитесь, что он использует автоматическую адаптацию речи при создании агента.
- Включите Dialogflow API в консоли GCP. Создайте учетную запись службы под учетными данными и предоставьте роль администратора Dialogflow API.
- Добавьте новый ключ JSON в только что созданную учетную запись службы и сохраните его локально на своем компьютере.
Шаг № 2: Создайте аудио приложение
- Установите Flutter и Android Studio. Запустите «flutter create voicebot».
- Установите версии SDK для пакета sound_stream в android/app/build.gradle: минимум 21 и цель 30.
- Дайте разрешение на интернет и микрофон в app/src/main/AndroidManifest.xml.
- Установить sound_stream, rxdart, dialogflow_grpc
- Переместите новый ключевой файл JSON из последнего шага в папку ресурсов. Будьте осторожны с ключом.
- Подключите свой физический телефон с помощью scrcpy и запустите приложение
Шаг № 3: Создайте пользовательский интерфейс чата с поддержкой STT
На высоком уровне дерево виджетов выглядит так: MyHomePage => чат (с сохранением состояния) => сообщение (без сохранения состояния). STT — это преобразование речи в текст.
Виджет чата
Он отображает пользовательский интерфейс чата и обрабатывает Dialogflow. Пользовательский интерфейс имеет
- ListView для отображения всех всплывающих сообщений.
- TextField для набора текста.
- IconButton для отправки сообщения. Когда она нажата, нам нужно отправить текст.
- IconButton для использования микрофона. Когда она нажата, нам нужно остановить или обработать аудиопоток.
Нам нужно несколько состояний:
final List<ChatMessage> _messages = <ChatMessage>[]; final TextEditingController _textController = TextEditingController(); late DialogflowGrpcV2Beta1 dialogflow; bool _isRecording = false; // if mic is recording RecorderStream _recorder = RecorderStream(); StreamSubscription? _recorderStatus; StreamSubscription<List<int>>? _audioStreamSubscription; BehaviorSubject<List<int>>? _audioStream;
- получить клиент Dialogflow через учетную запись службы в initState(). Это делается с использованием учетных данных json, которые мы скачали Dialogflow API.
- Чтобы остановить Stream, мы останавливаем RecorderStream, отменяем StreamSubscription и закрываем _audioStream(BehaviorSubject)
- Для обработкипотока вы можете указать диалоговые фразы (зависящие от приложения), аудиоконфигурацию (сэмпл герц, кодирование), а затем получить намерение, прослушивая dialogflow.streamingDetectIntent() с учетом аудиопотока.
- Для submitText вы получаете ответ от dialogflow.detectIntent() с текстом и обновляете всплывающий список сообщений в пользовательском интерфейсе.
Виджет сообщений
Каждое сообщение состоит из двух горизонтальных частей: CircleAvatar и текста сообщения. При желании текст сообщения может быть столбцом для размещения инициалов отправителя поверх текста. Единственная разница между сообщением бота и вашим сообщением заключается в том, что у бота есть CrossAxisAlignment.start для выравнивания по левому краю, а у вашего — CrossAxisAlignment.end для выравнивания по правому краю.
Шаг № 4: Создайте намерения
Добавьте намерения и ответы. Вы также можете использовать Коннектор знаний.
Если вам нравится этот урок, вы также можете найти полезным 3 уровня тестов флаттера. Они являются частью моей серии Стань флаттер-комфортным за 23 дня.
Ссылка
- Диалоговый поток продукт
- Диалоговый поток Намерение
- Диалоговый поток Коннекторы знаний