Translate-Flutter/lib/page/translator/translator_view.dart
fengshengxiong c39a412706 init connmit
2024-07-01 14:18:42 +08:00

218 lines
8.1 KiB
Dart
Executable File

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:translator_lux/util/image_asset.dart';
import 'package:translator_lux/util/svg_asset.dart';
import 'package:translator_lux/widget/tranlator_from_to.dart';
import 'translator_logic.dart';
import 'translator_state.dart';
/// @description: 翻译页面
/// @lifu
/// @date: 2024-06-27 13:55:27
class TranlatorPage extends StatefulWidget {
const TranlatorPage({super.key});
static String routName = "/translate";
@override
State<TranlatorPage> createState() => _TranlatorPageState();
}
class _TranlatorPageState extends State<TranlatorPage> {
final TranslatorLogic logic = Get.put(TranslatorLogic());
final TranslatorState state = Get.find<TranslatorLogic>().state;
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
surfaceTintColor: Colors.transparent,
automaticallyImplyLeading: false,
title: Row(
children: [
IconButton(
onPressed: () {
Get.back();
},
icon: const Icon(
Icons.arrow_back_ios,
),
),
const Expanded(child: TranslatorFromTo()),
],
),
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
constraints: const BoxConstraints(
maxHeight: 200.0,
minHeight: 76.0,
),
decoration: BoxDecoration(
border:
Border.all(width: 1.5, color: const Color(0xff0087FF)),
color: const Color(0xff45A7FE),
borderRadius: const BorderRadius.all(Radius.circular(10))),
padding: const EdgeInsets.only(
left: 16.0, right: 16.0, top: 10.0, bottom: 4.0),
child: TextField(
textInputAction: TextInputAction.done,
controller: state.textController,
style: const TextStyle(
color: Colors.black,
fontSize: 20,
fontWeight: FontWeight.w400,
),
maxLines: null,
autofocus: true,
decoration: InputDecoration(
border: InputBorder.none,
hintText: "Type to Translate",
hintStyle: const TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w400,
),
suffixIcon: Obx(
() => GestureDetector(
onTap: () {
if (state.isValue.value) {
state.textController.text = "";
state.isValue.value = !state.isValue.value;
} else {}
},
child: Container(
height: 36,
width: 36,
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: const Color(0xff8BCFFE),
borderRadius: BorderRadius.circular(25),
),
child: state.isValue.value
? const Icon(Icons.close)
: SvgPicture.asset(SvgAsset.homeVoice),
),
),
),
),
onChanged: (value) {
if (value != "" && value.isNotEmpty) {
state.isValue.value = true;
} else {
state.isValue.value = false;
}
},
onSubmitted: (value) {
if (value != "" && value.isNotEmpty) {
logic.toResult(value);
}
},
),
),
Obx(() => state.isThereData.value
? Expanded(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
"History",
style: TextStyle(
fontSize: 16,
color: Color(
0xff979797,
),
fontWeight: FontWeight.w500,
),
),
IconButton(
onPressed: () {
logic.cleanAllHistory();
},
icon: Image.asset(
ImageAsset.deleteIcon,
width: 24,
height: 24,
),
)
],
),
const SizedBox(
height: 10,
),
Expanded(
child: ListView.builder(
padding: EdgeInsets.zero,
itemBuilder: (context, index) {
return ListTile(
title: RichText(
overflow: TextOverflow.ellipsis,
text: TextSpan(
children: [
TextSpan(
text: state
.historyShowData[index].sourceText!,
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 16,
color: Colors.black,
),
),
const WidgetSpan(
child: SizedBox(
width: 6,
)),
TextSpan(
text: state
.historyShowData[index].targetText!,
style: const TextStyle(
color: Color(0xff979797),
fontSize: 13,
fontWeight: FontWeight.w400,
),
),
],
),
),
onTap: () {
state.textController.text =
state.historyShowData[index].sourceText!;
state.isValue.value = true;
},
);
},
itemCount: state.historyShowData.length,
),
),
],
),
)
: Expanded(
child: Center(
child: Image.asset(
ImageAsset.rabbitSayGood,
width: 100,
height: 100,
),
),
)),
],
),
)),
);
}
}