Translate-Flutter/lib/page/translator_result/translator_result_view.dart
2024-07-23 16:16:11 +08:00

251 lines
10 KiB
Dart
Executable File

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:trans_lark/generated/assets.dart';
import 'package:trans_lark/global/translate_manager.dart';
import 'package:trans_lark/page/translator_result/translator_result_logic.dart';
import 'package:trans_lark/page/translator_result/translator_result_state.dart';
import 'package:trans_lark/util/obj_util.dart';
import 'package:trans_lark/widget/base_appbar.dart';
import 'package:trans_lark/widget/language_result_bar.dart';
class TranslatorResultPage extends StatefulWidget {
const TranslatorResultPage({super.key});
@override
State<TranslatorResultPage> createState() => _TranslatorResultPageState();
}
class _TranslatorResultPageState extends State<TranslatorResultPage> {
final TranslatorResultPageLogic logic = Get.put(TranslatorResultPageLogic());
final TranslatorResultPageState state =
Get.find<TranslatorResultPageLogic>().state;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
height: double.infinity,
width: double.infinity,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage(Assets.imagesTranslatorResultBackground),
fit: BoxFit.fill,
),
),
child: Column(
children: [
BaseAppBar(
backgroundColor: Colors.transparent,
titleWidget: LanguageResultBar(
fromLanguage: state.isHistory
? (state.fromLanguage != null ? state.fromLanguage! : '')
: TranslateManager().fromLanguageEntity.value.languageName,
toLanguage: state.isHistory
? (state.toLanguage != null ? state.toLanguage! : '')
: TranslateManager().toLanguageEntity.value.languageName,
),
),
Expanded(
child: ListView(
padding: const EdgeInsets.symmetric(vertical: 20),
children: [
Obx(
() => Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
state.sourceText.value,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.w600,
color: Color(0xff152A3D),
),
),
),
GestureDetector(
onTap: Get.back,
child: ClipOval(
child: Container(
width: 30,
height: 30,
color: const Color(0xffF4F4F6),
child: const Icon(
Icons.close,
size: 20,
),
),
),
)
],
),
const SizedBox(
height: 30,
),
GestureDetector(
onTap: () => logic.translatorTtsPlay(
state.sourceText.value, "from"),
child: ClipOval(
child: Container(
width: 32,
height: 32,
color: const Color(0x334ECA8C),
child: FittedBox(
fit: BoxFit.none,
child: SvgPicture.asset(
Assets.svgSpeaker,
width: 20,
height: 20,
),
),
),
),
),
const SizedBox(
height: 30,
),
const Divider(
height: 1,
)
],
),
),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.symmetric(vertical: 20),
child: Obx(() {
return Row(
children: [
Flexible(
child: Text(
TranslateManager()
.toLanguageEntity
.value
.languageName,
style: const TextStyle(
color: Color(0xff949494),
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
),
const SizedBox(width: 20),
Visibility(
visible: !state.isTranslationCompleted.value,
child: const SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(
strokeWidth: 2,
color: Color(0xff4ECA8C),
),
),
),
],
);
}),
),
Obx(
() => Text(
state.targetText.value,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.w600,
color: Color(0xff152A3D),
),
),
),
const SizedBox(
height: 20,
),
Obx(() {
return Visibility(
visible:
ObjUtil.isNotEmptyStr(state.targetText.value),
child: Row(
children: [
GestureDetector(
onTap: () => logic.translatorTtsPlay(
state.targetText.value, "to"),
child: ClipOval(
child: Container(
width: 32,
height: 32,
color: const Color(0x334ECA8C),
child: FittedBox(
fit: BoxFit.none,
child: SvgPicture.asset(
Assets.svgSpeaker,
width: 20,
height: 20,
),
),
),
),
),
const SizedBox(width: 16),
GestureDetector(
onTap: logic.copy,
child: ClipOval(
child: Container(
width: 32,
height: 32,
color: const Color(0xffF4F4F6),
child: FittedBox(
fit: BoxFit.none,
child: Image.asset(
Assets.imagesCopy,
width: 20,
height: 20,
),
),
),
),
),
const SizedBox(width: 16),
GestureDetector(
onTap: logic.openFullScreenPage,
child: ClipOval(
child: Container(
width: 32,
height: 32,
color: const Color(0xffF4F4F6),
child: FittedBox(
fit: BoxFit.none,
child: Image.asset(
Assets.imagesFullScreen,
width: 20,
height: 20,
),
),
),
),
),
],
),
);
}),
],
),
),
],
)),
],
),
),
);
}
}