import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:get/get.dart'; import 'package:trans_lark/generated/assets.dart'; import 'package:trans_lark/page/index/index_controller.dart'; import 'package:trans_lark/util/t_object_utils.dart'; import 'package:trans_lark/widget/t_language_bar_widget.dart'; class IndexView extends StatelessWidget { final IndexController logic = Get.put(IndexController()); IndexView({super.key}); @override Widget build(BuildContext context) { return Scaffold( body: Container( padding: const EdgeInsets.symmetric(horizontal: 12), decoration: const BoxDecoration( image: DecorationImage( image: AssetImage(Assets.imagesHomeBackground), fit: BoxFit.fill, ), ), child: SafeArea( child: Column( children: [ _buildHead(), Expanded(child: Container()), _buildDailyQuote(), Expanded(child: Container()), _buildTools(), Expanded(child: Container()), _buildTranslate(), ], ), ), ), ); } Widget _buildHead() { return Padding( padding: const EdgeInsets.symmetric(vertical: 10), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Container( padding: const EdgeInsets.symmetric(horizontal: 20), decoration: const BoxDecoration( image: DecorationImage( image: AssetImage( Assets.imagesTitleBakcground, ), ), ), child: const Text( "Instant Translator", style: TextStyle( color: Color(0xff1E1E1E), fontSize: 24, fontWeight: FontWeight.w700, ), ), ), GestureDetector( onTap: logic.openSettingsBottomSheet, child: ClipOval( child: Image.asset( Assets.imagesHomeMore, width: 32, height: 32, ), ), ), ], ), ); } Widget _buildDailyQuote() { return Container( decoration: BoxDecoration( border: Border.all( width: 1.5, color: const Color(0xff3AAA72), ), color: const Color(0xff78dfa8), borderRadius: BorderRadius.circular(16), ), child: Stack( clipBehavior: Clip.none, children: [ Positioned( top: 16, right: 31, left: 31, child: Image.asset( Assets.imagesDailyQuoteBackground, ), ), GestureDetector( onTap: logic.toSceneCategory, child: Column( children: [ Container( padding: const EdgeInsets.symmetric( horizontal: 30, vertical: 15, ), child: Stack( alignment: AlignmentDirectional.bottomStart, children: [ Positioned( bottom: 2.8, child: Container( width: 73, height: 7, decoration: BoxDecoration( color: const Color(0xfffff0a0), borderRadius: BorderRadius.circular(16), ), ), ), Row( children: [ const Text( "Daily Quote", style: TextStyle( fontSize: 20, fontWeight: FontWeight.w800, fontStyle: FontStyle.italic, color: Colors.white, ), ), Padding( padding: const EdgeInsets.only(left: 5), child: SvgPicture.asset(Assets.svgHomeRightIcon), ), ], ) ], ), ), Column( children: [ Container( width: double.infinity, height: 168, padding: const EdgeInsets.symmetric(horizontal: 20), alignment: Alignment.center, decoration: BoxDecoration( border: const Border( top: BorderSide( width: 1.5, color: Color(0xff1AB069), ), ), color: Colors.white, borderRadius: BorderRadius.circular(16), ), child: Column( children: [ Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start, children: [ Obx(() { return Text( logic.fromLanguage.value != null ? logic.fromLanguage.value!.languageName : '', style: const TextStyle( fontSize: 12, color: Color(0xffC2C3C5), ), ); }), const SizedBox(height: 9), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( child: Obx(() { return Text( TObjectUtils.getStr( logic.fromStr.value), overflow: TextOverflow.ellipsis, style: const TextStyle( fontSize: 16, color: Color(0xff152A3D), fontWeight: FontWeight.w500, ), ); }), ), GestureDetector( onTap: () => logic.translatorTtsPlay(true), child: Container( width: 24, height: 24, padding: const EdgeInsets.all(3), decoration: BoxDecoration( color: const Color.fromARGB( 78, 78, 202, 140), borderRadius: BorderRadius.circular(12)), child: FittedBox( fit: BoxFit.none, child: SvgPicture.asset( Assets.svgSpeaker, width: 16, height: 16, ), ), ), ), ], ), ], ), ), const Divider(height: 1, thickness: 1), Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start, children: [ Obx(() { return Text( logic.toLanguage.value != null ? logic.toLanguage.value!.languageName : '', style: const TextStyle( fontSize: 12, color: Color(0xffC2C3C5), ), ); }), const SizedBox(height: 9), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( child: Obx(() { return Text( TObjectUtils.getStr( logic.toStr.value), overflow: TextOverflow.ellipsis, style: const TextStyle( fontSize: 16, color: Color(0xff152A3D), fontWeight: FontWeight.w500, ), ); }), ), GestureDetector( onTap: () => logic.translatorTtsPlay(false), child: Container( width: 24, height: 24, padding: const EdgeInsets.all(3), decoration: BoxDecoration( color: const Color.fromARGB( 78, 78, 202, 140), borderRadius: BorderRadius.circular(12), ), child: FittedBox( fit: BoxFit.none, child: SvgPicture.asset( Assets.svgSpeaker, width: 16, height: 16, ), ), ), ), ], ), ], ), ), ], ), ), ], ), ], ), ), Positioned( top: -22, right: 5, child: Image.asset( Assets.imagesRabbitSayGood, width: 137, height: 115, ), ), ], ), ); } Widget _buildTools() { return Container( padding: const EdgeInsets.symmetric(horizontal: 12), child: Row( children: [ Column( children: [ GestureDetector( onTap: logic.toPhotos, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(12), decoration: BoxDecoration( color: const Color(0xffD2FFFB), borderRadius: BorderRadius.circular(24), ), child: Image.asset( Assets.imagesToolsPhoto, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "Photo", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), Expanded(child: Container()), Column( children: [ GestureDetector( onTap: logic.toP2P, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(12), decoration: BoxDecoration( color: const Color(0xffE1E2FE), borderRadius: BorderRadius.circular(24), ), child: Image.asset( Assets.imagesToolsDialog, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "Face2face", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), Expanded(child: Container()), Column( children: [ GestureDetector( onTap: logic.toTranslateHistory, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(12), decoration: BoxDecoration( color: const Color(0xffFEE5C5), borderRadius: BorderRadius.circular(24), ), child: Image.asset( Assets.imagesToolsHistory, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "History", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), ], ), ); } Widget _buildTranslate() { return Column( children: [ GestureDetector( onTap: logic.toTranslate, child: Container( height: 91, alignment: Alignment.center, decoration: BoxDecoration( color: const Color(0xff7678ef), borderRadius: BorderRadius.circular(28), border: Border.all(width: 1.5, color: const Color(0xff5153c0)), ), child: Row( children: [ const Expanded( child: Padding( padding: EdgeInsets.only(left: 20), child: Text( "Type to Translate", style: TextStyle( fontSize: 20, fontWeight: FontWeight.w400, color: Colors.white, ), ), ), ), Padding( padding: const EdgeInsets.only( right: 20, ), child: GestureDetector( onTap: logic.onTapSpeak, child: Container( height: 36, width: 36, padding: const EdgeInsets.all(5), decoration: BoxDecoration( color: const Color(0xff5153c0), borderRadius: BorderRadius.circular(18), ), child: SvgPicture.asset( Assets.svgHomeVoice, ), ), ), ), ], ), ), ), const SizedBox(height: 20), const TLanguageBarWidget(), ], ); } }