You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Flutter语音转文本实现方案求助:语音转词数组并路由跳转

基于Dart/Flutter的语音转文本+路由跳转完整实现方案

我来给你梳理一套完整的实现方案,完美匹配你需要的语音转词数组、识别关键词并跳转对应页面的需求。

1. 添加依赖

首先在pubspec.yaml里引入常用的语音识别包speech_to_text,它能帮我们快速实现语音转文本功能:

dependencies:
  flutter:
    sdk: flutter
  speech_to_text: ^6.6.1 # 可替换为最新稳定版本

执行flutter pub get完成依赖安装。

2. 配置平台权限

Android

android/app/src/main/AndroidManifest.xml中添加录音与联网权限:

<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.INTERNET" /> <!-- 部分语音识别引擎需要联网支持 -->

iOS

ios/Runner/Info.plist中添加麦克风与语音识别权限说明:

<key>NSSpeechRecognitionUsageDescription</key>
<string>需要使用麦克风进行语音识别,以完成命令跳转</string>
<key>NSMicrophoneUsageDescription</key>
<string>需要访问麦克风来录制你的语音指令</string>

3. 核心功能实现

3.1 初始化语音识别模块

在页面的State类中定义必要变量并完成初始化:

import 'package:flutter/material.dart';
import 'package:speech_to_text/speech_to_text.dart' as stt;

class VoiceCommandPage extends StatefulWidget {
  const VoiceCommandPage({super.key});

  @override
  State<VoiceCommandPage> createState() => _VoiceCommandPageState();
}

class _VoiceCommandPageState extends State<VoiceCommandPage> {
  late stt.SpeechToText _speech;
  bool _isListening = false;
  String _recognizedText = '';

  @override
  void initState() {
    super.initState();
    _speech = stt.SpeechToText();
  }
}

3.2 实现语音录制与转文本逻辑

添加触发语音识别的方法,支持开始/停止监听:

void _startListening() async {
  bool available = await _speech.initialize(
    onStatus: (status) => print('识别状态更新:$status'),
    onError: (error) => print('识别出错:${error.errorMsg}'),
  );

  if (available) {
    setState(() => _isListening = true);
    _speech.listen(
      onResult: (result) {
        setState(() {
          _recognizedText = result.recognizedWords;
          // 识别完成后自动处理路由跳转
          if (result.finalResult) {
            _handleVoiceCommand(_recognizedText);
            setState(() => _isListening = false);
          }
        });
      },
    );
  }
}

void _stopListening() {
  setState(() => _isListening = false);
  _speech.stop();
}

3.3 处理词数组与路由跳转

实现你需要的文本转词数组、识别关键词并跳转的逻辑:

void _handleVoiceCommand(String text) {
  // 将识别文本按空格分割为词数组
  List<String> words = text.split(' ');
  
  // 遍历数组匹配关键词,执行对应路由跳转
  for (String word in words) {
    // 如需不区分大小写,可改为 word.toLowerCase() 并将case值改为小写
    switch (word) {
      case 'Account':
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => const AccountPage()),
        );
        break;
      case 'Balance':
        Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => const BalancePage()),
        );
        break;
      // 可扩展更多关键词匹配逻辑
    }
  }
}

4. 页面UI示例

添加触发按钮与识别结果展示:

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: const Text('语音命令跳转')),
    body: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text('当前识别结果:\n$_recognizedText', textAlign: TextAlign.center),
          const SizedBox(height: 30),
          ElevatedButton(
            onPressed: _isListening ? _stopListening : _startListening,
            style: ElevatedButton.styleFrom(
              padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 15),
            ),
            child: Icon(_isListening ? Icons.mic_off : Icons.mic, size: 30),
          ),
        ],
      ),
    ),
  );
}

5. 补充:创建目标页面

记得实现AccountPageBalancePage两个跳转目标页面,示例如下:

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('账户详情页')),
      body: const Center(child: Text('这里是账户信息内容')),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('余额查询页')),
      body: const Center(child: Text('当前账户余额:XXXX元')),
    );
  }
}

内容的提问来源于stack exchange,提问作者user9239214

火山引擎 最新活动