diff --git a/assets/icons/ic_arrow_right.svg b/assets/icons/ic_arrow_right.svg new file mode 100644 index 0000000..96c0b3f --- /dev/null +++ b/assets/icons/ic_arrow_right.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/core/constants/app_locale_keys.dart b/lib/core/constants/app_locale_keys.dart index 4e608a0..cac8232 100644 --- a/lib/core/constants/app_locale_keys.dart +++ b/lib/core/constants/app_locale_keys.dart @@ -9,4 +9,11 @@ abstract class AppLocaleKeys { static const String imageUrl = "https://xsznseejebbai1lj.public.blob.vercel-storage.com/homepage/hero/hero-1.webp"; + + static const String lorem = '''Lorem Ipsum is simply dummy text of the + printing and typesetting industry. Lorem Ipsum + has been the industry's standard dummy text ever + since the 1500s, when an unknown printer took a + galley of type and scrambled it to make a type + specimen book'''; } diff --git a/lib/core/theme/app_icons.dart b/lib/core/theme/app_icons.dart index 14e3dd1..dfb10b7 100644 --- a/lib/core/theme/app_icons.dart +++ b/lib/core/theme/app_icons.dart @@ -36,6 +36,7 @@ abstract class AppIcons { static const String icSearch = "$baseUrl/ic_search.svg"; static const String icCheck= "$baseUrl/ic_check.svg"; static const String icCheck1= "$baseUrl/ic_check1.svg"; + static const String icArrowRight= "$baseUrl/ic_arrow_right.svg"; ///.png icons diff --git a/lib/feature/basket/basket.dart b/lib/feature/basket/basket.dart index e7e41b4..e35bdaa 100644 --- a/lib/feature/basket/basket.dart +++ b/lib/feature/basket/basket.dart @@ -3,3 +3,6 @@ export 'package:food_delivery_client/feature/basket/presentation/pages/basket_pa export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_header.dart'; export 'presentation/blocs/basket_bloc.dart'; export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart'; +export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart'; +export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart'; +export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart'; diff --git a/lib/feature/basket/presentation/blocs/basket_bloc.dart b/lib/feature/basket/presentation/blocs/basket_bloc.dart index 662b62d..ddbcfce 100644 --- a/lib/feature/basket/presentation/blocs/basket_bloc.dart +++ b/lib/feature/basket/presentation/blocs/basket_bloc.dart @@ -15,6 +15,6 @@ class BasketBloc extends Bloc { _onStarted(_Started event, Emitter emit) async { emit(state.copyWith(status: RequestStatus.loading)); await Future.delayed(TimeDelayConst.duration3); - emit(state.copyWith(status: RequestStatus.loaded)); + emit(state.copyWith(status: RequestStatus.loaded, orders: [])); } } diff --git a/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart index affb21d..7d084e0 100644 --- a/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart +++ b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart @@ -1,4 +1,4 @@ -import 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart'; + import '../../../../../../food_delivery_client.dart'; @@ -9,14 +9,17 @@ class WBasketBody extends StatelessWidget { Widget build(BuildContext context) { return BlocBuilder( builder: (context, state) { + log("qweqweqweqwe:${state.orders}"); + log("qweqweqweqwe:${state.orders.isEmpty}"); + log("qweqweqweqwe:${state.orders.isNotEmpty}"); + + return Column( children: [ WBasketHeader(), - OrderItem(), - - if (state.status.isLoading()) Text("Loading"), + if (state.status.isLoading()) WBasketLoading(), if (state.status.isLoaded()) - if (state.orders.isEmpty) WBasketEmpty(), + if (state.orders.isEmpty) WBasketEmpty() else WBasketCarts(), ], ); }, diff --git a/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart new file mode 100644 index 0000000..6e84e8e --- /dev/null +++ b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart @@ -0,0 +1,29 @@ + +import '../../../../../../food_delivery_client.dart'; + +class WBasketCarts extends StatelessWidget { + const WBasketCarts({super.key}); + + @override + Widget build(BuildContext context) { + return BlocBuilder( + builder: (context, state) { + return Expanded( + child: RefreshIndicator( + onRefresh: () async { + context.read().add(BasketEvent.started()); + await Future.delayed(TimeDelayConst.duration3); + }, + child: ListView.builder( + shrinkWrap: true, + itemCount: 10, + scrollDirection: Axis.vertical, + physics: const AlwaysScrollableScrollPhysics(), + itemBuilder: (context, index) => OrderItem(), + ), + ), + ); + }, + ); + } +} diff --git a/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart index bddb00b..7a228e4 100644 --- a/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart +++ b/lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart @@ -1,3 +1,4 @@ + import '../../../../../../food_delivery_client.dart'; class WBasketLoading extends StatelessWidget { @@ -5,12 +6,21 @@ class WBasketLoading extends StatelessWidget { @override Widget build(BuildContext context) { - return Column(children: []); + return Expanded( + child: ListView.builder( + shrinkWrap: true, + itemCount: 10, + scrollDirection: Axis.vertical, + physics: const NeverScrollableScrollPhysics(), + itemBuilder: (context, index) => + Skeletonizer(enabled: true, child: OrderItemSkeletonizer()), + ), + ); } } -class OrderItem extends StatelessWidget { - const OrderItem({super.key}); +class OrderItemSkeletonizer extends StatelessWidget { + const OrderItemSkeletonizer({super.key}); @override Widget build(BuildContext context) { @@ -32,28 +42,34 @@ class OrderItem extends StatelessWidget { ), ), 16.horizontalSpace, - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text("Begs & Megs", style: AppTextStyles.size16Medium), - Text( - "1 item", - style: AppTextStyles.size14Regular.copyWith( - color: AppColors.c6B6B6B, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text("Begs & Megs", style: AppTextStyles.size16Medium), + Text( + AppLocaleKeys.lorem, + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: AppTextStyles.size14Regular.copyWith( + color: AppColors.c6B6B6B, + ), ), - ), - Text( - "Deliver to San Franciscao Bay Area", - style: AppTextStyles.size14Regular.copyWith( - color: AppColors.c6B6B6B, + Text( + "Deliver to San Franciscao Bay Area", + style: AppTextStyles.size14Regular.copyWith( + color: AppColors.c6B6B6B, + ), ), - ), - ], + ], + ), + ), + Icon( + Icons.arrow_forward_ios_outlined, + color: AppColors.cFFFFFF, ), - const Spacer(), - Icon(Icons.arrow_forward_ios_outlined), ], - ).paddingSymmetric(vertical: 10, horizontal: 16), + ).paddingSymmetric(vertical: 10, horizontal: 18), 10.verticalSpace, WDivider(indent: 120, endIndent: 20, height: 1), ], diff --git a/lib/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart b/lib/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart new file mode 100644 index 0000000..009035f --- /dev/null +++ b/lib/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart @@ -0,0 +1,86 @@ +import '../../../../../../food_delivery_client.dart'; + +class OrderItem extends StatelessWidget { + const OrderItem({super.key}); + + @override + Widget build(BuildContext context) { + return InkWell( + onTap: () {}, + child: Ink( + child: Column( + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + ClipRRect( + borderRadius: AppUtils.kBorderRadius40, + child: CachedNetworkImage( + imageUrl: AppLocaleKeys.imageUrl, + height: 70, + width: 70, + fit: BoxFit.cover, + ), + ), + 16.horizontalSpace, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + AppLocaleKeys.lorem, + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: AppTextStyles.size16Medium, + ), + Row( + spacing: 5, + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Expanded( + child: Text( + AppLocaleKeys.lorem, + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: AppTextStyles.size14Regular.copyWith( + color: AppColors.c6B6B6B, + ), + ), + ), + Icon(Icons.circle, size: 5, color: AppColors.c6B6B6B), + Expanded( + child: Text( + AppLocaleKeys.lorem, + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: AppTextStyles.size14Regular.copyWith( + color: AppColors.c6B6B6B, + ), + ), + ), + ], + ), + Text( + AppLocaleKeys.lorem, + maxLines: 1, + overflow: TextOverflow.ellipsis, + style: AppTextStyles.size14Regular.copyWith( + color: AppColors.c6B6B6B, + ), + ), + ], + ), + ), + 10.horizontalSpace, + SvgPicture.asset(AppIcons.icArrowRight), + ], + ).paddingSymmetric(vertical: 10, horizontal: 18), + 10.verticalSpace, + WDivider(indent: 120, endIndent: 20, height: 1), + ], + ), + ), + ); + } +} diff --git a/lib/food_delivery_client.dart b/lib/food_delivery_client.dart index 29f8664..392a676 100644 --- a/lib/food_delivery_client.dart +++ b/lib/food_delivery_client.dart @@ -21,3 +21,4 @@ export 'package:cached_network_image/cached_network_image.dart'; export 'package:carousel_slider/carousel_slider.dart'; export 'package:flutter_bounceable/flutter_bounceable.dart'; export 'package:food_delivery_client/feature/on_boarding/presentation/pages/splash_page/splash_page.dart'; +export 'package:skeletonizer/skeletonizer.dart'; diff --git a/pubspec.lock b/pubspec.lock index 51e70cc..5640884 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -725,6 +725,14 @@ packages: url: "https://pub.dev" source: hosted version: "3.0.0" + skeletonizer: + dependency: "direct main" + description: + name: skeletonizer + sha256: eebc03dc86b298e2d7f61e0ebce5713e9dbbc3e786f825909b4591756f196eb6 + url: "https://pub.dev" + source: hosted + version: "2.1.0+1" sky_engine: dependency: transitive description: flutter diff --git a/pubspec.yaml b/pubspec.yaml index 393175c..4bbdb20 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -42,6 +42,8 @@ dependencies: freezed: ^3.2.3 freezed_annotation: ^3.1.0 + #loading: + skeletonizer: ^2.1.0+1 dev_dependencies: flutter_test: