Flutter如何通过语音指令打开指定页面

我在用Flutter开发一个语音控制的应用，想实现通过语音指令跳转到指定页面的功能。目前已经集成了语音识别，可以获取到语音转文字的结果，但不知道如何根据识别到的文字内容来触发页面跳转。比如用户说"打开设置页面"，应用就能自动跳转到设置页。请问该怎么实现这个功能？需要用到什么插件或技术方案？有没有具体的代码示例可以参考？

2 回复

Flutter可通过speech_to_text包识别语音，然后根据识别结果使用Navigator.pushNamed导航到指定页面。需在pubspec.yaml添加依赖，并配置路由表。

更多关于Flutter如何通过语音指令打开指定页面的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中实现语音指令打开指定页面，可以通过以下步骤实现：

1. 添加依赖

在 pubspec.yaml 中添加语音识别和权限处理依赖：

dependencies:
  speech_to_text: ^6.6.0
  permission_handler: ^11.0.0

2. 配置权限

Android (android/app/src/main/AndroidManifest.xml)：

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

iOS (ios/Runner/Info.plist)：

<key>NSMicrophoneUsageDescription</key>
<string>需要麦克风权限进行语音识别</string>
<key>NSSpeechRecognitionUsageDescription</key>
<string>需要语音识别权限处理语音指令</string>

3. 核心实现代码

import 'package:flutter/material.dart';
import 'package:speech_to_text/speech_to_text.dart';
import 'package:permission_handler/permission_handler.dart';

class VoiceNavigationPage extends StatefulWidget {
  @override
  _VoiceNavigationPageState createState() => _VoiceNavigationPageState();
}

class _VoiceNavigationPageState extends State<VoiceNavigationPage> {
  final SpeechToText _speech = SpeechToText();
  bool _isListening = false;

  @override
  void initState() {
    super.initState();
    _initSpeech();
  }

  void _initSpeech() async {
    await _speech.initialize();
    setState(() {});
  }

  void _startListening() async {
    if (await Permission.microphone.request().isGranted) {
      setState(() => _isListening = true);
      _speech.listen(
        onResult: (result) => _handleSpeechResult(result.recognizedWords),
        listenFor: Duration(seconds: 5),
      );
    }
  }

  void _handleSpeechResult(String words) {
    setState(() => _isListening = false);
    final command = words.toLowerCase().trim();
    
    // 语音指令映射
    final pageMap = {
      'home': '/home',
      'settings': '/settings',
      'profile': '/profile',
    };

    if (pageMap.containsKey(command)) {
      Navigator.pushNamed(context, pageMap[command]!);
    } else {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('未识别指令: $command')),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            IconButton(
              icon: Icon(_isListening ? Icons.mic : Icons.mic_none),
              onPressed: _startListening,
              iconSize: 48,
            ),
            Text(_isListening ? '正在聆听...' : '点击开始语音指令'),
          ],
        ),
      ),
    );
  }
}

4. 路由配置 (在MaterialApp中)

MaterialApp(
  routes: {
    '/home': (context) => HomePage(),
    '/settings': (context) => SettingsPage(),
    '/profile': (context) => ProfilePage(),
  },
  home: VoiceNavigationPage(),
)

关键点说明：

  • 使用 speech_to_text 插件实现语音识别
  • 通过 permission_handler 处理麦克风权限
  • 将识别结果与预定义指令匹配
  • 使用命名路由进行页面跳转
  • 建议添加语音反馈（如TTS）提升用户体验

此方案可扩展支持更多语音指令，只需在 pageMap 中添加对应映射即可。

回到顶部