diff --git a/assets/images/dialog.svg b/assets/images/dialog.svg deleted file mode 100644 index 0b761e0..0000000 --- a/assets/images/dialog.svg +++ /dev/null @@ -1,14 +0,0 @@ - - - - - - - - - - - - - - diff --git a/assets/images/khadije_logo.png b/assets/images/khadije_logo.png new file mode 100644 index 0000000..6084c38 Binary files /dev/null and b/assets/images/khadije_logo.png differ diff --git a/assets/images/language.svg b/assets/images/language.svg new file mode 100644 index 0000000..807ba35 --- /dev/null +++ b/assets/images/language.svg @@ -0,0 +1,66 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/music_off.svg b/assets/images/music_off.svg index 6c8ad5e..a8f7e90 100644 --- a/assets/images/music_off.svg +++ b/assets/images/music_off.svg @@ -1,32 +1,20 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + - - - - - - - - - - - + @@ -34,40 +22,44 @@ - + - + - - + + - - - + + + - - - + + + - - - + + + + + + + + + + + - - - - - - + + + + + - - - diff --git a/assets/images/music_on.svg b/assets/images/music_on.svg index c53351d..3beefd9 100644 --- a/assets/images/music_on.svg +++ b/assets/images/music_on.svg @@ -1,60 +1,57 @@ - - - - - - - - - - - - + + + + + + + + + + + + - - - - - - - - - - - + - - + + - - + + - - - + + + - - - + + + + + + + - - - + + + + + + + - - - - - - + + + + + - - + + diff --git a/assets/images/new_horizon.svg b/assets/images/new_horizon.svg new file mode 100644 index 0000000..c757060 --- /dev/null +++ b/assets/images/new_horizon.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/theme.svg b/assets/images/theme.svg index 93f83cf..dc27d27 100644 --- a/assets/images/theme.svg +++ b/assets/images/theme.svg @@ -1,51 +1,51 @@ - - - - + + + + - - - - - - - + + + + + + + - + - - + + - - + + - + - - + + - + - + - + - + - + @@ -53,8 +53,8 @@ - - + + diff --git a/lib/common_ui/resources/my_assets.dart b/lib/common_ui/resources/my_assets.dart index 1c8d553..8fc0a00 100644 --- a/lib/common_ui/resources/my_assets.dart +++ b/lib/common_ui/resources/my_assets.dart @@ -5,7 +5,6 @@ class MyAssets { static const String backgroundIntro = 'assets/images/background_intro.png'; static const String closeBtn = 'assets/images/close_btn.svg'; - static const String dialog = 'assets/images/dialog.svg'; static const String hadiHoda = 'assets/images/hadi_hoda.png'; static const String musicOff = 'assets/images/music_off.svg'; static const String musicOn = 'assets/images/music_on.svg'; @@ -15,4 +14,7 @@ class MyAssets { static const String whatsapp = 'assets/images/whatsapp.svg'; static const String youtube = 'assets/images/youtube.svg'; static const String instagram = 'assets/images/instagram.svg'; + static const String language = 'assets/images/language.svg'; + static const String newHorizon = 'assets/images/new_horizon.svg'; + static const String khadijeLogo = 'assets/images/khadije_logo.png'; } \ No newline at end of file diff --git a/lib/core/routers/my_routes.dart b/lib/core/routers/my_routes.dart index 63a185b..f6b6730 100644 --- a/lib/core/routers/my_routes.dart +++ b/lib/core/routers/my_routes.dart @@ -7,9 +7,7 @@ import 'package:hadi_hoda_flutter/init_bindings.dart'; class Routes { static const Routes _i = Routes._internal(); - const Routes._internal(); - factory Routes() => _i; static const String introPage = '/intro_page'; diff --git a/lib/core/widgets/about_us_dialog.dart b/lib/core/widgets/about_us_dialog/about_us_dialog.dart similarity index 62% rename from lib/core/widgets/about_us_dialog.dart rename to lib/core/widgets/about_us_dialog/about_us_dialog.dart index ebdb6dc..66966b0 100644 --- a/lib/core/widgets/about_us_dialog.dart +++ b/lib/core/widgets/about_us_dialog/about_us_dialog.dart @@ -1,14 +1,13 @@ import 'dart:ui'; import 'package:flutter/material.dart'; +import 'package:go_router/go_router.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/common_ui/theme/my_theme.dart'; -import 'package:hadi_hoda_flutter/core/utils/gap.dart'; import 'package:hadi_hoda_flutter/core/utils/my_image.dart'; import 'package:hadi_hoda_flutter/core/utils/my_localization.dart'; -import 'package:hadi_hoda_flutter/core/utils/screen_size.dart'; +import 'package:hadi_hoda_flutter/core/widgets/about_us_dialog/styles/background.dart'; Future showAboutUsDialog({required BuildContext context}) async { await showDialog( @@ -29,34 +28,14 @@ class AboutUsDialog extends StatelessWidget { body: BackdropFilter( filter: ImageFilter.blur(sigmaX: 6, sigmaY: 6), child: Center( - child: SizedBox( - height: context.widthScreen, - width: context.widthScreen - 20, + child: Padding( + padding: const EdgeInsets.symmetric(horizontal: 18), child: Stack( - alignment: AlignmentDirectional.center, clipBehavior: Clip.none, children: [ - MyImage(image: MyAssets.dialog), - Positioned( - top: 10, - right: 30, - child: GestureDetector( - onTap: () { - Navigator.pop(context); - }, - child: MyImage(image: MyAssets.closeBtn, size: 40), - ), - ), - Padding( - padding: EdgeInsets.only( - top: 50, - left: 35, - right: 35, - bottom: 60, - ), + AboutUSDialogBackground( child: Column( - mainAxisSize: MainAxisSize.max, - mainAxisAlignment: MainAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( context.translate.about_us, @@ -66,32 +45,42 @@ class AboutUsDialog extends StatelessWidget { fontWeight: FontWeight.w600, ), ), - MySpaces.s14.gapHeight, - Expanded( - child: SingleChildScrollView( - child: Text( - context.translate.about_us_desc, - style: GoogleFonts.marhey( - color: Color(0XFF322386), - fontSize: 15, - fontWeight: FontWeight.w500, - ), - ), + Text( + context.translate.about_us_desc, + style: GoogleFonts.marhey( + color: Color(0XFF494178), + fontSize: 16, + fontWeight: FontWeight.w500, ), ), + MyImage( + image: MyAssets.newHorizon, + ), + MyImage( + image: MyAssets.khadijeLogo, + ), Row( mainAxisAlignment: MainAxisAlignment.center, spacing: 20, children: [ - MyImage(image: MyAssets.facebook, size: 40), - MyImage(image: MyAssets.instagram, size: 40), - MyImage(image: MyAssets.whatsapp, size: 40), - MyImage(image: MyAssets.youtube, size: 40), + MyImage(image: MyAssets.facebook, size: 33), + MyImage(image: MyAssets.instagram, size: 33), + MyImage(image: MyAssets.whatsapp, size: 33), + MyImage(image: MyAssets.youtube, size: 33), ], ), ], ), ), + Positioned( + right: 30, + top: -12, + child: GestureDetector( + onTap: context.pop, + behavior: HitTestBehavior.opaque, + child: MyImage(image: MyAssets.closeBtn, size: 40), + ), + ), ], ), ), diff --git a/lib/core/widgets/about_us_dialog/styles/background.dart b/lib/core/widgets/about_us_dialog/styles/background.dart new file mode 100644 index 0000000..cb434cf --- /dev/null +++ b/lib/core/widgets/about_us_dialog/styles/background.dart @@ -0,0 +1,80 @@ +import 'package:flutter/material.dart'; +import 'package:hadi_hoda_flutter/core/utils/screen_size.dart'; + +class AboutUSDialogBackground extends StatelessWidget { + const AboutUSDialogBackground({super.key, this.child}); + + final Widget? child; + + @override + Widget build(BuildContext context) { + return ClipPath( + clipper: _BottomShapeClipper(), + child: Container( + width: context.widthScreen, + height: 525, + padding: EdgeInsets.all(30), + decoration: const BoxDecoration( + gradient: LinearGradient( + begin: Alignment.bottomCenter, + end: Alignment.topCenter, + colors: [ + Color(0xFFCADCFF), + Colors.white, + Colors.white, + Colors.white, + ], + ), + ), + child: child, + ), + ); + } +} + +class _BottomShapeClipper extends CustomClipper { + @override + Path getClip(Size size) { + final path = Path(); + path.moveTo(size.width * 0.0296831, size.height * 0.0431190); + path.cubicTo( + size.width * -0.0046256, + size.height * 0.0736941, + size.width * -0.0099023, + size.height * 0.932004, + size.width * 0.0201127, + size.height * 0.971318, + ); + path.cubicTo( + size.width * 0.0476063, + size.height * 1.00783, + size.width * 0.908328, + size.height * 1.01074, + size.width * 0.962267, + size.height * 0.972775, + ); + path.cubicTo( + size.width * 1.01620, + size.height * 0.934810, + size.width * 1.00525, + size.height * 0.0573423, + size.width * 0.955130, + size.height * 0.0222874, + ); + path.cubicTo( + size.width * 0.905007, + size.height * -0.0127694, + size.width * 0.0857731, + size.height * -0.0135838, + size.width * 0.0296831, + size.height * 0.0431190, + ); + path.close(); + return path; + } + + @override + bool shouldReclip(CustomClipper oldClipper) { + return true; + } +} diff --git a/lib/features/intro/presentation/ui/intro_page.dart b/lib/features/intro/presentation/ui/intro_page.dart index d2b6954..bd96a4d 100644 --- a/lib/features/intro/presentation/ui/intro_page.dart +++ b/lib/features/intro/presentation/ui/intro_page.dart @@ -3,7 +3,7 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart'; import 'package:hadi_hoda_flutter/common_ui/theme/my_theme.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/about_us_dialog.dart'; +import 'package:hadi_hoda_flutter/core/widgets/about_us_dialog/about_us_dialog.dart'; class IntroPage extends StatelessWidget { const IntroPage({super.key}); @@ -26,6 +26,7 @@ class IntroPage extends StatelessWidget { child: Stack( alignment: Alignment.center, children: [ + _music(), _name(), _bottomBtns(context), ], @@ -35,12 +36,23 @@ class IntroPage extends StatelessWidget { ); } + Positioned _music() { + return Positioned( + top: 36, + right: 16, + child: MyImage( + image: MyAssets.musicOn, + ), + ); + } + + Positioned _name() { return Positioned( - top: 130, + top: 146, child: MyImage( image: MyAssets.hadiHoda, - size: 220, + size: 232, fit: BoxFit.cover, ), ); @@ -48,20 +60,20 @@ class IntroPage extends StatelessWidget { Positioned _bottomBtns(BuildContext context) { return Positioned( - bottom: 20, - left: 20, - right: 20, + bottom: 40, + left: 16, + right: 16, child: Row( crossAxisAlignment: CrossAxisAlignment.end, mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - MyImage(image: MyAssets.musicOn, size: 60), - InkWell(child: MyImage(image: MyAssets.start, size: 80), + MyImage(image: MyAssets.language), + InkWell(child: MyImage(image: MyAssets.start, size: 90), onTap: () { showAboutUsDialog(context: context); }, ), - MyImage(image: MyAssets.theme, size: 60), + MyImage(image: MyAssets.theme), ], ), ); diff --git a/lib/l10n/app_en.arb b/lib/l10n/app_en.arb index 9e22152..41f04cd 100644 --- a/lib/l10n/app_en.arb +++ b/lib/l10n/app_en.arb @@ -1,4 +1,4 @@ { "about_us": "About us", - "about_us_desc" : "Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build award-winning interactive experiences across apps, games, websites, products, and vehicles." + "about_us_desc" : "Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build." } \ No newline at end of file diff --git a/lib/l10n/app_localizations.dart b/lib/l10n/app_localizations.dart index 76fe3e1..b1de57e 100644 --- a/lib/l10n/app_localizations.dart +++ b/lib/l10n/app_localizations.dart @@ -103,7 +103,7 @@ abstract class AppLocalizations { /// No description provided for @about_us_desc. /// /// In en, this message translates to: - /// **'Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build award-winning interactive experiences across apps, games, websites, products, and vehicles.'** + /// **'Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build.'** String get about_us_desc; } diff --git a/lib/l10n/app_localizations_en.dart b/lib/l10n/app_localizations_en.dart index eee0965..6967cb9 100644 --- a/lib/l10n/app_localizations_en.dart +++ b/lib/l10n/app_localizations_en.dart @@ -13,5 +13,5 @@ class AppLocalizationsEn extends AppLocalizations { @override String get about_us_desc => - 'Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build award-winning interactive experiences across apps, games, websites, products, and vehicles.'; + 'Rive combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. \nThis end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build.'; }