diff --git a/assets/images/world_map.png b/assets/images/world_map.png new file mode 100644 index 0000000..57d19d7 Binary files /dev/null and b/assets/images/world_map.png differ diff --git a/assets/svg/magnifier.svg b/assets/svg/magnifier.svg new file mode 100644 index 0000000..0d6cfc7 --- /dev/null +++ b/assets/svg/magnifier.svg @@ -0,0 +1,99 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/lib/common_ui/resources/my_assets.dart b/lib/common_ui/resources/my_assets.dart index 41d9662..8c30640 100644 --- a/lib/common_ui/resources/my_assets.dart +++ b/lib/common_ui/resources/my_assets.dart @@ -30,6 +30,7 @@ class MyAssets { static const String member3 = 'assets/images/member_3.png'; static const String member4 = 'assets/images/member_4.png'; static const String done = 'assets/images/done.png'; + static const String worldMap = 'assets/images/world_map.png'; /// ----- Svg ----- static const String iconHome = 'assets/svg/icon_home.svg'; @@ -64,6 +65,7 @@ class MyAssets { static const String micBLur = 'assets/svg/mic_blur.svg'; static const String iconArt = 'assets/svg/icon_art.svg'; static const String iconRandom = 'assets/svg/icon_random.svg'; + static const String magnifier = 'assets/svg/magnifier.svg'; /// ----- Audios ----- static const String sampleAudio = 'assets/audios/sample.mp3'; @@ -98,5 +100,6 @@ class MyAssets { member3, member4, done, + worldMap, ]; } diff --git a/lib/common_ui/theme/my_theme.dart b/lib/common_ui/theme/my_theme.dart index 7b1a386..ee0796a 100644 --- a/lib/common_ui/theme/my_theme.dart +++ b/lib/common_ui/theme/my_theme.dart @@ -14,9 +14,9 @@ class MyTheme { const MyTheme._internal(); factory MyTheme() => _i; - static final ThemeData light = ThemeData(brightness: Brightness.dark); + static final ThemeData light = ThemeData(brightness: Brightness.light); - static final ThemeData dark = ThemeData(brightness: Brightness.light); + static final ThemeData dark = ThemeData(brightness: Brightness.dark); static Map get lightColors => { ColorsName.primaryColor: MyColors.white, diff --git a/lib/features/battle_league/presentation/ui/battle_find_page.dart b/lib/features/battle_league/presentation/ui/battle_find_page.dart new file mode 100644 index 0000000..6a4f3a9 --- /dev/null +++ b/lib/features/battle_league/presentation/ui/battle_find_page.dart @@ -0,0 +1,140 @@ +import 'package:flutter/material.dart'; +import 'package:get/get.dart'; +import 'package:shia_game_flutter/common_ui/resources/my_assets.dart'; +import 'package:shia_game_flutter/common_ui/resources/my_colors.dart'; +import 'package:shia_game_flutter/common_ui/resources/my_text_style.dart'; +import 'package:shia_game_flutter/core/utils/gap.dart'; +import 'package:shia_game_flutter/core/utils/my_localization.dart'; +import 'package:shia_game_flutter/core/utils/screen_size.dart'; +import 'package:shia_game_flutter/core/widgets/container/my_container.dart'; +import 'package:shia_game_flutter/core/widgets/image/my_image.dart'; +import 'package:shia_game_flutter/core/widgets/text/gradient_text.dart'; +import 'package:shia_game_flutter/features/battle_league/presentation/controller/battle_league_controller.dart'; + +class BattleFindPage extends GetView { + const BattleFindPage({super.key}); + + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: MyColors.battleLeagueBackgroundColor, + body: SafeArea( + child: Padding( + padding: const EdgeInsets.symmetric(horizontal: 30), + child: Column( + children: [ + 20.h.gapHeight, + _rankTitle(context), + const Spacer(), + _findingImage(context), + const Spacer(), + _description(context), + 37.h.gapHeight, + const BattlePurpleButton(), + ], + ), + ), + ), + ); + } + + Container _rankTitle(BuildContext context) { + return Container( + height: 42.h, + width: context.widthScreen, + alignment: Alignment.center, + padding: const EdgeInsets.symmetric(horizontal: 17), + decoration: const ShapeDecoration( + shape: StadiumBorder(), + color: Color(0XFF2E0869), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Expanded( + child: FittedBox( + child: Text( + '${context.translate.quiz_league} (june) | ${context.translate.your_place} (1,569)', + textAlign: TextAlign.center, + maxLines: 1, + style: Lexend.semiBold.copyWith(fontSize: 12.sp), + ), + ), + ), + 15.w.gapWidth, + const MyImage(asset: MyAssets.iconRank), + 4.w.gapWidth, + Text('265', style: Lexend.bold.copyWith(fontSize: 12.sp)), + ], + ), + ); + } + + Widget _findingImage(BuildContext context) { + return Stack( + alignment: Alignment.center, + children: [ + const MyImage(asset: MyAssets.worldMap), + const MyImage(asset: MyAssets.magnifier), + Positioned( + bottom: 0, + child: Text( + context.translate.finding_player, + style: Lexend.semiBold.copyWith(fontSize: 20.sp), + ), + ), + ], + ); + } + + Column _description(BuildContext context) { + return Column( + children: [ + Text('،،', style: Lexend.black.copyWith(fontSize: 84.sp, height: 1)), + Text( + context.translate.find_hint, + textAlign: TextAlign.center, + style: Lexend.regular.copyWith( + fontSize: 14.sp, + color: const Color(0XFFC9B7E8), + ), + ), + ], + ); + } +} + +class BattlePurpleButton extends StatelessWidget { + const BattlePurpleButton({super.key}); + + @override + Widget build(BuildContext context) { + return MyContainer( + onTap: () {}, + width: context.widthScreen, + height: 64.h, + borderRadius: const BorderRadius.all(Radius.circular(20)), + borderGradient: LinearGradient( + begin: AlignmentDirectional.topStart, + end: AlignmentDirectional.bottomEnd, + colors: [ + const Color(0XFF7F4CD4), + const Color(0XFF7F4CD4).withValues(alpha: 0), + ], + ), + gradient: const RadialGradient( + radius: 5, + center: Alignment(-0.5, 0), + colors: [Color(0xFF6A36BF), Color(0xFF562A9E)], + ), + child: GradientText( + text: context.translate.stop_finding, + fontSize: 22.sp, + color: const Color(0xFFE1E1E1), + offset: const Offset(0, 1.04), + blurRadius: 1.9, + shadowColor: const Color(0xFF898989), + ), + ); + } +} diff --git a/lib/features/topic/presentation/ui/topic_page.dart b/lib/features/topic/presentation/ui/topic_page.dart index 1fc7a4b..e934dd7 100644 --- a/lib/features/topic/presentation/ui/topic_page.dart +++ b/lib/features/topic/presentation/ui/topic_page.dart @@ -102,9 +102,9 @@ class TopicPage extends GetView { } Widget _startButton(BuildContext context) { - return const Padding( - padding: EdgeInsets.symmetric(horizontal: 30), - child: BattleLeagueStartButton(title: 'Start Finding'), + return Padding( + padding: const EdgeInsets.symmetric(horizontal: 30), + child: BattleLeagueStartButton(title: context.translate.start_finding), ); } } diff --git a/lib/l10n/app_en.arb b/lib/l10n/app_en.arb index 1637a54..13ea525 100644 --- a/lib/l10n/app_en.arb +++ b/lib/l10n/app_en.arb @@ -43,5 +43,11 @@ "or": "or", "random": "Random", "selection_option": "selection option", - "art": "Art" + "art": "Art", + "start_finding": "Start Finding", + "stop_finding": "Stop Finding", + "quiz_league": "Quiz league", + "your_place": "Your place", + "finding_player": "Finding player ...", + "find_hint": "The fastest player to answer the question correctly gets the point." } \ No newline at end of file diff --git a/lib/l10n/app_localizations.dart b/lib/l10n/app_localizations.dart index 221c12e..ae41b97 100644 --- a/lib/l10n/app_localizations.dart +++ b/lib/l10n/app_localizations.dart @@ -357,6 +357,42 @@ abstract class AppLocalizations { /// In en, this message translates to: /// **'Art'** String get art; + + /// No description provided for @start_finding. + /// + /// In en, this message translates to: + /// **'Start Finding'** + String get start_finding; + + /// No description provided for @stop_finding. + /// + /// In en, this message translates to: + /// **'Stop Finding'** + String get stop_finding; + + /// No description provided for @quiz_league. + /// + /// In en, this message translates to: + /// **'Quiz league'** + String get quiz_league; + + /// No description provided for @your_place. + /// + /// In en, this message translates to: + /// **'Your place'** + String get your_place; + + /// No description provided for @finding_player. + /// + /// In en, this message translates to: + /// **'Finding player ...'** + String get finding_player; + + /// No description provided for @find_hint. + /// + /// In en, this message translates to: + /// **'The fastest player to answer the question correctly gets the point.'** + String get find_hint; } class _AppLocalizationsDelegate diff --git a/lib/l10n/app_localizations_en.dart b/lib/l10n/app_localizations_en.dart index d318215..6af744c 100644 --- a/lib/l10n/app_localizations_en.dart +++ b/lib/l10n/app_localizations_en.dart @@ -139,4 +139,23 @@ class AppLocalizationsEn extends AppLocalizations { @override String get art => 'Art'; + + @override + String get start_finding => 'Start Finding'; + + @override + String get stop_finding => 'Stop Finding'; + + @override + String get quiz_league => 'Quiz league'; + + @override + String get your_place => 'Your place'; + + @override + String get finding_player => 'Finding player ...'; + + @override + String get find_hint => + 'The fastest player to answer the question correctly gets the point.'; }