From d6c41002d77eea8c79b73e1a730f0e42fdf46eee Mon Sep 17 00:00:00 2001 From: Atuoha Date: Fri, 7 Oct 2022 05:49:39 +0100 Subject: [PATCH] task: product details --- ...k_gridview.dart => category_gridview.dart} | 4 +- ...lder.dart => products_stream_builder.dart} | 6 +- lib/views/main/categories/children.dart | 4 +- lib/views/main/categories/men.dart | 4 +- lib/views/main/categories/other.dart | 4 +- lib/views/main/categories/sneakers.dart | 4 +- lib/views/main/categories/women.dart | 4 +- lib/views/main/product/details.dart | 154 +++++++++++++++--- .../main/product_categories/children.dart | 4 +- lib/views/main/product_categories/men.dart | 4 +- lib/views/main/product_categories/others.dart | 4 +- .../main/product_categories/sneakers.dart | 4 +- lib/views/main/product_categories/women.dart | 4 +- pubspec.lock | 7 + pubspec.yaml | 1 + 15 files changed, 160 insertions(+), 52 deletions(-) rename lib/utilities/{k_gridview.dart => category_gridview.dart} (96%) rename lib/utilities/{k_stream_builder.dart => products_stream_builder.dart} (97%) diff --git a/lib/utilities/k_gridview.dart b/lib/utilities/category_gridview.dart similarity index 96% rename from lib/utilities/k_gridview.dart rename to lib/utilities/category_gridview.dart index b5ebd72..78c92e6 100644 --- a/lib/utilities/k_gridview.dart +++ b/lib/utilities/category_gridview.dart @@ -2,8 +2,8 @@ import 'package:flutter/material.dart'; import '../constants/colors.dart'; import '../views/main/sub_category/sub_category.dart'; -class KGridView extends StatelessWidget { - const KGridView({ +class CategoryGridView extends StatelessWidget { + const CategoryGridView({ Key? key, required this.categories, required this.category, diff --git a/lib/utilities/k_stream_builder.dart b/lib/utilities/products_stream_builder.dart similarity index 97% rename from lib/utilities/k_stream_builder.dart rename to lib/utilities/products_stream_builder.dart index e23b01d..ee7cda5 100644 --- a/lib/utilities/k_stream_builder.dart +++ b/lib/utilities/products_stream_builder.dart @@ -4,8 +4,8 @@ import 'package:multivendor_shop/views/main/product/details.dart'; import '../components/loading.dart'; import '../constants/colors.dart'; -class KStreamBuilder extends StatelessWidget { - const KStreamBuilder({ +class ProductStreamBuilder extends StatelessWidget { + const ProductStreamBuilder({ Key? key, required this.productStream, }) : super(key: key); @@ -80,7 +80,7 @@ class KStreamBuilder extends StatelessWidget { onTap: () => Navigator.of(context).push( MaterialPageRoute( builder: (context) => DetailsScreen( - productId: data.id, + product: data, ), ), ), diff --git a/lib/views/main/categories/children.dart b/lib/views/main/categories/children.dart index c6057c1..154696f 100644 --- a/lib/views/main/categories/children.dart +++ b/lib/views/main/categories/children.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import '../../../utilities/k_gridview.dart'; +import '../../../utilities/category_gridview.dart'; class ChildrenCategories extends StatelessWidget { const ChildrenCategories({Key? key}) : super(key: key); @@ -35,7 +35,7 @@ class ChildrenCategories extends StatelessWidget { const SizedBox(height: 10), SizedBox( height: size.height * 0.73, - child: KGridView( + child: CategoryGridView( categories: categories, category: category, imageLocation: imageLocation, diff --git a/lib/views/main/categories/men.dart b/lib/views/main/categories/men.dart index e4b7660..9050da7 100644 --- a/lib/views/main/categories/men.dart +++ b/lib/views/main/categories/men.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import '../../../utilities/k_gridview.dart'; +import '../../../utilities/category_gridview.dart'; class MenCategories extends StatelessWidget { const MenCategories({Key? key}) : super(key: key); @@ -36,7 +36,7 @@ class MenCategories extends StatelessWidget { const SizedBox(height: 10), SizedBox( height: size.height * 0.73, - child: KGridView( + child: CategoryGridView( categories: categories, category: category, imageLocation: imageLocation, diff --git a/lib/views/main/categories/other.dart b/lib/views/main/categories/other.dart index caf044f..17990c8 100644 --- a/lib/views/main/categories/other.dart +++ b/lib/views/main/categories/other.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import '../../../utilities/k_gridview.dart'; +import '../../../utilities/category_gridview.dart'; class OtherCategories extends StatelessWidget { const OtherCategories({Key? key}) : super(key: key); @@ -34,7 +34,7 @@ class OtherCategories extends StatelessWidget { const SizedBox(height: 10), SizedBox( height: size.height * 0.73, - child: KGridView( + child: CategoryGridView( categories: categories, category: category, imageLocation: imageLocation, diff --git a/lib/views/main/categories/sneakers.dart b/lib/views/main/categories/sneakers.dart index b878943..d944388 100644 --- a/lib/views/main/categories/sneakers.dart +++ b/lib/views/main/categories/sneakers.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import '../../../utilities/k_gridview.dart'; +import '../../../utilities/category_gridview.dart'; class SneakersCategories extends StatelessWidget { const SneakersCategories({Key? key}) : super(key: key); @@ -32,7 +32,7 @@ class SneakersCategories extends StatelessWidget { const SizedBox(height: 10), SizedBox( height: size.height * 0.73, - child: KGridView( + child: CategoryGridView( categories: categories, category: category, imageLocation: imageLocation, diff --git a/lib/views/main/categories/women.dart b/lib/views/main/categories/women.dart index 16d8458..eec23ff 100644 --- a/lib/views/main/categories/women.dart +++ b/lib/views/main/categories/women.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import '../../../utilities/k_gridview.dart'; +import '../../../utilities/category_gridview.dart'; class WomenCategories extends StatelessWidget { const WomenCategories({Key? key}) : super(key: key); @@ -35,7 +35,7 @@ class WomenCategories extends StatelessWidget { const SizedBox(height: 10), SizedBox( height: size.height * 0.73, - child: KGridView( + child: CategoryGridView( categories: categories, category: category, imageLocation: imageLocation, diff --git a/lib/views/main/product/details.dart b/lib/views/main/product/details.dart index b9f7786..3bb03c8 100644 --- a/lib/views/main/product/details.dart +++ b/lib/views/main/product/details.dart @@ -1,46 +1,33 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; +import 'package:multivendor_shop/components/loading.dart'; import '../../../constants/colors.dart'; +import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart'; class DetailsScreen extends StatefulWidget { const DetailsScreen({ Key? key, - required this.productId, + required this.product, }) : super(key: key); - final String productId; + final dynamic product; @override State createState() => _DetailsScreenState(); } class _DetailsScreenState extends State { - var firebase = FirebaseFirestore.instance; - var isInit = true; - var isLoading = true; - var productDetails; - - _fetchDetails() { - var details = firebase.collection('products').doc(widget.productId).get(); + // toggle isFav + void toggleIsFav(bool status, var id) { + final db = FirebaseFirestore.instance.collection('products').doc(id); setState(() { - productDetails = details; - isLoading = false; - isInit = false; + db.update({'isFav': !status}); }); } - @override - void initState() { - super.initState(); - } - - @override - void didChangeDependencies() { - if (isInit) { - _fetchDetails(); - } - - super.didChangeDependencies(); + // add to cart + void addToCart() { + // TODO: Implement add to cart } @override @@ -55,13 +42,126 @@ class _DetailsScreenState extends State { statusBarBrightness: Brightness.dark, ), ); + + var product = widget.product; return Scaffold( + floatingActionButton: FloatingActionButton.extended( + elevation: 4, + backgroundColor: primaryColor, + onPressed: () => addToCart(), + label: const Text( + 'Add to cart', + style: TextStyle( + color: Colors.white, + ), + ), + icon: const Icon( + Icons.shopping_cart_outlined, + color: Colors.white, + ), + ), + extendBodyBehindAppBar: true, + appBar: AppBar( + elevation: 0, + backgroundColor: Colors.transparent, + automaticallyImplyLeading: false, + leading: Builder( + builder: (context) { + return GestureDetector( + onTap: () => Navigator.of(context).pop(), + child: const Icon( + Icons.chevron_left, + color: primaryColor, + size: 35, + ), + ); + }, + ), + actions: [ + GestureDetector( + onTap: () => toggleIsFav(product['isFav'], product.id), + child: Padding( + padding: const EdgeInsets.only(right: 18.0), + child: Icon( + product['isFav'] ? Icons.favorite : Icons.favorite_border, + color: Colors.redAccent, + size: 35, + ), + ), + ), + ], + ), body: Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( - height: size.height / 3, - color:primaryColor, - ) + height: size.height / 2, + decoration: const BoxDecoration( + borderRadius: BorderRadius.only( + bottomRight: Radius.circular(20), + bottomLeft: Radius.circular(20), + ), + ), + child: Swiper( + autoplay: true, + pagination: const SwiperPagination( + builder: SwiperPagination.dots, + ), + itemCount: product['images'].length, + itemBuilder: (context, index) => Image.network( + product['images'][index], + fit: BoxFit.cover, + ), + ), + ), + const SizedBox(height: 20), + Padding( + padding: const EdgeInsets.symmetric(horizontal: 18.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + product['title'], + style: const TextStyle( + fontSize: 30, + fontWeight: FontWeight.w600, + ), + ), + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + RichText( + text: TextSpan( + text: 'Category: ', + style: const TextStyle(color: Colors.black), + children: [ + TextSpan( + text: product['category'], + style: const TextStyle( + fontWeight: FontWeight.w500, + ), + ), + ], + ), + ), + Text('${product['quantity']} available') + ], + ), + const SizedBox(height: 10), + Text( + '\$${product['price']}', + style: const TextStyle( + fontSize: 25, + ), + ), + const SizedBox(height: 10), + Text( + product['description'], + textAlign: TextAlign.justify, + ) + ], + ), + ), ], ), ); diff --git a/lib/views/main/product_categories/children.dart b/lib/views/main/product_categories/children.dart index 5a67850..18f11fc 100644 --- a/lib/views/main/product_categories/children.dart +++ b/lib/views/main/product_categories/children.dart @@ -1,6 +1,6 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; -import '../../../../utilities/k_stream_builder.dart'; +import '../../../../utilities/products_stream_builder.dart'; class ChildrenWears extends StatelessWidget { const ChildrenWears({Key? key}) : super(key: key); @@ -19,7 +19,7 @@ class ChildrenWears extends StatelessWidget { children: [ SizedBox( height: size.height / 1.5, - child: KStreamBuilder( + child: ProductStreamBuilder( productStream: productStream, ), ) diff --git a/lib/views/main/product_categories/men.dart b/lib/views/main/product_categories/men.dart index 4000420..31fe810 100644 --- a/lib/views/main/product_categories/men.dart +++ b/lib/views/main/product_categories/men.dart @@ -1,6 +1,6 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; -import '../../../../utilities/k_stream_builder.dart'; +import '../../../../utilities/products_stream_builder.dart'; class MenWears extends StatelessWidget { const MenWears({Key? key}) : super(key: key); @@ -19,7 +19,7 @@ class MenWears extends StatelessWidget { children: [ SizedBox( height: size.height / 1.5, - child: KStreamBuilder( + child: ProductStreamBuilder( productStream: productStream, ), ) diff --git a/lib/views/main/product_categories/others.dart b/lib/views/main/product_categories/others.dart index 9c68f63..8577e2e 100644 --- a/lib/views/main/product_categories/others.dart +++ b/lib/views/main/product_categories/others.dart @@ -2,7 +2,7 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; import '../../../../components/loading.dart'; import '../../../../constants/colors.dart'; -import '../../../../utilities/k_stream_builder.dart'; +import '../../../../utilities/products_stream_builder.dart'; class Others extends StatelessWidget { const Others({Key? key}) : super(key: key); @@ -21,7 +21,7 @@ class Others extends StatelessWidget { children: [ SizedBox( height: size.height / 1.5, - child: KStreamBuilder( + child: ProductStreamBuilder( productStream: productStream, ), ) diff --git a/lib/views/main/product_categories/sneakers.dart b/lib/views/main/product_categories/sneakers.dart index 5265073..7b413cf 100644 --- a/lib/views/main/product_categories/sneakers.dart +++ b/lib/views/main/product_categories/sneakers.dart @@ -2,7 +2,7 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; import '../../../../components/loading.dart'; import '../../../../constants/colors.dart'; -import '../../../../utilities/k_stream_builder.dart'; +import '../../../../utilities/products_stream_builder.dart'; class Sneakers extends StatelessWidget { const Sneakers({Key? key}) : super(key: key); @@ -21,7 +21,7 @@ class Sneakers extends StatelessWidget { children: [ SizedBox( height: size.height / 1.5, - child: KStreamBuilder( + child: ProductStreamBuilder( productStream: productStream, ), ) diff --git a/lib/views/main/product_categories/women.dart b/lib/views/main/product_categories/women.dart index 59bd528..d00ee16 100644 --- a/lib/views/main/product_categories/women.dart +++ b/lib/views/main/product_categories/women.dart @@ -1,6 +1,6 @@ import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:flutter/material.dart'; -import '../../../../utilities/k_stream_builder.dart'; +import '../../../../utilities/products_stream_builder.dart'; class WomenWears extends StatelessWidget { const WomenWears({Key? key}) : super(key: key); @@ -19,7 +19,7 @@ class WomenWears extends StatelessWidget { children: [ SizedBox( height: size.height / 1.5, - child: KStreamBuilder( + child: ProductStreamBuilder( productStream: productStream, ), ) diff --git a/pubspec.lock b/pubspec.lock index ec7a626..ef1ec87 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -237,6 +237,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.0.7" + flutter_swiper_null_safety: + dependency: "direct main" + description: + name: flutter_swiper_null_safety + url: "https://pub.dartlang.org" + source: hosted + version: "1.0.2" flutter_test: dependency: "direct dev" description: flutter diff --git a/pubspec.yaml b/pubspec.yaml index 115a063..5d60996 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -47,6 +47,7 @@ dependencies: convex_bottom_bar: ^3.1.0+1 carousel_slider: ^4.1.1 path: ^1.8.1 + flutter_swiper_null_safety: ^1.0.2 dev_dependencies: flutter_test: