我如何创建一个在单击时发音的函数?

How can I create a function that pronounces the word when it's clicked?

我有这个应用程序适合有词汇量的孩子,我想知道如何创建一个函数来发音用英语写的单词。我看到 Google 有一个 Google 翻译器 API 但找不到有关如何使用它的信息。你们知道我该如何实现吗?

class AnimalsScreen extends StatelessWidget {

final DocumentSnapshot animals;

AnimalsScreen(this.animals);

@override
Widget build(BuildContext context) {
return Column(
  children: <Widget>[
    Padding(
      padding: const EdgeInsets.all(10.0),
      child: Card(
        elevation: 7.0,
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(50)
        ),
        child: Column(
          children: <Widget>[
            Container(
                height: 350.0,
                width: 350.0,
                decoration: BoxDecoration(
                    image: DecorationImage(
                        image: NetworkImage(animals.data["image"]
                        ),
                        fit: BoxFit.fill),
                    borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(50),
                        topRight: Radius.circular(50)))
            ),
            Container(
              height: 70.0,
              width: 300.0,
              child: Padding(
                  padding: const EdgeInsets.all(2.0),
                  child: Center(
                    child: AutoSizeText(animals.data["name"],
                      style: TextStyle(
                          fontFamily: 'Twiddlestix',
                          fontSize: 25,
                          fontWeight: FontWeight.bold),
                      textAlign: TextAlign.center,
                      minFontSize: 15,
                    ),
                  )
              ),


            ),

          ],

        ),
      ),
    ),

    ],
  );
 }
}

您可以试试这个包,https://pub.dev/packages/text_to_speech_api or look for any other text to speech https://pub.dev/flutter/packages?q=text+to+speech。我没有尝试任何一个,但看起来很有效。 希望对您有所帮助!

只需查看我使用您的 ui 制作的这个示例,我刚刚将静态字符串传递给它。有一个名为 flutter_tts 的插件,也许这对您有用。只需检查示例:

Link 对于插件:https://pub.dev/packages/flutter_tts

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

void main() => runApp(ApiCalling());

class ApiCalling extends StatefulWidget {
  @override
  _ApiCallingState createState() => _ApiCallingState();
}

enum TtsState { playing, stopped }

class _ApiCallingState extends State<ApiCalling> {
  bool showLoader = false;
  FlutterTts flutterTts;
  TtsState ttsState = TtsState.stopped;
  String _newVoiceText = 'CAT';
  double volume = 0.5;
  double pitch = 1.0;
  double rate = 0.5;

  @override
  void initState() {
    super.initState();
    flutterTts = FlutterTts();
    initSpeak();
  }

  initSpeak() {
    flutterTts.setStartHandler(() {
      setState(() {
        ttsState = TtsState.playing;
      });
    });

    flutterTts.setCompletionHandler(() {
      setState(() {
        ttsState = TtsState.stopped;
      });
      print('Speaking End');
    });

    flutterTts.setErrorHandler((msg) {
      setState(() {
        ttsState = TtsState.stopped;
      });
    });
  }

  @override
  void dispose() {
    super.dispose();
    flutterTts.stop();
  }

  Future _speak() async {
    await flutterTts.setVolume(volume);
    await flutterTts.setSpeechRate(rate);
    await flutterTts.setPitch(pitch);

    if (_newVoiceText != null) {
      if (_newVoiceText.isNotEmpty) {
        var result = await flutterTts.speak(_newVoiceText);
        if (result == 1) setState(() => ttsState = TtsState.playing);
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.all(10.0),
                child: GestureDetector(
                  onTap: () {
                    _speak();
                  },
                  child: Card(
                    elevation: 7.0,
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(50)),
                    child: Column(
                      children: <Widget>[
                        Container(
                            height: 350.0,
                            width: 350.0,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: AssetImage(
                                      'images/cat.jpg',
                                    ),
                                    fit: BoxFit.fill),
                                borderRadius: BorderRadius.only(
                                    topLeft: Radius.circular(50),
                                    topRight: Radius.circular(50)))),
                        Container(
                          height: 70.0,
                          width: 300.0,
                          child: Padding(
                              padding: const EdgeInsets.all(2.0),
                              child: Center(
                                child: AutoSizeText(
                                  'CAT',
                                  style: TextStyle(
                                      fontFamily: 'Twiddlestix',
                                      fontSize: 25,
                                      fontWeight: FontWeight.bold),
                                  textAlign: TextAlign.center,
                                  minFontSize: 15,
                                ),
                              )),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

如果有效请告诉我。