You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
334 lines
13 KiB
334 lines
13 KiB
import 'package:flutter/material.dart';
|
|
import 'package:get/get.dart';
|
|
import '../controllers/flutter_tts_test_controller.dart';
|
|
import '../../../data/services/flutter_tts_service.dart';
|
|
|
|
/// Flutter TTS测试视图，演示如何使用FlutterTtsService
|
|
class FlutterTtsTestView extends GetView<FlutterTtsTestController> {
|
|
const FlutterTtsTestView({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
title: const Text('Flutter TTS Test'),
|
|
centerTitle: true,
|
|
),
|
|
body: SingleChildScrollView(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
// 播放控制卡片
|
|
Card(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Playback Controls',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
children: [
|
|
Obx(() {
|
|
final isPlaying = controller.isPlaying;
|
|
return ElevatedButton.icon(
|
|
onPressed: isPlaying
|
|
? null
|
|
: () => _playAllTexts(),
|
|
icon: isPlaying
|
|
? const SizedBox(
|
|
width: 20,
|
|
height: 20,
|
|
child: CircularProgressIndicator(strokeWidth: 2),
|
|
)
|
|
: const Icon(Icons.playlist_play),
|
|
label: Text(isPlaying ? 'Playing...' : 'Play All'),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.green,
|
|
foregroundColor: Colors.white,
|
|
),
|
|
);
|
|
}),
|
|
Obx(() {
|
|
final isActive = controller.ttsState != TtsState.stopped;
|
|
return ElevatedButton.icon(
|
|
onPressed: isActive
|
|
? () => controller.stop()
|
|
: null,
|
|
icon: const Icon(Icons.stop),
|
|
label: const Text('Stop'),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.red,
|
|
foregroundColor: Colors.white,
|
|
),
|
|
);
|
|
}),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
// 语音选择卡片
|
|
Card(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Voice Selection',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
|
|
Obx(() {
|
|
final voices = controller.voices;
|
|
final currentVoice = controller.currentVoice;
|
|
|
|
if (voices.isEmpty) {
|
|
return const Padding(
|
|
padding: EdgeInsets.all(8.0),
|
|
child: Text(
|
|
'No voices available. Please check TTS settings on your device.',
|
|
style: TextStyle(
|
|
color: Colors.red,
|
|
fontStyle: FontStyle.italic,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
return DropdownButtonFormField<String>(
|
|
decoration: const InputDecoration(
|
|
labelText: 'Select Voice',
|
|
border: OutlineInputBorder(),
|
|
contentPadding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
|
),
|
|
value: currentVoice.isNotEmpty ? currentVoice : null,
|
|
items: voices.map((voice) {
|
|
final name = voice['name'] ?? 'Unknown';
|
|
final locale = voice['locale'] ?? '';
|
|
return DropdownMenuItem<String>(
|
|
value: name,
|
|
child: Text('$name ${locale.isNotEmpty ? '($locale)' : ''}'),
|
|
);
|
|
}).toList(),
|
|
onChanged: controller.isPlaying
|
|
? null
|
|
: (value) {
|
|
if (value != null) {
|
|
controller.setVoice(value);
|
|
}
|
|
},
|
|
isExpanded: true,
|
|
hint: const Text('Select a voice'),
|
|
);
|
|
}),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
// 播报内容列表卡片
|
|
Card(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Sample Texts',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
|
|
// 预设的播报内容
|
|
ListView.separated(
|
|
shrinkWrap: true,
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
itemCount: _getSampleTexts().length,
|
|
separatorBuilder: (context, index) => const Divider(height: 1),
|
|
itemBuilder: (context, index) {
|
|
final text = _getSampleTexts()[index];
|
|
|
|
return Obx(() {
|
|
final isPlaying = controller.isPlaying;
|
|
final isCurrentPlaying = controller.isPlaying &&
|
|
controller.currentText == text;
|
|
|
|
return ListTile(
|
|
title: Text(
|
|
text,
|
|
style: TextStyle(
|
|
fontWeight: isCurrentPlaying ? FontWeight.bold : FontWeight.normal,
|
|
color: isCurrentPlaying ? Colors.blue : null,
|
|
),
|
|
),
|
|
leading: CircleAvatar(
|
|
backgroundColor: isCurrentPlaying
|
|
? Colors.blue
|
|
: Colors.blue.shade100,
|
|
radius: 18,
|
|
child: Icon(
|
|
isCurrentPlaying ? Icons.volume_up : Icons.play_arrow,
|
|
color: isCurrentPlaying ? Colors.white : Colors.blue,
|
|
size: 20,
|
|
),
|
|
),
|
|
onTap: isPlaying
|
|
? null
|
|
: () => controller.speak(text),
|
|
enabled: !isPlaying,
|
|
tileColor: isCurrentPlaying ? Colors.blue.withOpacity(0.1) : null,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(8),
|
|
side: isCurrentPlaying
|
|
? const BorderSide(color: Colors.blue, width: 1)
|
|
: BorderSide.none,
|
|
),
|
|
);
|
|
});
|
|
},
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
// 状态显示卡片
|
|
Card(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Status',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 8),
|
|
Obx(() {
|
|
final state = controller.ttsState;
|
|
final stateText = _getTtsStateText(state);
|
|
final stateColor = _getTtsStateColor(state);
|
|
|
|
return Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: stateColor.withOpacity(0.1),
|
|
borderRadius: BorderRadius.circular(8),
|
|
border: Border.all(color: stateColor.withOpacity(0.3)),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Icon(
|
|
_getTtsStateIcon(state),
|
|
color: stateColor,
|
|
),
|
|
const SizedBox(width: 8),
|
|
Text(
|
|
'Current Status: $stateText',
|
|
style: TextStyle(
|
|
color: stateColor,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
// 连续播放所有文本
|
|
void _playAllTexts() {
|
|
// 使用控制器的连续播放功能播放所有文本
|
|
controller.speakTexts(_getSampleTexts());
|
|
}
|
|
|
|
// 获取TTS状态文本
|
|
String _getTtsStateText(TtsState state) {
|
|
switch (state) {
|
|
case TtsState.playing:
|
|
return 'Playing';
|
|
case TtsState.paused:
|
|
return 'Paused';
|
|
case TtsState.stopped:
|
|
return 'Stopped';
|
|
default:
|
|
return 'Unknown';
|
|
}
|
|
}
|
|
|
|
// 获取TTS状态颜色
|
|
Color _getTtsStateColor(TtsState state) {
|
|
switch (state) {
|
|
case TtsState.playing:
|
|
return Colors.green;
|
|
case TtsState.paused:
|
|
return Colors.orange;
|
|
case TtsState.stopped:
|
|
return Colors.grey;
|
|
default:
|
|
return Colors.grey;
|
|
}
|
|
}
|
|
|
|
// 获取TTS状态图标
|
|
IconData _getTtsStateIcon(TtsState state) {
|
|
switch (state) {
|
|
case TtsState.playing:
|
|
return Icons.volume_up;
|
|
case TtsState.paused:
|
|
return Icons.pause;
|
|
case TtsState.stopped:
|
|
return Icons.stop;
|
|
default:
|
|
return Icons.help_outline;
|
|
}
|
|
}
|
|
|
|
// 获取示例文本
|
|
List<String> _getSampleTexts() {
|
|
return [
|
|
'This is a Flutter TTS test. Please listen to the synthesis effect.',
|
|
'这是Flutter TTS测试，请听取合成效果。',
|
|
'Flutter TTS supports various voices and parameter adjustments.',
|
|
'Flutter TTS支持多种语音和参数调节，可以根据需要进行设置。',
|
|
];
|
|
}
|
|
}
|