From d535fef81c21a23e74b3ade482ea580acc060a46 Mon Sep 17 00:00:00 2001 From: AmirrezaChegini Date: Tue, 30 Sep 2025 00:23:08 +0330 Subject: [PATCH] add: hint mission widget and home button --- assets/images/home_button.png | Bin 0 -> 4967 bytes assets/images/play.svg | 62 ++++++++++++++++++ lib/common_ui/resources/my_assets.dart | 2 + .../widgets/answer_box/styles/text_box.dart | 4 +- .../home/presentation/ui/home_page.dart | 54 ++++++++++++--- .../ui/widgets/hint_mission_widget.dart | 62 ++++++++++++++++++ 6 files changed, 173 insertions(+), 11 deletions(-) create mode 100644 assets/images/home_button.png create mode 100644 assets/images/play.svg create mode 100644 lib/features/home/presentation/ui/widgets/hint_mission_widget.dart diff --git a/assets/images/home_button.png b/assets/images/home_button.png new file mode 100644 index 0000000000000000000000000000000000000000..60449585967d9eb6f27ad8bca51dff8c7f6a1d88 GIT binary patch literal 4967 zcmV-t6PWCYP)3Qo!cl~jK(tumO-_a|Rjd0)t2IBYR9QGR6@+mtLI43l zz(dbxAuz!IOkf%l_?I#DO>OqN$ui}(*N1H^+wS*7d-cj-d7~X~q>wH`%G-X!UtCzY zxeeF(Fu1{I;gO|QQW?&N6JBfPrpnR1`$}`wn%AmUJxL&bgCB6HRyo9R3Q2-Qa|VM! zirE4L#u<)+>oDkJnr@qb;64K%1AWJ-fO45bN&sQu5`Hs}K~Q3_z7~Ur-&a-!aOva0 zB7(F0%XfRvaPFO2`0mZiSEJ*)fS_3(bcPRn?l&68!fAhgV$yF-Oax)G=|O^YC9!}g zN+IeckRpKz6R@dx|Imi3lR9Q%y8|(<>!_kO_oN7dl{UG)iE&F@SWCNTOiuz_WM; z5Rt<&?x63~q&a!QNwaOcX)MoODa*IVOt}o?sl8?R_~KystG^ZA?9!5>a^bP1*4_7o zPk;IDP>R4f5U7I$XMgZf2L_jW5)2vzlj@!+Y*`lMKl$xIZ{o6u&Y-e7&TLaoIiA&J ztXQ4`mu2L)q>N=<=`tKcdvyS1G7+Y9DKCtIqw%nQ;r1j0d$fG;48&MuAx@7!I-II%Im0sP$WcUqArWZ?cLa(2Zpy>E=-sjYE)hX6@ve zUX2K(X$9rc&p-h4E>Hx_VeJAshAX&3v@Nel9pKoyI3L>>x&w5$F!Yhe2*Uv90S%Ze z6Q^p5s6oz|RJP%i7al*p-Wma-)vC>RQR{n2hOLNVND&0tl1WR;kZd26?`*~$t{@-= zbv>IbKl2XDM$rIXJM%8QdG39%x}rGqkhN*rA*YH6-{>i#6XD>-3qj9-v>ql1Rd#zL zhQl`nRy^$dR~x}S3H2~kEr{Mw0+I0a6W;!BFx*ONu>+Nm$`zN1+_C{AW z9ZuHZj~@CugkeLqjD;o3JN9;neoGe#kM)qaqlBaf%GF!x6JgWr;DrEJX^}gyZ?22_dzN-%&vW))n=f$8qfK{w1lMGy`h)&{_|ZCi{|6^vh(!5*Ac2dM zArd%%`@en%eEEyNmYGSRSiCzBFic>VM*tK&0jkd!+og(tnIpBunf<{X6qOwD)RQZ7 zl`0S0n@)R0ooQ#C<@#j;tW%WL&CpjxRb*|w15f?yY0NG`qh3cK$}%TTBIrk5c<#g* z=p(<+-*Ze7-ia~*cB9D!L5RGi*|`d?VFK1NQOP`CxO=iSB&SH^3)(&$g=e!IonYR~ zkj@})P4Q2!KY)LD@&xoyw(GSJ7hz3w&1>kZ)S+6LRB4q7`0vwa;du-jJ>?CKT8!NS zvzCFgtJjVCDJsm1EephzOWiqI^$`#m3yO@I0>SxjW(g0PAAqYs!2#pnkG~4tu8_o* z5dhyW;h=pSum>KBNV!x)a3*E`3#ZP&(t8(_8Rb_YD3>n^=6KXebHflaiP zV|rhumEiJ`DxkXn({+chUG8u&GQZg+f~jZy06n-$&}8MHz^c(mS)ArcnkPD9fwcsjXqx2@bm#^#pUMXS&B1UVIBWofIml5ChT) z%!8{viZf75%2lk_fXg3m!V5on%@WQn(9EWRPUntJP@Kc^N>kHk@<>d&+eu3TvGCa0 z)&%Y_S%h_^RTPo;S5tIbMS<9Y=(yjGD3PiB$;q>*1QCRwB6YyEKGcuLl>#L&UO%%0 z7d}|A?JJ@)uH??lk5~(?LE_+mn1wV+TM~%Re|4rsTU*Us2CsDsCPF^_q`rBCM%C>+X{^#pTBubYj95^q%8kX%a?l$oU78AN2c9W{7x{xgG5pQy;a7nm}sw2WNB~w z;yrl#>_=#tLUdY4IbK~P#)H98q{>pXI=JY2?)b~_yMJ(>$`pz_nd3gQoLf(EH7KHq zo1yBsaSw3gR|3Ji+oDB47$uTvWoEynSQwV$nT(lo0FK<@^U6!-pd>}2D&_q~9)>(! z3P^d@;nKxTcpwIBun-`Sl7?eM;NQ{6%`odHC!b4H}<+~rk%wIjvMU=e*W@>8|DZ#Rsmo5(h>O7 zZPUmZ{@A{Ei)*D=$kRGe$NXL|39AjJJc{Cq^BNzf6;L?Ukb$1&WCTBZ@qH;bHv)#* zzE9!6O=vwT{!RnP*8DqUGpi&Ek6vl=s4FJz`ieugh#BXmvVx1N^W;X2mcOYzZ_4*X zvy5yEyAJT09;}|A$G2y1ebmHTnHPoevJpLJ$H?+@Nppf8tY2&RN;Ejjde&Z-d>IFd zF~}@XVTPI6k-$Y;`*yVk!Z0;m#I8a0J1`_1KN12wj4w!ak4DK3U-45WA&4==(d^Cr=4@_2vj->Oz-)a442td9KjDC$2fLWY*cf{B*vxpr z$)olcUv2|e-Xr7?&m$-RavL6Q8K(11M6!_Gc;$IeDLVjOS+BWL~xfuQ4jVD9-se&v>}_(sz*v0!=b(dEmP02;{F zLZmrvnBH4Kw>c=(XE1xHiNGZV98y%g6=2R7tXIk073S#JSdOlYE5LHOI^)2NQjixH zj82ftRPLb03mj6gBETTG(E)B5JC>ZwbM~-kf$lQgP3@bT~U~IJR zxOj0qcB{eAh0pf30-n>U2R8?%Q0PPx!(DdbU|E_oQ^zQ(tV8pC=x|<7(D&Z`wOm`e zIph*w-hQzhB*@Gs2t-vcry)PH`mtOB&UhT%zzsN%9VHsN+HG7;SI~Ug?LA{YM~?_b zJ;niJwmG|cqSU9k`Fl(Ol5UG0TK1}0TRwqspLVW8W@UQ>T^D#tl^H6;#n5J|dS!Y~5%E(Cg58Mjc0yhgck^d77vXF83ls9qc_& z&zHT%A?5Q}<_{He)>itk@ZHZY`|Z^Tj_j}K&aTA^WU%w;k6G;G%l!6(x68|8l$s*j z@7ZUF8*OX;YoAtSnR1CInx!3p$k$ck#nhzBEFovy>^(38h~th8@!Vu%Z6I&p`G#c} zb7jKW4`*Yd!Y#)#QOMQJ27Ktq8lGM5MMYQ}T?B&RBGu9UnTFdDjDV$$zt5D#@i={x z{xCiwgG@@8+&POqW6(R#F%r<`l7TfHf6WdZq-0(K{v|6!Exiph18F+^jHW>OpdubHCNGq&ZVG5$83@!{|0{vmT#MSNXylI2 z<`T!KO4 zo3z|u2+jb70=!gih~T04U}Z!6h=OD=YOF@sm=)?}>BNZ%=@Seqs2<-ty9M2?7|mw7 zD1qp256(vk8|k>%X)$liICF0?CatLWDCS9b9uI%gqYhV&HojATyABdS-UuF~N;lB; z!}b*c7grK^XK|g_=gi}1I;ot$u^O*$tPkN(Gh4ssh$(0{W;sxdxDCbizsstMi$vy) zx;(;iW4DbN6FQy~My-?CyOg(XQ+0f);9w;Hv8bgYTJtqYKXU``)Fk|Cq*RB;Dh_j3OuGv=d zPpj5MIM^}Ft!4i7Zaoq5hR zd840py^sS;z<6h99PtIKWLU+L?XszUrRGL$mJHp9$-7p>0ew7myR^Ism(O=ZXLHD6 zx*-?~`3r$K7TH-3fW}MFUFo51HDe90B_S9Cv zjqav*ihvf|%dJJs9;?XR&rSu+xVlETO@t%2ch)1=UhkuS(1*<{5fLqt*clR&mooqC z@r7F#+~G(d2GQ`;Pk(q}{xhGShFfoMLai(i5C+v!U~j{X%%C%483~!G8e6AW-B76$ z?9Drt%`%lEMMvkb#O8FlEW$S(KSt;vCA}D;?g0851L$n@A&ycpL^GIV*Ce&_knxis zlJ7kF#BC?Xj%VSKr7#JGPvhr&Z6bhMJ~s(_W~;Do1~*V};a3R+R7$v5^3?AyJPx}) zMy&`(dm3>b_YCxv!9k+J5M`SJ(Lysm9O@srL<2~Xwc}_A14LqoAjERUg=Bl&?8Z3A zIOzc?0zK~k&sX)SM*;x-0D;`WB$$Z-LS9B)#x0MNam*KoJ@)MHKRmk(*ZHuk75LL{pPlEN z&kMnip{TX6#+>rhl=h;7EE+g2ZUmkA5+R-@#3hK*gMbMHfcd%%fuQ1$#p!2Sx*mbx zY4;TUf^{VRJZ@Mm#!1qS6Luy6Z?V(qEI;_*_5Yadx`7z?EIj)5Tr3hi81h<3U<-+v z416AXo@jBOe$pff3q3AE2@-LMZ-CL?9^HL_Wmz6q#M~Ec4_8Zmz?ZS!2J=K4t1aUm l&N5W`?K|$cabkCS{vQSOLVu_TSX=-A002ovPDHLkV1oJ-dWrx5 literal 0 HcmV?d00001 diff --git a/assets/images/play.svg b/assets/images/play.svg new file mode 100644 index 0000000..3b5b9da --- /dev/null +++ b/assets/images/play.svg @@ -0,0 +1,62 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/lib/common_ui/resources/my_assets.dart b/lib/common_ui/resources/my_assets.dart index 9ad30c0..1080edd 100644 --- a/lib/common_ui/resources/my_assets.dart +++ b/lib/common_ui/resources/my_assets.dart @@ -33,4 +33,6 @@ class MyAssets { static const String finishedMission = 'assets/images/finished_mission.svg'; static const String currentMission = 'assets/images/current_mission.svg'; static const String location = 'assets/images/location.svg'; + static const String play = 'assets/images/play.svg'; + static const String homeButton = 'assets/images/home_button.png'; } \ No newline at end of file diff --git a/lib/core/widgets/answer_box/styles/text_box.dart b/lib/core/widgets/answer_box/styles/text_box.dart index c636cfa..85c7aa8 100644 --- a/lib/core/widgets/answer_box/styles/text_box.dart +++ b/lib/core/widgets/answer_box/styles/text_box.dart @@ -8,7 +8,7 @@ class AnswerTextBox extends StatelessWidget { @override Widget build(BuildContext context) { return ClipPath( - clipper: _WavyBannerClipper(), + clipper: WavyBannerClipper(), child: Container( padding: EdgeInsets.all(MySpaces.s10), decoration: BoxDecoration( @@ -35,7 +35,7 @@ class AnswerTextBox extends StatelessWidget { } } -class _WavyBannerClipper extends CustomClipper { +class WavyBannerClipper extends CustomClipper { @override Path getClip(Size size) { final sx = size.width / 480.0; diff --git a/lib/features/home/presentation/ui/home_page.dart b/lib/features/home/presentation/ui/home_page.dart index 9b068c4..273678a 100644 --- a/lib/features/home/presentation/ui/home_page.dart +++ b/lib/features/home/presentation/ui/home_page.dart @@ -1,10 +1,12 @@ import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart'; +import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart'; import 'package:hadi_hoda_flutter/core/utils/my_image.dart'; import 'package:hadi_hoda_flutter/core/utils/screen_size.dart'; import 'package:hadi_hoda_flutter/features/home/presentation/bloc/home_bloc.dart'; import 'package:hadi_hoda_flutter/features/home/presentation/ui/widgets/bottom_path.dart'; +import 'package:hadi_hoda_flutter/features/home/presentation/ui/widgets/hint_mission_widget.dart'; import 'package:hadi_hoda_flutter/features/home/presentation/ui/widgets/mission_widget.dart'; import 'package:hadi_hoda_flutter/features/home/presentation/ui/widgets/top_path.dart'; @@ -14,15 +16,49 @@ class HomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( - body: SingleChildScrollView( - child: Stack( - alignment: Alignment.center, - children: [ - _background(), - _topPath(context), - _bottomPath(context), - ], - ), + body: Stack( + children: [ + SingleChildScrollView( + child: Stack( + alignment: Alignment.center, + children: [ + _background(), + _topPath(context), + _bottomPath(context), + ], + ), + ), + _topButtons(context), + _hintMission(context) + ], + ), + ); + } + + Positioned _hintMission(BuildContext context) { + return Positioned( + bottom: MediaQuery.viewPaddingOf(context).bottom, + right: MySpaces.s16, + left: MySpaces.s16, + child: HintMissionWidget(), + ); + } + + Positioned _topButtons(BuildContext context) { + return Positioned( + left: MySpaces.s16, + right: MySpaces.s16, + top: MediaQuery.viewPaddingOf(context).top, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + MyImage( + image: MyAssets.homeButton, + ), + MyImage( + image: MyAssets.musicOn, + ), + ], ), ); } diff --git a/lib/features/home/presentation/ui/widgets/hint_mission_widget.dart b/lib/features/home/presentation/ui/widgets/hint_mission_widget.dart new file mode 100644 index 0000000..a78eb0f --- /dev/null +++ b/lib/features/home/presentation/ui/widgets/hint_mission_widget.dart @@ -0,0 +1,62 @@ +import 'package:flutter/material.dart'; +import 'package:google_fonts/google_fonts.dart'; +import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart'; +import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart'; +import 'package:hadi_hoda_flutter/core/utils/my_image.dart'; +import 'package:hadi_hoda_flutter/core/utils/screen_size.dart'; +import 'package:hadi_hoda_flutter/core/widgets/answer_box/styles/text_box.dart'; + +class HintMissionWidget extends StatelessWidget { + const HintMissionWidget({super.key}); + + @override + Widget build(BuildContext context) { + return ClipPath( + clipper: WavyBannerClipper(), + child: Container( + width: context.widthScreen, + padding: EdgeInsets.symmetric(horizontal: 14, vertical: 16), + decoration: BoxDecoration( + gradient: LinearGradient( + begin: Alignment.bottomCenter, + end: Alignment.topCenter, + colors: [Color(0XFFCADCFF), Color(0XFFFFFFFF)], + ), + ), + child: Row( + children: [ + Expanded( + child: Column( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.start, + spacing: MySpaces.s8, + children: [ + Text( + 'Step 3', + style: GoogleFonts.marhey( + fontSize: 14, + fontWeight: FontWeight.w700, + color: Color(0xFFD8490B), + ), + ), + Text( + 'Toothbrushing etiquette every day', + maxLines: 3, + overflow: TextOverflow.ellipsis, + style: GoogleFonts.marhey( + fontSize: 18, + fontWeight: FontWeight.w600, + color: Color(0xFF322386), + height: 1, + ), + ), + ], + ), + ), + MyImage(image: MyAssets.play, size: 70), + ], + ), + ), + ); + } +}