Создание предложений на разных экранах - FlutterTts
Проект о коммуникаторе.
На каждом экране этот виджет используется в качестве верхней панели экрана. Он закодирован следующим образом:
import 'exports.dart';
import 'package:flutter/material.dart';
import 'package:flutter_tts/flutter_tts.dart';
class Bar extends StatefulWidget {
var message = [];
late String txt = '';
State<Bar> createState() => _BarState();
}
class _BarState extends State<Bar> {
Bar bar = Bar();
late FlutterTts tts;
void initState() {
super.initState();
initTts();
tts.setLanguage('ca');
}
void dispose() {
super.dispose();
tts.stop();
}
initTts() async {
tts = FlutterTts();
await tts.awaitSpeakCompletion(true);
}
Widget build(BuildContext context) {
return SafeArea(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(height: 15),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder:(context) => App()));
},
child: Image.asset('img/homeICON.png', width:100, height:100, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
Navigator.pop(context);
},
child: Image.asset('img/back.png', width:68, height:100, fit: BoxFit.cover)
),
const SizedBox(width: 10),
Scrollbar(
scrollbarOrientation: ScrollbarOrientation.bottom,
child: Container(
color: Colors.white,
width: 600,
height: 100,
),
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
print('TXT -> $txt');
speak();
},
child: Image.asset('img/play.png', width:80, height:100, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
},
child: Image.asset('img/delete.png', width:95, height:100, fit:
BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
},
child: Image.asset('img/trash.png', width:68, height:100, fit: BoxFit.cover)
),
],
),
);
}
Future speak() async {
await tts.setVolume(1);
await tts.setSpeechRate(0.5);
await tts.setPitch(1);
await tts.speak(bar.txt);
}
}
Выглядит как:
верхняя панель корня приложения
или
Разбираем экран Animals.dart.
Каждая кнопка ELevated представляет собой пиктограмму. Когда пользователь нажимает на него, он использует FlutterTts.speak, чтобы громко прочитать его имя. Кроме того, я хочу создать фразу со всеми пиктограммами, которые выбирает пользователь, и воспроизвести ее при нажатии кнопки воспроизведения на верхней панели.
Животные.дарт:
import 'package:flutter/material.dart';
import 'package:flutter_tts/flutter_tts.dart';
import 'exports.dart';
class Animals extends StatefulWidget {
State<Animals> createState() => _AnimalsState();
}
class _AnimalsState extends State<Animals> {
App app = App();
Bar bar = Bar();
late FlutterTts tts;
void initState() {
super.initState();
initTts();
tts.setLanguage('ca');
}
initTts() async {
tts = FlutterTts();
await tts.awaitSpeakCompletion(true);
}
Widget build(BuildContext context) {
return Scaffold(
body: Container(
padding: const EdgeInsets.all(10),
child: Column(
children: [
Bar(),
const SizedBox(height: 50),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'cocodril';
bar.txt += 'cocodril';
speak();
},
child: Image.asset('img/cocodril.png', width:160,
height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'elefant';
bar.txt += 'elefant';
speak();
},
child: Image.asset('img/elefant.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'gos';
bar.txt += 'gos';
speak();
},
child: Image.asset('img/gos.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'lloro';
bar.txt += 'lloro';
speak();
},
child: Image.asset('img/lloro.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'peix';
bar.txt += 'peix';
speak();
},
child: Image.asset('img/peix.png', width:160, height:160,
fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'pingüi';
bar.txt += 'pingüi';
speak();
},
child: Image.asset('img/pingui.png', width:160,
height:160, fit: BoxFit.cover)
),
],
),
const SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'caball';
bar.txt += 'caball';
speak();
},
child: Image.asset('img/caball.png', width:160,
height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'ànec';
bar.txt += 'ànec';
speak();
},
child: Image.asset('img/anec.png', width:160, height:160,
fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'aranya';
bar.txt += 'aranya';
speak();
},
child: Image.asset('img/aranya.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'gat';
bar.txt += 'gat';
speak();
},
child: Image.asset('img/gat.png', width:160, height:160,
fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'hipopòtam';
bar.txt += 'hipopòtam';
speak();
},
child: Image.asset('img/hipopotam.png', width:160, height:160,
fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'serp';
bar.txt += 'serp';
speak();
},
child: Image.asset('img/serp.png', width:160,
height:160, fit: BoxFit.cover)
),
],
),
const SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'periquito';
bar.txt += 'periquito';
speak();
},
child: Image.asset('img/periquito.png', width:160,
height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'jàmster';
bar.txt += 'jàmster';
speak();
},
child: Image.asset('img/hamster.png', width:160, height:160,
fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'tortuga';
bar.txt += 'tortuga';
speak();
},
child: Image.asset('img/tortuga.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'ós';
bar.txt += 'ós';
speak();
},
child: Image.asset('img/os.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'ocell';
bar.txt += 'ocell';
speak();
},
child: Image.asset('img/ocell.png', width:160, height:160, fit: BoxFit.cover)
),
const SizedBox(width: 10),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
),
onPressed: () {
app.txt = 'peix pallaso';
bar.txt += 'peix pallaso';
speak();
},
child: Image.asset('img/peix_pallaso.png', width:160, height:160, fit: BoxFit.cover)
),
],
)
]
),
),
);
}
Future speak() async {
await tts.setVolume(1);
await tts.setSpeechRate(0.5);
await tts.setPitch(1);
if (app.txt != null) {
if (app.txt!.isNotEmpty) {
await tts.speak(app.txt!);
}
}
}
}
Слово, связанное с пиктограммой, считывается с использованием метода «проговаривание».
Фраза, созданная всеми пиктограммами, нажатыми пользователем, находится в атрибуте класса Bar.dart.
Чтобы создать одно предложение, при каждом нажатии пиктограммы также добавляйте слово в предложении.
Не могу понять, почему не читает предложение...
Любая помощь?
Заранее спасибо !