diff --git a/assets/images/colours/black.svg b/assets/colours/black.svg similarity index 100% rename from assets/images/colours/black.svg rename to assets/colours/black.svg diff --git a/assets/images/colours/blue.svg b/assets/colours/blue.svg similarity index 100% rename from assets/images/colours/blue.svg rename to assets/colours/blue.svg diff --git a/assets/images/colours/brown.svg b/assets/colours/brown.svg similarity index 100% rename from assets/images/colours/brown.svg rename to assets/colours/brown.svg diff --git a/assets/images/colours/colors-cover.png b/assets/colours/colours-cover.png similarity index 100% rename from assets/images/colours/colors-cover.png rename to assets/colours/colours-cover.png diff --git a/assets/images/colours/green.svg b/assets/colours/green.svg similarity index 100% rename from assets/images/colours/green.svg rename to assets/colours/green.svg diff --git a/assets/images/colours/orange.svg b/assets/colours/orange.svg similarity index 100% rename from assets/images/colours/orange.svg rename to assets/colours/orange.svg diff --git a/assets/images/colours/pink.svg b/assets/colours/pink.svg similarity index 100% rename from assets/images/colours/pink.svg rename to assets/colours/pink.svg diff --git a/assets/images/colours/red.svg b/assets/colours/red.svg similarity index 100% rename from assets/images/colours/red.svg rename to assets/colours/red.svg diff --git a/assets/images/colours/violet.svg b/assets/colours/violet.svg similarity index 100% rename from assets/images/colours/violet.svg rename to assets/colours/violet.svg diff --git a/assets/images/colours/white.svg b/assets/colours/white.svg similarity index 100% rename from assets/images/colours/white.svg rename to assets/colours/white.svg diff --git a/assets/images/colours/yellow.svg b/assets/colours/yellow.svg similarity index 100% rename from assets/images/colours/yellow.svg rename to assets/colours/yellow.svg diff --git a/lib/main.dart b/lib/main.dart index 173556d..663361e 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -12,7 +12,7 @@ import 'package:learn/pages/modules/occupation.dart'; import 'package:learn/pages/modules/parts.dart'; import 'package:learn/pages/modules/seasons.dart'; import 'package:learn/pages/modules/shapes.dart'; -import 'package:learn/pages/modules/solar.dart'; +import 'package:learn/pages/modules/planets.dart'; import 'package:learn/utils/routes.dart'; import 'package:learn/pages/modules/colours.dart'; import 'package:learn/widgets/navbar/navbar.dart'; diff --git a/lib/model/module.dart b/lib/model/module.dart new file mode 100644 index 0000000..a048047 --- /dev/null +++ b/lib/model/module.dart @@ -0,0 +1,17 @@ +import 'package:flutter/material.dart'; + +class Module { + final String name; + final String description; + final String thumbnailPath; + final MaterialPageRoute route; + Color backgroundColor; + + Module({ + required this.name, + required this.description, + required this.thumbnailPath, + required this.route, + required this.backgroundColor, + }); +} diff --git a/lib/pages/explore.dart b/lib/pages/explore.dart index e8d0b0a..9c818f2 100644 --- a/lib/pages/explore.dart +++ b/lib/pages/explore.dart @@ -1,53 +1,151 @@ +import 'dart:ui'; + import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:learn/utils/constants.dart'; +// Explore Page class ExplorePage extends StatelessWidget { const ExplorePage({super.key}); @override Widget build(BuildContext context) { - return Scaffold( - appBar: AppBar( - title: const Text('Explore'), - ), - body: ListView( - children: [ - GestureDetector( - onTap: () { - Navigator.pushNamed(context, '/quiz'); - }, - child: Container( - margin: const EdgeInsets.all(5.0), - padding: const EdgeInsets.all(8.0), - decoration: BoxDecoration( - border: Border.all(color: Colors.black, width: 1.0), - borderRadius: BorderRadius.circular(8.0), - color: Colors.blueAccent, - ), - child: Row( - children: [ - SizedBox( - width: 50, - height: 50, - child: SvgPicture.asset('assets/explore/notebook.svg'), - ), - const SizedBox(width: 28.0), - const Text( - 'Quiz', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 30.0, - fontFamily: 'Comic', - color: Colors.white, + return SafeArea( + child: CustomScrollView( + slivers: [ + SliverAppBar( + title: Padding( + padding: const EdgeInsets.fromLTRB(0, 12, 16, 4), + child: Text( + "Explore", + style: Theme.of(context) + .textTheme + .headlineLarge! + .copyWith(fontWeight: FontWeight.bold, fontSize: 30.0), + ), + ), + ), + SliverList( + delegate: SliverChildBuilderDelegate( + (context, index) { + return GestureDetector( + onTap: () => Navigator.push( + context, + AppConstants.modules[index].route, + ), + child: Container( + margin: + const EdgeInsets.symmetric(horizontal: 24, vertical: 12), + height: 200, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16), + boxShadow: [ + BoxShadow( + color: Colors.black.withOpacity(0.2), + spreadRadius: 2, + blurRadius: 5, + offset: const Offset(0, 3), + ), + ], ), + child: ClipRRect( + borderRadius: BorderRadius.circular(16), + child: Stack( + fit: StackFit.expand, + alignment: Alignment.center, + children: [ + ImageFiltered( + imageFilter: ImageFilter.blur(sigmaX: 5, sigmaY: 5), + child: Image.asset( + AppConstants.modules[index].thumbnailPath, + fit: BoxFit.cover, + ), + ), + Positioned.fill( + child: Align( + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + AppConstants.modules[index].name, + style: Theme.of(context) + .textTheme + .headlineMedium! + .copyWith( + color: Colors.white, + fontWeight: FontWeight.bold, + shadows: [ + const Shadow( + color: Colors.black, + offset: Offset(2, 1), + blurRadius: 4, + ), + ], + ), + ), + Text( + AppConstants.modules[index].description, + style: Theme.of(context) + .textTheme + .bodyMedium! + .copyWith( + color: Colors.white, + fontWeight: FontWeight.bold, + shadows: [ + const Shadow( + color: Colors.black, + offset: Offset(2, 1), + blurRadius: 2, + ), + ], + ), + ), + ], + ), + ), + ), + ], + ), + )), + ); + }, + childCount: AppConstants.modules.length, + ), + ), + GestureDetector( + onTap: () { + Navigator.pushNamed(context, '/quiz'); + }, + child: Container( + margin: const EdgeInsets.all(5.0), + padding: const EdgeInsets.all(8.0), + decoration: BoxDecoration( + border: Border.all(color: Colors.black, width: 1.0), + borderRadius: BorderRadius.circular(8.0), + color: Colors.blueAccent, + ), + child: Row( + children: [ + SizedBox( + width: 50, + height: 50, + child: SvgPicture.asset('assets/explore/notebook.svg'), + ), + const SizedBox(width: 28.0), + const Text( + 'Quiz', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 30.0, + fontFamily: 'Comic', + color: Colors.white, ), - ], - ), + ), + ], ), ), - ], - ), - ); + ), + ], + )); } } diff --git a/lib/pages/home.dart b/lib/pages/home.dart index 86b9844..7b75fc3 100644 --- a/lib/pages/home.dart +++ b/lib/pages/home.dart @@ -5,6 +5,7 @@ import 'package:learn/main.dart'; import '../utils/routes.dart'; import '../widgets/drawer.dart'; +import 'modules/animals.dart'; class MyHomePage extends StatefulWidget { const MyHomePage({Key? key}) : super(key: key); @@ -251,7 +252,7 @@ class _MyHomePageState extends State { ], image: const DecorationImage( image: AssetImage( - 'assets/images/colours/colors-cover.png'), + 'assets/colours/colours-cover.png'), fit: BoxFit.cover, ), ), diff --git a/lib/pages/modules/colours.dart b/lib/pages/modules/colours.dart index cdfcf09..b283983 100644 --- a/lib/pages/modules/colours.dart +++ b/lib/pages/modules/colours.dart @@ -27,61 +27,61 @@ class _ColoursPageState extends State { final List colours = [ Colours( name: 'Blue', - jpgAsset: 'assets/images/colours/blue.svg', + jpgAsset: 'assets/colours/blue.svg', bgColor: Colors.lightBlueAccent, fontColor: Colors.lightBlueAccent, ), Colours( name: 'Yellow', - jpgAsset: 'assets/images/colours/yellow.svg', + jpgAsset: 'assets/colours/yellow.svg', bgColor: Colors.yellow.shade600, fontColor: Colors.yellow.shade600, ), Colours( name: 'Black', - jpgAsset: 'assets/images/colours/black.svg', + jpgAsset: 'assets/colours/black.svg', bgColor: Colors.black, fontColor: Colors.black, ), Colours( name: 'Green', - jpgAsset: 'assets/images/colours/green.svg', + jpgAsset: 'assets/colours/green.svg', bgColor: Colors.green, fontColor: Colors.green, ), Colours( name: 'Pink', - jpgAsset: 'assets/images/colours/pink.svg', + jpgAsset: 'assets/colours/pink.svg', bgColor: Colors.pink.shade300, fontColor: Colors.pink.shade300, ), Colours( name: 'White', - jpgAsset: 'assets/images/colours/white.svg', + jpgAsset: 'assets/colours/white.svg', bgColor: Colors.grey.shade400, fontColor: Colors.grey.shade400, ), Colours( name: 'Red', - jpgAsset: 'assets/images/colours/red.svg', + jpgAsset: 'assets/colours/red.svg', bgColor: Colors.red, fontColor: Colors.red, ), Colours( name: 'Violet', - jpgAsset: 'assets/images/colours/violet.svg', + jpgAsset: 'assets/colours/violet.svg', bgColor: Colors.deepPurple, fontColor: Colors.deepPurple, ), Colours( name: 'Brown', - jpgAsset: 'assets/images/colours/brown.svg', + jpgAsset: 'assets/colours/brown.svg', bgColor: const Color(0xFF964B00), fontColor: const Color(0xFF964B00), ), Colours( name: 'Orange', - jpgAsset: 'assets/images/colours/orange.svg', + jpgAsset: 'assets/colours/orange.svg', bgColor: Colors.orange, fontColor: Colors.orange, ), diff --git a/lib/pages/modules/solar.dart b/lib/pages/modules/planets.dart similarity index 100% rename from lib/pages/modules/solar.dart rename to lib/pages/modules/planets.dart diff --git a/lib/utils/constants.dart b/lib/utils/constants.dart index fa33360..ea2f386 100644 --- a/lib/utils/constants.dart +++ b/lib/utils/constants.dart @@ -2,6 +2,12 @@ import 'dart:ui'; import '../explore/quiz.dart'; import 'package:flutter/material.dart'; +import 'package:learn/pages/modules/colours.dart'; +import 'package:learn/pages/modules/parts.dart'; +import 'package:learn/pages/modules/planets.dart'; +import 'package:learn/pages/modules/shapes.dart'; + +import '../model/module.dart'; import '../pages/modules/animals.dart'; import '../pages/modules/atoz.dart'; import '../pages/modules/birds.dart'; @@ -9,6 +15,57 @@ import '../pages/modules/seasons.dart'; import '../pages/modules/occupation.dart'; class AppConstants { + static List modules = [ + Module( + name: 'A-Z', + description: 'Learn A to Z with production and an example', + thumbnailPath: 'assets/images/alphabets.jpg', + route: MaterialPageRoute(builder: (context) => const AtoZ()), + backgroundColor: const Color.fromARGB(193, 76, 175, 79), + ), + Module( + name: 'Animals', + description: 'Learn about animals and their sounds', + thumbnailPath: 'assets/images/animals.jpg', + route: MaterialPageRoute(builder: (context) => AnimalsPage()), + backgroundColor: const Color.fromARGB(194, 157, 82, 222), + ), + Module( + name: 'Birds', + description: 'Look out for Birds with their sounds', + thumbnailPath: 'assets/images/birds.jpg', + route: MaterialPageRoute(builder: (context) => BirdsPage() ), + backgroundColor: const Color.fromARGB(193, 76, 207, 222), + ), + Module( + name: "Colors", + description: "Explore and Learn about the colors", + thumbnailPath: "assets/colours/colours-cover.png", + route: MaterialPageRoute(builder: (context) => const ColoursPage()), + backgroundColor: const Color.fromARGB(193, 21, 234, 28)), + Module( + name: 'Body Parts', + description: 'Know about body parts and their pronunciation.', + thumbnailPath: 'assets/body/body.jpg', + route: MaterialPageRoute(builder: (context) => const PartsPage() ), + backgroundColor: const Color.fromARGB(157, 251, 0, 0), + ), + Module( + name: 'Shapes', + description: 'Learn about shapes', + thumbnailPath: 'assets/images/shape.gif', + route: MaterialPageRoute(builder: (context) => const ShapesPage() ), + backgroundColor: const Color.fromARGB(193, 21, 234, 28), + ), + Module( + name: 'Solar System', + description: 'Learn about the solar system', + thumbnailPath: 'assets/images/solar.gif', + route: MaterialPageRoute(builder: (context) => PlanetsPage()), + backgroundColor: const Color.fromARGB(193, 226, 221, 70), + ), + ]; + static const List candidates = [ "Eye", "Lips", diff --git a/lib/utils/routes.dart b/lib/utils/routes.dart index 0a14c2c..75fedb3 100644 --- a/lib/utils/routes.dart +++ b/lib/utils/routes.dart @@ -1,18 +1,18 @@ class AllRoutes { - static String loginRoute = "/login"; - static String homeRoute = "/home"; - static String exploreRoute = "/explore"; - static String favoriteRoute = "/favorite"; - static String animalRoute = "/animals"; - static String birdsRoute = "/birds"; - static String shapesRoute = "/shapes"; - static String partsRoute = "/parts"; - static String solarRoute = "/solar"; - static String atozRoute = "/atoz"; - static String aboutRoute = "/about"; - static String colourRoute = "/colours"; - static String flowerRoute = "/flowers"; - static String quizRoute = "/quiz"; - static String seasonRoute = "/seasons"; - static String occupationRoute = '/occupations'; + static const String loginRoute = "/login"; + static const String homeRoute = "/home"; + static const String exploreRoute = "/explore"; + static const String favoriteRoute = "/favorite"; + static const String animalRoute = "/animals"; + static const String birdsRoute = "/birds"; + static const String shapesRoute = "/shapes"; + static const String partsRoute = "/parts"; + static const String solarRoute = "/solar"; + static const String atozRoute = "/atoz"; + static const String aboutRoute = "/about"; + static const String colourRoute = "/colours"; + static const String flowerRoute = "/flowers"; + static const String quizRoute = "/quiz"; + static const String seasonRoute = "/seasons"; + static const String occupationRoute = '/occupations'; } diff --git a/pubspec.yaml b/pubspec.yaml index 934ec28..bff1c94 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -75,7 +75,6 @@ flutter: - assets/body/ - assets/birds/ - assets/solar/ - - assets/images/colours/ - assets/images/flowers/ - assets/explore/ - assets/seasons/