Flutter语音识别插件speech_to_text_btn的使用

Flutter语音识别插件speech_to_text_btn的使用

speechToTextBtn 是一个为 Flutter 提供语音转文字功能的插件,支持英语和阿拉伯语。它通过集成 Vosk 支持没有 Google Play Services 的设备,并在可用时使用 Google Speech APIs。

功能

  • 支持英语和阿拉伯语的语音识别。
  • 兼容没有 Google Play Services 的设备(使用 Vosk)。
  • 简单易用的 UI,可自定义开始和停止录音的控件。
  • 通过回调输出识别的文本。

开始使用

添加依赖

pubspec.yaml 文件中添加 speechToTextBtn

dependencies:
  speechToTextBtn: ^0.0.1

然后运行以下命令以获取依赖项:

flutter pub get

使用示例

以下是如何在 Flutter 应用程序中使用 speechToTextBtn 的示例代码:

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

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

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

class SpeechToTextExample extends StatefulWidget {
  @override
  _SpeechToTextExampleState createState() => _SpeechToTextExampleState();
}

class _SpeechToTextExampleState extends State<SpeechToTextExample> {
  String recognizedText = ''; // 存储识别的文本

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('语音转文字按钮演示'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          // 显示识别的文本
          Center(
            child: Text(
              '识别的文本:',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Text(
              recognizedText,
              textAlign: TextAlign.center,
              style: TextStyle(fontSize: 18),
            ),
          ),
          SizedBox(height: 20),
          // 语音识别按钮
          Center(
            child: speechToTextBtn(
              isEnglish: true, // 设置语言为英语
              startedRecordChild: Icon(Icons.mic, color: Colors.red, size: 50), // 开始录音时显示的图标
              stopedRecordChild: Icon(Icons.mic_none, color: Colors.green, size: 50), // 停止录音时显示的图标
              theText: (text) {
                setState(() {
                  recognizedText = text; // 更新识别的文本
                });
              },
            ),
          ),
        ],
      ),
    );
  }
}

参数说明

以下是 speechToTextBtn 的主要参数:

参数名称 描述
isEnglish 是否启用英语模式(true 为英语,false 为阿拉伯语)。
startedRecordChild 开始录音时显示的控件(如麦克风图标)。
stopedRecordChild 停止录音时显示的控件。
theText 用于接收识别到的文本的回调函数。

方法

speechToTextBtn 提供了一个方法来控制语音识别过程:

方法名称 描述
startStopdRecord() 切换语音识别的开启或关闭状态。

权限配置

iOS 和 macOS

Info.plist 文件中添加以下键值对:

<key>NSSpeechRecognitionUsageDescription</key>
<string>应用需要访问您的语音以进行识别。</string>

<key>NSMicrophoneUsageDescription</key>
<string>应用需要访问您的麦克风以进行语音输入。</string>

注意:如果在 macOS 上通过 VSCode 运行应用,可能会因权限请求失败而崩溃。建议直接从 Xcode 运行应用。

如果升级现有的 macOS 应用,请确保更新依赖并安装 Pod:

flutter clean
flutter pub get
cd macos
pod install

Android

AndroidManifest.xml 中添加以下权限:

<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.BLUETOOTH"/>
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT"/>

针对 Android SDK 30 或更高版本

<queries> 部分添加以下内容以允许查询语音识别服务:

<queries>
    <intent>
        <action android:name="android.speech.RecognitionService" />
    </intent>
</queries>

iOS 可选配置

如果需要在 iOS 上播放声音提示,可以将以下文件添加到项目中,并在 pubspec.yaml 中引用它们:

assets:
  - assets/sounds/speech_to_text_listening.m4r
  - assets/sounds/speech_to_text_cancel.m4r
  - assets/sounds/speech_to_text_stop.m4r

更多关于Flutter语音识别插件speech_to_text_btn的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter语音识别插件speech_to_text_btn的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


speech_to_text_btn 是一个用于在 Flutter 应用中实现语音识别的插件。它提供了一个简单的按钮,用户可以通过点击按钮并说话来将语音转换为文本。以下是使用 speech_to_text_btn 插件的基本步骤:

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 speech_to_text_btn 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  speech_to_text_btn: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 speech_to_text_btn 包:

import 'package:speech_to_text_btn/speech_to_text_btn.dart';

3. 使用 SpeechToTextBtn 组件

你可以在你的 UI 中使用 SpeechToTextBtn 组件。以下是一个简单的示例:

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

class SpeechToTextPage extends StatefulWidget {
  @override
  _SpeechToTextPageState createState() => _SpeechToTextPageState();
}

class _SpeechToTextPageState extends State<SpeechToTextPage> {
  String _recognizedText = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Speech to Text Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            SpeechToTextBtn(
              onResult: (String result) {
                setState(() {
                  _recognizedText = result;
                });
              },
              btnText: 'Tap to Speak',
              btnColor: Colors.blue,
              txtColor: Colors.white,
            ),
            SizedBox(height: 20),
            Text(
              'Recognized Text:',
              style: TextStyle(fontSize: 18),
            ),
            Text(
              _recognizedText,
              style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold),
            ),
          ],
        ),
      ),
    );
  }
}

4. 解释代码

  • SpeechToTextBtn 是一个按钮组件,用户点击它后可以开始语音识别。
  • onResult 是一个回调函数,当语音识别完成后,识别到的文本会通过这个回调返回。
  • btnText 是按钮上显示的文本。
  • btnColortxtColor 分别用于设置按钮的背景颜色和文本颜色。

5. 运行应用

运行你的 Flutter 应用,你应该会看到一个按钮,点击按钮并说话,识别到的文本将会显示在屏幕上。

6. 处理权限

语音识别通常需要麦克风权限。确保你在 AndroidManifest.xmlInfo.plist 文件中添加了相应的权限声明。

Android:

AndroidManifest.xml 中添加以下权限:

<uses-permission android:name="android.permission.RECORD_AUDIO" />

iOS:

Info.plist 中添加以下键值对:

<key>NSMicrophoneUsageDescription</key>
<string>We need access to your microphone for speech recognition.</string>
回到顶部