Translate-Flutter/lib/widget/t_speak_dialog.dart
xuhang-x 9c164f239e 1
2024-07-25 16:15:21 +08:00

136 lines
4.4 KiB
Dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:trans_lark/generated/assets.dart';
import 'package:trans_lark/global/translate_manager.dart';
class TSpeakDialog extends StatelessWidget {
const TSpeakDialog({
super.key,
required this.isListening,
required this.onTap,
});
final Rx<bool> isListening;
final Function() onTap;
@override
Widget build(BuildContext context) {
return Stack(
alignment: Alignment.bottomCenter,
children: [
Positioned(
bottom: 320,
child: Row(
children: [
Image.asset(
Assets.imagesRabbitEars,
width: 38,
height: 59,
),
const SizedBox(width: 4),
Image.asset(
Assets.imagesRabbitEars,
width: 38,
height: 59,
),
],
),
),
Container(
width: MediaQuery.of(context).size.width,
height: 340,
padding: const EdgeInsets.symmetric(horizontal: 10),
clipBehavior: Clip.antiAlias,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20), topRight: Radius.circular(20)),
),
child: Column(
children: [
Image.asset(
Assets.imagesSpeakFace,
width: 215,
height: 155,
// color: Colors.white,
),
const SizedBox(height: 4),
Column(
children: [
Obx(() {
return Visibility(
visible: isListening.value,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text(
'Please speak ',
style: TextStyle(
color: Color(0xff999999),
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
Flexible(
child: Text(
TranslateManager()
.fromLanguageEntity
.value
.languageName,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: Colors.black,
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
),
],
),
);
}),
Obx(() {
return Text(
isListening.value
? 'I am listening, Click the button to end and translate'
: 'Click the button to start speaking',
maxLines: 2,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.center,
style: const TextStyle(
color: Color(0xff999999),
fontSize: 16,
fontWeight: FontWeight.w500,
),
);
}),
],
),
const SizedBox(height: 20),
ClipOval(
child: GestureDetector(
onTap: onTap,
child: Container(
width: 60,
height: 60,
color: const Color(0xff87ECB3),
child: Obx(() {
return Icon(
isListening.value ? Icons.pause : Icons.mic,
color: Colors.white,
size: 36,
);
}),
),
),
),
],
),
),
],
);
}
}