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/home/home_logic.dart'; import 'package:trans_lark/util/obj_util.dart'; import 'package:trans_lark/widget/language_bar.dart'; class HomePage extends StatelessWidget { final HomeLogic logic = Get.put(HomeLogic()); HomePage({super.key}); @override Widget build(BuildContext context) { return Scaffold( body: Container( width: double.infinity, height: double.infinity, padding: const EdgeInsets.symmetric(horizontal: 20), decoration: const BoxDecoration( image: DecorationImage( image: AssetImage( Assets.imagesHomeBackground, ), fit: BoxFit.fill, ), ), child: SafeArea( child: Column( children: [ _buildHead(), Expanded( child: SingleChildScrollView( child: Column( children: [ _buildDailyQuote(), Column( children: [ const SizedBox(height: 66), Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Column( children: [ GestureDetector( onTap: logic.onTapPhotos, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(10), decoration: BoxDecoration( color: const Color(0xffD2FFFB), borderRadius: BorderRadius.circular(36), ), child: Image.asset( Assets.imagesPhoto, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "Photo", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), Column( children: [ GestureDetector( onTap: logic.openFaceToFace, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(10), decoration: BoxDecoration( color: const Color(0xffE1E2FE), borderRadius: BorderRadius.circular(36), ), child: Image.asset( Assets.imagesDialog, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "Face2face", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), Column( children: [ GestureDetector( onTap: logic.openTranslateHistory, child: Container( width: 72, height: 72, padding: const EdgeInsets.all(10), decoration: BoxDecoration( color: const Color(0xffFEE5C5), borderRadius: BorderRadius.circular(36), ), child: Image.asset( Assets.imagesHistory, ), ), ), const Padding( padding: EdgeInsets.only(top: 10), child: Text( "History", style: TextStyle( fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500, ), ), ) ], ), ], ), const SizedBox(height: 96), Column( children: [ GestureDetector( onTap: logic.openTranslate, child: Container( height: 76, alignment: Alignment.center, decoration: BoxDecoration( color: const Color.fromARGB( 213, 69, 168, 254, ), borderRadius: BorderRadius.circular(16), border: Border.all( width: 1.5, color: const Color(0xff0087FF), ), ), 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(0xff8BCFFE), borderRadius: BorderRadius.circular(18), ), child: SvgPicture.asset( Assets.svgHomeVoice, ), ), ), ), ], ), ), ), const SizedBox(height: 20), const LanguageBar(), const SizedBox(height: 20), ], ), ], ), ], ), ), ), ], ), ), ), ); } Widget _buildHead() { return Padding( padding: const EdgeInsets.symmetric(vertical: 10), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ const Text( "Courses", style: TextStyle( color: Color(0xff1E1E1E), fontSize: 24, fontWeight: FontWeight.w700, ), ), GestureDetector( onTap: logic.openSettings, child: ClipOval( child: Container( width: 32, height: 32, color: const Color(0xff4ECA8C), child: FittedBox( fit: BoxFit.none, child: SvgPicture.asset( Assets.svgHomeMore, width: 20, height: 20, ), ), ), ), ), ], ), ); } Widget _buildDailyQuote() { return Stack( children: [ GestureDetector( onTap: logic.openSceneType, child: Column( children: [ const SizedBox(height: 30), Container( height: 222, decoration: BoxDecoration( border: Border.all(width: 1.5, color: const Color(0xff3AAA72)), color: const Color.fromARGB(213, 78, 202, 140), borderRadius: BorderRadius.circular(16)), ), ], ), ), Positioned( top: 46, left: 20, child: GestureDetector( onTap: logic.openSceneType, child: 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), ) ], ), ), ), Positioned( top: -4, right: 24, child: Image.asset( Assets.imagesRabbitSayGood, width: 90, height: 90, ), ), Column( children: [ const SizedBox( height: 85, ), Container( width: double.infinity, height: 168, padding: const EdgeInsets.symmetric(horizontal: 20), alignment: Alignment.center, decoration: BoxDecoration( border: Border.all(width: 1.5, color: const Color(0xff3AAA72)), 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( ObjUtil.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( ObjUtil.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, ), ), ), ), ], ), ], ), ), ], ), ), ], ), ], ); } }