Initial commit
This commit is contained in:
317
app_code/lib/screens/home.dart
Normal file
317
app_code/lib/screens/home.dart
Normal file
@@ -0,0 +1,317 @@
|
||||
|
||||
import 'package:carousel_slider/carousel_slider.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:grostore/app_lang.dart';
|
||||
import 'package:grostore/configs/style_config.dart';
|
||||
import 'package:grostore/configs/theme_config.dart';
|
||||
import 'package:grostore/custom_ui/BoxDecorations.dart';
|
||||
import 'package:grostore/custom_ui/Button.dart';
|
||||
import 'package:grostore/custom_ui/category_ui.dart';
|
||||
import 'package:grostore/custom_ui/product_card.dart';
|
||||
import 'package:grostore/custom_ui/shimmers.dart';
|
||||
import 'package:grostore/helpers/common_functions.dart';
|
||||
import 'package:grostore/helpers/device_info_helper.dart';
|
||||
import 'package:grostore/helpers/route.dart';
|
||||
import 'package:grostore/presenters/home_presenter.dart';
|
||||
import 'package:grostore/screens/filter.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
class Home extends StatefulWidget {
|
||||
String? id;
|
||||
|
||||
Home({Key? key, this.id}) : super(key: key);
|
||||
|
||||
@override
|
||||
State<Home> createState() => _HomeState();
|
||||
}
|
||||
|
||||
class _HomeState extends State<Home> {
|
||||
@override
|
||||
void initState() {
|
||||
Provider.of<HomePresenter>(context,listen: false).setContext(context);
|
||||
Provider.of<HomePresenter>(context, listen: false).initState(context);
|
||||
|
||||
super.initState();
|
||||
}
|
||||
|
||||
// @override
|
||||
// void dispose() {
|
||||
// Provider.of<HomePresenter>(context, listen: false).dispose();
|
||||
// super.dispose();
|
||||
// }
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SafeArea(
|
||||
child: Scaffold(
|
||||
backgroundColor: ThemeConfig.xxlightGrey,
|
||||
appBar: buildSearchOption(context),
|
||||
body: Consumer<HomePresenter>(builder: (context, data, child) {
|
||||
return RefreshIndicator(
|
||||
onRefresh: data.onRefresh,
|
||||
child: SingleChildScrollView(
|
||||
controller: data.homeScrollController,
|
||||
child: SafeArea(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
buildSliderSection(data),
|
||||
const SizedBox(
|
||||
height: 14,
|
||||
),
|
||||
Padding(
|
||||
padding:
|
||||
EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
AppLang.local(context).top_categories_ucf,
|
||||
style: StyleConfig.fs16fwBold,
|
||||
),
|
||||
const SizedBox(
|
||||
width: 8,
|
||||
),
|
||||
Image.asset(
|
||||
getAssetIcon("fire.png"),
|
||||
height: 20,
|
||||
width: 20,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 10,
|
||||
),
|
||||
buildTopCategorySection(data),
|
||||
const SizedBox(
|
||||
height: 14,
|
||||
),
|
||||
Padding(
|
||||
padding:
|
||||
EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
AppLang.local(context).best_selling_products_ucf,
|
||||
style: StyleConfig.fs16fwBold,
|
||||
),
|
||||
const SizedBox(
|
||||
width: 8,
|
||||
),
|
||||
Image.asset(
|
||||
getAssetIcon("fire.png"),
|
||||
height: 20,
|
||||
width: 20,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 10,
|
||||
),
|
||||
SizedBox(
|
||||
// color: Colors.red,
|
||||
height:225,
|
||||
child: buildBestSellingProductSection(data)),
|
||||
const SizedBox(height: 14,),
|
||||
Padding(
|
||||
padding:
|
||||
EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
AppLang.local(context).all_products_ucf,
|
||||
style: StyleConfig.fs16fwBold,
|
||||
),
|
||||
const SizedBox(
|
||||
width: 8,
|
||||
),
|
||||
Image.asset(
|
||||
getAssetIcon("fire.png"),
|
||||
height: 20,
|
||||
width: 20,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 10,
|
||||
),
|
||||
allProducts(data),
|
||||
const SizedBox(
|
||||
height: 14,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Container buildTopCategorySection(HomePresenter data) {
|
||||
return Container(
|
||||
height: 100,
|
||||
child: data.isTopCategoryInitial
|
||||
? ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
itemBuilder: (context, index) {
|
||||
return Button(
|
||||
minWidth: 40,
|
||||
onPressed: (){
|
||||
MakeRoute.go(context, Filter(category_id:data.topCategoryList[index].id.toString() ,));
|
||||
},
|
||||
child: SizedBox(
|
||||
width: 100,
|
||||
child: CategoryUi(
|
||||
img: data.topCategoryList[index].thumbnailImage,
|
||||
name: data.topCategoryList[index].name),
|
||||
),
|
||||
);
|
||||
},
|
||||
separatorBuilder: (context, index) {
|
||||
return const SizedBox(
|
||||
width: 8,
|
||||
);
|
||||
},
|
||||
itemCount: data.topCategoryList.length)
|
||||
: categoryShimmer(),
|
||||
);
|
||||
}
|
||||
|
||||
SizedBox buildSliderSection(HomePresenter data) {
|
||||
return SizedBox(
|
||||
height: 170,
|
||||
child: CarouselSlider(
|
||||
items:
|
||||
data.isHomeBannerInitial ? data.homeBannerImages : sliderShimmer(),
|
||||
options: CarouselOptions(
|
||||
aspectRatio: 2,
|
||||
viewportFraction: 0.94,
|
||||
height: 150,
|
||||
// enlargeCenterPage: true,
|
||||
scrollDirection: Axis.horizontal,
|
||||
autoPlay: true,
|
||||
onPageChanged: (index, reason) {
|
||||
data.onChangeBannerIndex(index);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
PreferredSize buildSearchOption(BuildContext context) {
|
||||
return PreferredSize(
|
||||
preferredSize: Size(getWidth(context), 54),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 14),
|
||||
margin: const EdgeInsets.only(top:12, left: 24, right: 24),
|
||||
width: getWidth(context),
|
||||
decoration: BoxDecorations.shadow(radius: 6.0),
|
||||
child: Button(
|
||||
onPressed: ()=>MakeRoute.go(context, Filter(isFocus: true,)),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Image.asset(
|
||||
getAssetIcon("search.png"),
|
||||
height: 16,
|
||||
width: 16,
|
||||
),
|
||||
const SizedBox(
|
||||
width: 8,
|
||||
),
|
||||
Text(
|
||||
AppLang.local(context).search_product_ucf,
|
||||
style: StyleConfig.fs12cGrey,
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
));
|
||||
}
|
||||
|
||||
List<Widget> sliderShimmer() {
|
||||
return [
|
||||
Shimmers(width: getWidth(context) - 40, height: 200),
|
||||
Shimmers(width: getWidth(context) - 40, height: 200),
|
||||
Shimmers(width: getWidth(context) - 40, height: 200),
|
||||
Shimmers(width: getWidth(context) - 40, height: 200),
|
||||
];
|
||||
}
|
||||
|
||||
ListView categoryShimmer() {
|
||||
return ListView.separated(
|
||||
padding: EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemBuilder: (context, index) {
|
||||
return Shimmers(
|
||||
width: 76,
|
||||
height: 87,
|
||||
radius: 6.0,
|
||||
);
|
||||
},
|
||||
separatorBuilder: (context, index) {
|
||||
return const SizedBox(
|
||||
width: 8,
|
||||
height: 10,
|
||||
);
|
||||
},
|
||||
itemCount: 10);
|
||||
}
|
||||
|
||||
Widget allProductShimmer() {
|
||||
return GridView.builder(
|
||||
padding: EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
crossAxisSpacing: 16,
|
||||
mainAxisSpacing: 16,
|
||||
childAspectRatio: 2/3),
|
||||
itemCount: 10,
|
||||
itemBuilder: (context, index) {
|
||||
return Shimmers(width: 160, height: 186,radius: 8,);
|
||||
});
|
||||
}
|
||||
|
||||
Widget buildBestSellingProductSection(HomePresenter data){
|
||||
return
|
||||
data.isBestSellingProductInitial ?
|
||||
ListView.separated(
|
||||
padding: EdgeInsets.symmetric(horizontal: StyleConfig.padding),
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemBuilder: (context, index) {
|
||||
return ProductCard(
|
||||
product: data.bestSellingProductList[index],context: this.context,);
|
||||
},
|
||||
separatorBuilder: (context,index)=>const SizedBox(width: 10,), itemCount: data.bestSellingProductList.length)
|
||||
:Shimmers.horizontalList(10, 160, 160);
|
||||
}
|
||||
|
||||
|
||||
Widget allProducts(HomePresenter data){
|
||||
String datas = '';
|
||||
return data.isAllProductInitial?GridView.builder(
|
||||
padding: EdgeInsets.only(left: StyleConfig.padding,right: StyleConfig.padding,bottom: 20),
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemCount: data.products.length,
|
||||
itemBuilder: (context, index) {
|
||||
datas = data.products[index].name;
|
||||
return ProductCard(product: data.products[index],context: this.context,);
|
||||
},
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
crossAxisSpacing: 16,
|
||||
mainAxisSpacing: 16,
|
||||
childAspectRatio: 0.72,
|
||||
// childAspectRatio: 2.1/3
|
||||
),
|
||||
):allProductShimmer();
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user