diff --git a/assets/images/home_button.png b/assets/images/home_button.png new file mode 100644 index 0000000..6044958 Binary files /dev/null and b/assets/images/home_button.png differ 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), + ], + ), + ), + ); + } +}