[Flutter] flutter_tts voice playback text Text-to-Speech

I. Introduction

In mobile application development, the function of Text-to-Speech (TTS for short) is more and more common. It can help us realize functions such as voice broadcast and voice prompt, which greatly enriches the interaction mode of the application.

This article will introduce how to implement the TTS function in Flutter, we will use a plugin called flutter_tts to complete this task.

Highlights of this article include:

  • A basic introduction to the flutter_tts plugin
  • How to install and configure the flutter_tts plugin in a Flutter project
  • How to use the flutter_tts plugin to implement basic TTS functionality
  • A complete code example that works

Are you eager to become a Flutter expert with more tips and best practices? We have great news for you! Flutter from zero to one basic entry to the application line of the whole strategy is waiting for you to join! This column contains all the resources you need to learn Flutter, including code samples and in-depth analysis. The content of the column will continue to be updated, and the price will increase accordingly. Join now and enjoy the best price! In addition, we also have a dedicated discussion group, you can click here to join our discussion group to communicate and learn with other Flutter learners. Let's start our Flutter learning journey today!

2. Introduction to the flutter_tts plugin

flutter_tts is a Flutter plugin for TTS functionality. The plug-in supports iOS, Android, Web, macOS and other platforms, with rich functions and easy to use.

The main functions of the flutter_tts plugin include:

  • Voice broadcast (speak)
  • stop broadcasting (stop)
  • Get a list of supported languages ​​(get languages)
  • Set language (set language)
  • Set speech rate (set speech rate)
  • Set speech volume (set speech volume)
  • Set speech pitch (set speech pitch)
  • Determine whether a language is available (is language available)
  • Get voice list (get voices)
  • Set voice (set voice)
  • Pause and continue broadcasting (pause/continue)
  • Synthesize speech to file (synthesize to file)

The version of Flutter used in this article is 3.10.0, the version of the Dart SDK is 3.0.0, and the version of the flutter_tts plugin is 3.7.0.

This is the blog published by Xiaoyu Youth on CSDN in 2023. Due to the rampant copyright infringement of the collection station, if you do not see this article on CSDN, please contact me through CSDN, thank you for your support~

3. Installation and configuration of the flutter_tts plugin

To use the flutter_tts plugin in a Flutter project, you first need to pubspec.yamladd the flutter_tts dependency to the project's file. Open pubspec.yamlthe file and add the following code dependenciesunder :

dependencies:
  flutter:
    sdk: flutter
  flutter_tts: ^3.7.0

Then run the command in the terminal flutter packages get, and Flutter will automatically download and install the flutter_tts plugin.

For different platforms, the flutter_tts plugin is configured differently. For example, if your application needs to support the Android platform, you need to set android/app/build.gradlein the file minSdkVersionto 21 or higher. In addition, if your application needs to use the TTS function on Android 11, you also need to declare it in the application's manifest file TextToSpeech.Engine.INTENT_ACTION_TTS_SERVICE.

Fourth, the basic use of the flutter_tts plugin

After installing and configuring the flutter_tts plugin, we can start using it to implement the TTS function.

First, we need to create an instance of FlutterTts:

FlutterTts flutterTts = FlutterTts();

Then, we can setLanguageset the language of the speech by calling the method, and set the rate, volume and pitch of the speech by calling the setSpeechRate, setVolumeand methods:setPitch

await flutterTts.setLanguage("en-US");
await flutterTts.setSpeechRate(1.0);
await flutterTts.setVolume(1.0);
await flutterTts.setPitch(1.0);

Finally, we can speakimplement text-to-speech conversion by calling the method:

var result = await flutterTts.speak("Hello World");
if (result == 1) {
    
    
  // TTS is playing
}

5. Complete code example of flutter_tts plugin

The following is a complete code example of using the flutter_tts plugin to implement the TTS function. In this example, we create a simple interface where the user can enter text in a text box and click a button to play the text spoken.

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

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

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

class MyHomePage extends StatefulWidget {
    
    
  
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
    
    
  FlutterTts flutterTts = FlutterTts();
  TextEditingController textEditingController = TextEditingController();

  
  void initState() {
    
    
    super.initState();
    flutterTts.setLanguage("en-US");
    flutterTts.setSpeechRate(1.0);
    flutterTts.setVolume(1.0);
    flutterTts.setPitch(1.0);
  }

  
  Widget build(BuildContext context) {
    
    
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter TTS Demo'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          children: <Widget>[
            TextField(
              controller: textEditingController,
              decoration: InputDecoration(
                hintText: 'Enter a text',
              ),
            ),
            RaisedButton(
              onPressed: () {
    
    
                flutterTts.speak(textEditingController.text);
              },
              child: Text('Speak'),
            ),
          ],
        ),
      ),
    );
  }
}

6. Summary

Through this article, we learned how to use the flutter_tts plugin to implement the TTS function in Flutter. We first introduced the basic information and functional characteristics of the flutter_tts plugin, then introduced how to install and configure the flutter_tts plugin in the Flutter project, then introduced how to use the flutter_tts plugin to implement basic TTS functions, and finally we provided a complete code example.

The flutter_tts plug-in is powerful and easy to use, and it is a good helper to realize the TTS function in Flutter. Hope this article can help readers in need.

Are you curious about Flutter and want to learn more about it? Then, Flutter from zero to one basic introduction to application launch guide will be your best choice! Here, you can find comprehensive Flutter learning resources, including code samples and in-depth analysis. Are you wondering how to build apps with Flutter? All the answers are in our column! Don't hesitate anymore, the content of the column will continue to be updated, and the price will increase accordingly. Join now and enjoy the best price! Let's explore the world of Flutter together! Want to know more? Click here to view the Flutter Developer 101 Getting Started booklet column guide . In addition, we also have a dedicated discussion group, you can click here to join our discussion group to communicate and learn with other Flutter learners.

Guess you like

Origin blog.csdn.net/diandianxiyu/article/details/131904799