Daniel Salas DG
Daniel Salas DG

Reputation: 109

How to show a status of "playing" and "silent" in flutter text to speech?

I have this program which transforms text to audio, it works without problem, but so far I have not been able to integrate and find information about showing a text that says "playing" and "off", so that when it plays it shows "playing" and vice versa I would really appreciate a little help, thank you very much.

This is my code.

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

class TextVoicePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: TextVoice(),
      ),
    );
  }

class TextVoice extends StatelessWidget {
  final FlutterTts flutterTts = FlutterTts();

  @override
  Widget build(BuildContext context) {
    TextEditingController textEditingController = TextEditingController();

    Future _speak(String text) async {
      await flutterTts.setLanguage("es-MX");
      await flutterTts.setPitch(1);
      await flutterTts.speak(text);
    }

    Future _stop() async {
      await flutterTts.stop();
    }


    return Scaffold(
        body: Stack(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.all(30.0),
              child: TextFormField(
                decoration: InputDecoration(
                  hintText: 'Introduce el texto.',
                  labelStyle: TextStyle(color: Colors.white70, fontSize: 16.0),
                  enabledBorder: OutlineInputBorder(
                    borderSide: BorderSide(color: Colors.pink[900]),
                  ),
                  focusedBorder: OutlineInputBorder(
                    borderSide: BorderSide(color: Colors.pink[50]),
                  ),
                  hintStyle: TextStyle(color: Colors.white30, fontSize: 16.0),
                  border: OutlineInputBorder(),
                ),
                controller: textEditingController,
                cursorColor: Colors.white,
                style: TextStyle(color: Colors.white70, fontSize: 16.0),
                maxLines: null,
              ),
            ),
          ],
        ),
        floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
        bottomNavigationBar: Container(
          color: Colors.black,
          height: 40.0,
          alignment: Alignment.topCenter,
        ),
        floatingActionButton: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              FloatingActionButton(
                backgroundColor: Colors.green,
                heroTag: "btn",
                onPressed: () => _speak(textEditingController.text),
                child: Icon(Icons.play_arrow),
              ),
              SizedBox(
                width: 40,
              ),
              FloatingActionButton(
                backgroundColor: Colors.red,
                heroTag: "btn2",
                onPressed: () => _stop(),
                child: Icon(Icons.stop),
              )
            ],
          ),
        ));
  }
}

Upvotes: 3

Views: 791

Answers (0)

Related Questions