// import 'package:aku_community/base/base_style.dart';
import 'package:aku_community/base/base_style.dart';
import 'package:aku_community/model/common/img_model.dart';
import 'package:aku_community/model/community/swiper_model.dart';
import 'package:aku_community/provider/app_provider.dart';
import 'package:aku_community/ui/community/community_func.dart';
import 'package:aku_community/ui/home/public_infomation/public_information_detail_page.dart';
import 'package:aku_community/ui/market/widget/animated_home_background.dart';
import 'package:aku_community/ui/search/bee_search.dart';
import 'package:aku_community/widget/home/home_sliver_app_bar.dart';
import 'package:aku_community/widget/others/rectIndicator.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:bot_toast/bot_toast.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';
import 'package:get/get.dart';
import 'package:waterfall_flow/waterfall_flow.dart';
import 'package:aku_community/constants/api.dart';
import 'package:aku_community/models/market/display_category_model.dart';
import 'package:aku_community/models/market/goods_item.dart';
import 'package:aku_community/models/market/market_category_model.dart';
import 'package:aku_community/ui/market/category/category_card.dart';
import 'package:aku_community/ui/market/category/category_page.dart';
import 'package:aku_community/ui/market/goods/goods_card.dart';
import 'package:aku_community/ui/market/order/my_order_page.dart';
import 'package:aku_community/ui/market/search/search_goods_page.dart';
import 'package:aku_community/utils/headers.dart';
import 'package:aku_community/utils/network/base_list_model.dart';
import 'package:aku_community/utils/network/net_util.dart';
import 'package:aku_community/widget/bee_scaffold.dart';
import 'package:provider/provider.dart';
import 'package:aku_community/provider/app_provider.dart';
// import 'package:aku_community/ui/market/goods/goods_detail_page.dart';
// import 'package:aku_community/widget/tab_bar/bee_tab_bar.dart';
class MarketPage extends StatefulWidget {
MarketPage({Key? key}) : super(key: key);
@override
_MarketPageState createState() => _MarketPageState();
}
class _MarketPageState extends State<MarketPage>
with AutomaticKeepAliveClientMixin , TickerProviderStateMixin{
List<MarketCategoryModel> _marketModels = [];
List<GoodsItem> _hotItems = [];
late EasyRefreshController _refreshController;
late ScrollController _sliverListController;
GlobalKey<HomeSliverAppBarState> _sliverAppBarGlobalKey = GlobalKey();
GlobalKey<AnimatedHomeBackgroundState> _animatedBackgroundState = GlobalKey();
int _pageNum = 1;
int _size = 4;
int _pageCount = 0;
double MessageHeight = 76.w;
double bannerHeight = 354.w;
double buttonsHeight = 334.w;
double searchHeight = 74.w.w;
double tabBarHeight = 60.w;
late TabController _tabController;
List<SwiperModel> _swiperModels = [];
Future updateMarketInfo() async {
BaseListModel baseListModel =
await NetUtil().getList(API.market.hotTop, params: {
"pageNum": _pageNum,
"size": _size,
});
if (baseListModel.tableList!.isNotEmpty) {
_hotItems = (baseListModel.tableList as List)
.map((e) => GoodsItem.fromJson(e))
.toList();
}
_pageCount = baseListModel.pageCount!;
}
Future loadMarketInfo() async {
BaseListModel baseListModel =
await NetUtil().getList(API.market.hotTop, params: {
"pageNum": _pageNum,
"size": _size,
});
if (baseListModel.tableList!.isNotEmpty) {
_hotItems.addAll((baseListModel.tableList as List)
.map((e) => GoodsItem.fromJson(e))
.toList());
}
_pageCount = baseListModel.pageCount!;
}
@override
void initState() {
super.initState();
_refreshController = EasyRefreshController();
_sliverListController = ScrollController();
_tabController = TabController(
initialIndex: 0, length: 3, vsync: this);
Future.delayed(Duration(milliseconds: 0), () async {
_marketModels = await DisplayCategoryModel.top8;
await updateMarketInfo();
setState(() {});
});
}
@override
void dispose() {
_refreshController.dispose();
_sliverListController.dispose();
_tabController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
super.build(context);
final mediaWidth = MediaQuery.of(context).size.width;
return Scaffold(
body:EasyRefresh(
firstRefresh: true,
enableControlFinishLoad: false,
header: MaterialHeader(),
footer: MaterialFooter(),
controller: _refreshController,
onRefresh: () async {
_pageNum = 1;
await updateMarketInfo();
_swiperModels = await CommunityFunc.swiper();
setState(() {});
},
onLoad: () async {
_pageNum++;
await loadMarketInfo();
if (_pageCount <= _pageNum) {
_refreshController.finishLoad(noMore: false);
}
setState(() {});
},
child: _buildBody(context),
),
);
}
Widget _buildBody(BuildContext context) {
return CustomScrollView(
controller: _sliverListController,
slivers: <Widget>[
HomeSliverAppBar(
key: _sliverAppBarGlobalKey,
actions: _actionsWidget(),
title: _buildTitle(),
backgroundColor: Colors.red,
expandedHeight: MessageHeight+
bannerHeight +
buttonsHeight+
searchHeight +tabBarHeight+ScreenUtil().statusBarHeight +kToolbarHeight+280.w,
flexibleSpace: _flexibleSpaceBar(context),
bottom: PreferredSize(
preferredSize: Size.fromHeight(tabBarHeight),
child: _goodsTitle()
)),
SliverPadding(
padding: EdgeInsets.all(10.w),
),
SliverPadding(
padding: EdgeInsets.only(left: 20.w,right: 20.w),
sliver: buildSliverGrid(),
),
],
);
}
SliverGrid buildSliverGrid() {
return SliverGrid(
// child: WaterfallFlow.builder(
// gridDelegate: SliverWaterfallFlowDelegateWithFixedCrossAxisCount(
// crossAxisCount: 2,
// mainAxisSpacing: 20.w,
// crossAxisSpacing: 20.w,
// ),
// padding: EdgeInsets.all(32.w),
// itemBuilder: (context, index) {
// final item = _hotItems[index];
// return GoodsCard(item: item);
// },
// itemCount: _hotItems.length,
// ),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
mainAxisSpacing: 20.w,
crossAxisSpacing: 20.w,
childAspectRatio:0.57,
),
///子Item构建器
delegate: new SliverChildBuilderDelegate(
(BuildContext context, int index) {
///每一个子Item的样式
return GoodsCard(item: _hotItems[index]);
// return Container(
// width: 200.w,
// height: 200.w,
// color: Colors.blue,
// );
},
///子Item的个数
childCount: _hotItems.length,
),
);
}
_actionsWidget() {
return <Widget>[
GestureDetector(
onTap: () {
//Get.to(() => BeeSearch()); 购物车
},
child: Image.asset(R.ASSETS_ICONS_SHOP_CAR_PNG,
height: 40.w, width: 40.w),
),
Padding(
padding: const EdgeInsets.only( left: 12),
child: GestureDetector(
onTap: () {
//Get.to(() => BeeSearch()); 订单
},
child: Image.asset(R.ASSETS_ICONS_SHOP_ORDER_PNG,
height: 40.w, width: 40.w),
),
),
];
}
Widget _buildTitle() {
final appProvider = Provider.of<AppProvider>(context);
return Container(
height: kToolbarHeight,
// child: ges,
//color: Colors.blue,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children:[
Container(
height: 40.w,
child: Flex(
direction: Axis.horizontal,
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
if (appProvider.location != null)
Padding(
padding:EdgeInsets.only(right: 5.w,top: 5.w),
child: Image.asset(
R.ASSETS_ICONS_SHOP_LOCATION_PNG,
width: 40.w,
height: 40.w,
fit: BoxFit.fitHeight,
//color: Colors.white,
),
),
Text(
appProvider.location?['city']==null?'':appProvider.location?['city'] as String? ?? '',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 28.sp,
color: Colors.white,
),
//textAlign: TextAlign.center,
),
]),
// Expanded(
// child: ges,
// )
],
),
// child: ges,
),
// 20.hb,
//ges,
],
),
);
}
FlexibleSpaceBar _flexibleSpaceBar(context) {
return FlexibleSpaceBar(
collapseMode: CollapseMode.pin,
background: Container(
//头部整个背景颜色
height: double.infinity,
color: Color(0xFFF9F9F9),
// color: Colors.white,
child: Stack(
children: <Widget>[
AnimatedHomeBackground(
key: _animatedBackgroundState,
height: 530.w,
backgroundColor: Colors.white ,
),
Column(
children: <Widget>[
Container(
height: ScreenUtil().statusBarHeight +kToolbarHeight,
),
geSearch(),
20.hb,
getNum(),
20.hb,
HomeSwiper(),
20.hb,
_buttonTitle(),
20.hb,
_recommend(),
],
),
],
)),
);
}
geSearch(){
return Container(
margin: EdgeInsets.symmetric(horizontal: 24.w),
child: MaterialButton(
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
height: 74.w,
shape: StadiumBorder(),
elevation: 0,
minWidth: double.infinity,
color: Color(0xFFF3F3F3),
onPressed: () {
Get.to(() => SearchGoodsPage());
},
child: Row(
children: [
Icon(
Icons.search,
size: 32.w,
color: Color(0xFF666666),
),
10.wb,
'请输入关键字'.text.size(28.sp).color(ktextSubColor).make().expand(),
],
),
),
);
}
getNum(){
return Container(
margin: EdgeInsets.only(left: 18.w,right: 18.w),
padding: EdgeInsets.only(right:8.w ),
height: 76.w,
width: double.infinity,
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.horizontal(right: Radius.circular(12),left:Radius.circular(12), ),
gradient: LinearGradient(
begin: FractionalOffset.centerRight,
end: FractionalOffset.centerLeft,
colors: <Color>[Color(0xFFAD2222), Color(0xFFCD392B)],
),
),
child: Stack(
children: [
Positioned(
bottom: 5,
right: 0,
top: 5,
child: Container(
padding: EdgeInsets.only(top: 5.w,bottom: 5.w),
alignment: Alignment.center,
height: 61.w,
width: 694.w,
decoration: BoxDecoration(
color: Color(0xFFFDEEBF),
borderRadius: BorderRadius.horizontal(right: Radius.circular(12),left:Radius.circular(12) ),
),
child: Container(
height: 50.w,
width: 682.w,
decoration: BoxDecoration(
//color: Color(0x99F5AF16),
borderRadius: BorderRadius.horizontal(right: Radius.circular(12),left:Radius.circular(12)),
border: Border.all(width: 2.w,color: Color(0x99F5AF16)),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
80.wb,
Image.asset(R.ASSETS_ICONS_SHOP_LABA_PNG,width: 36.w,height: 34.w,),
20.wb,
Text('今日上新1231件',style: TextStyle(color: Color(0xFFD0564B),fontSize: 24.sp,height: 1.05),),
],
),
),
)
),
Positioned(
left: 0,
top: 0,
child: Container(
padding: EdgeInsets.only(left: 10.w),
height: 76.w,
width: 258.w,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: FractionalOffset.centerLeft,
end: FractionalOffset.centerRight,
colors: <Color>[Color(0xFFAD2222), Color(0xFFCD392B)],
),
borderRadius: BorderRadius.horizontal(right: Radius.circular(50),left: Radius.circular(24))
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('SKU总数：237809',style: TextStyle(color: Colors.white,fontSize: 24.sp),),
Text('入驻品牌数：237809',style: TextStyle(color: Colors.white,fontSize: 24.sp),)
],
),
)),
],
),
);
}
Widget HomeSwiper() {
return Container(
padding: EdgeInsets.symmetric(horizontal: 20.w),
width: double.infinity,
height: bannerHeight,
child: AspectRatio(
aspectRatio: 355 / 177,
child: Swiper(
key: UniqueKey(),
itemBuilder: (BuildContext context, int index) {
return getSwiperImage(_swiperModels[index]);
},
pagination: SwiperPagination(
alignment: Alignment.bottomRight,
builder: SwiperCustomPagination(
builder: (BuildContext context, SwiperPluginConfig config) {
return RectIndicator(
position: config.activeIndex,
count: _swiperModels.length,
activeColor: Color(0x99FFFFFF),
color: Color(0xD9FFFFFF),
//未选中 指示器颜色，选中的颜色key为Color
width: 4,
//指示器宽度
activeWidth: 14,
//选中的指示器宽度
radius: 4,
//指示器圆角角度
height: 4,
); //指示器高度
})),
scrollDirection: Axis.horizontal,
// control: new SwiperControl(),
autoplay: true,
onTap: (index) {
Get.to(() =>
PublicInformationDetailPage(id: _swiperModels[index].newsId!));
},
itemCount: _swiperModels.length,
),
),
);
}
Widget getSwiperImage(SwiperModel swiperModel) {
return Container(
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(12.w)),
),
child:
FadeInImage.assetNetwork(
placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
image: API.image(ImgModel.first(swiperModel.voResourcesImgList)),
fit: BoxFit.fill,
imageErrorBuilder: (context, error, stackTrace) {
return Image.asset(
R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
fit: BoxFit.fill,
);
},
),
);
}
_buttonTitle() {
Container titles = Container(
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12.w),
),
child:
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
],
),
),
],
),
28.hb,
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
_buttonTitleRow(
),
],
),
),
],
),
],
),
);
return Container(
alignment: Alignment.center,
padding: EdgeInsets.symmetric(horizontal: 20.w),
height: buttonsHeight,
width: MediaQuery.of(context).size.width,
child: titles,
);
}
Widget getkingCoin() {
return Container(
alignment: Alignment.center,
padding: EdgeInsets.symmetric(horizontal: 20.w,vertical: 20.w),
width: double.infinity,
height: buttonsHeight,
child:_buttonTitleRow(),
);
}
_buttonTitleRow({onPressed}) {
return Expanded(
child: CupertinoButton(
padding: EdgeInsets.zero,
child: Column(
children: <Widget>[
Container(
width: 88.w,
height: 88.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 88.w,height: 88.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
Container(
margin: EdgeInsets.only(top: 6.w),
child: Text(
'数码产品',
style: TextStyle(
fontSize: 28.sp,
color: Color(0xFF333333)),
),
)
],
),
onPressed: () {
if (onPressed != null) {
onPressed();
}
},
),
);
}
_recommend(){
return Container(
height: 184.w,
margin: EdgeInsets.only(left: 20.w,right: 20.w),
padding: EdgeInsets.only(top: 8.w,left: 16.w,right: 16.w),
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12.w),
),
child:
Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
'爆款推荐',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 28.sp,
color: ktextPrimary),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
20.wb,
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
20.wb,
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
20.wb,
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
20.wb,
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
20.wb,
Container(
width: 96.w,
height: 96.w,
child: Image.asset(R.ASSETS_IMAGES_PLACEHOLDER_WEBP,width: 96.w,height: 96.w,),
// FadeInImage.assetNetwork(
// placeholder: R.ASSETS_IMAGES_PLACEHOLDER_WEBP,
// image: Api.getImgUrl(kingCoin.url),)
),
],
).expand(),
],
)
);
}
_goodsTitle(){
return Container(
height: 90.w,
alignment: Alignment.centerLeft,
color: Color(0xFFF9F9F9),
width: MediaQuery.of(context).size.width,
child: Container(
alignment: Alignment.centerLeft,
height: 60.w,
child: TabBar(
onTap: (index) {
// _presenter.fetchList(_category.id, 0, _sortType);
setState(() {});
},
isScrollable: true,
labelPadding: EdgeInsets.zero,
controller: _tabController,
labelColor: Color(0xFFF9F9F9),
indicatorPadding: EdgeInsets.symmetric(horizontal: 40.w),
indicatorSize: TabBarIndicatorSize.label,
unselectedLabelColor: Colors.black54,
labelStyle: TextStyle(color: Colors.black54),
indicatorColor: Color(0xFFE52E2E),
tabs: _tabItems()),
),
);
}
List<Widget> _tabItems() {
return [_tabItem(0,'综合推荐'),_tabItem(1,'销量'),_tabItem(2,'价格')];
}
_tabItem(int index,String text) {
bool isChoose = index == _tabController.index;
// Color textColor = index == _tabController.index
// ? getCurrentThemeColor()
// : Colors.black.withOpacity(0.9);
return Tab(
child: Container(
alignment: Alignment.center,
width: 150.w,
// color: Colors.white,
color: Color(0xFFF9F9F9),
padding: EdgeInsets.only(left: 10.w, right: 10.w),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
text,
style: TextStyle(
fontWeight: isChoose?FontWeight.bold:FontWeight.normal,
fontSize: isChoose?32.sp:28.sp,
color: isChoose?Color(0xFF000000):Color(0xFF666666)),
),
],
),
),
);
}
@override
bool get wantKeepAlive => true;
}