garagesale_page.dart 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  1. import 'package:cpt_community/components/newsfeed_card_content.dart';
  2. import 'package:cpt_community/components/newsfeed_card_footer.dart';
  3. import 'package:cs_resources/generated/assets.dart';
  4. import 'package:cs_resources/theme/app_colors_theme.dart';
  5. import 'package:flutter/material.dart';
  6. import 'package:auto_route/auto_route.dart';
  7. import 'package:flutter/rendering.dart';
  8. import 'package:hooks_riverpod/hooks_riverpod.dart';
  9. import 'package:router/ext/auto_router_extensions.dart';
  10. import 'package:shared/utils/color_utils.dart';
  11. import 'package:shared/utils/log_utils.dart';
  12. import 'package:widgets/ext/ex_widget.dart';
  13. import 'package:widgets/my_appbar.dart';
  14. import 'package:widgets/my_load_image.dart';
  15. import 'package:widgets/my_text_view.dart';
  16. import 'package:widgets/widget_export.dart';
  17. import '../../components/newfeed_card_header.dart';
  18. import '../../router/page/community_page_router.dart';
  19. import '../community/community_vm.dart';
  20. import 'garagesale_tabs.dart';
  21. import 'garagesale_vm.dart';
  22. @RoutePage()
  23. class GaragesalePage extends HookConsumerWidget {
  24. const GaragesalePage({Key? key}) : super(key: key);
  25. //启动当前页面
  26. static void startInstance({BuildContext? context}) {
  27. if (context != null) {
  28. context.router.push(const GaragesalePageRoute());
  29. } else {
  30. appRouter.push(const GaragesalePageRoute());
  31. }
  32. }
  33. Widget _buildTabsSection(BuildContext context, WidgetRef ref, vm){
  34. return Container(
  35. width: double.infinity,
  36. padding: const EdgeInsets.only(left: 15, right: 15,top: 14,bottom: 14),
  37. child: GaragesaleTabs(
  38. key: ValueKey(vm.state.activeIndex),
  39. tabsList: vm.state.tabsList,
  40. ),
  41. );
  42. }
  43. Widget _buildPostSection(BuildContext context, WidgetRef ref, vm){
  44. return Container(
  45. height: 65.5,
  46. width: double.infinity,
  47. padding: const EdgeInsets.only(left: 20, right: 20),
  48. color: Colors.white,
  49. child: Row(
  50. children: [
  51. const MyAssetImage(Assets.communityNesFeed, width: 45,height: 45,),
  52. Expanded(
  53. child: Row(
  54. children: [
  55. Expanded(
  56. child: Container(
  57. // height: 65.5,
  58. // color: Colors.blue,
  59. child: MyTextView(
  60. "Sell Item",
  61. textColor: ColorUtils.string2Color('#000000'),
  62. fontSize: 15,
  63. marginLeft: 15,
  64. alignment: Alignment.centerLeft,
  65. textAlign: TextAlign.left,
  66. backgroundColor: ColorUtils.string2Color('#ffffff'),
  67. maxLines: 1,
  68. isFontMedium: true,
  69. ),
  70. ),
  71. ),
  72. const MyAssetImage(
  73. Assets.communityCamera,
  74. width: 21,
  75. height: 16.5,
  76. ),
  77. ],
  78. ).onTap((){
  79. vm.handlerGotoPost(context);
  80. }),
  81. ),
  82. ],
  83. ),
  84. );
  85. }
  86. Widget _buildNewsItem(BuildContext context, WidgetRef ref, item, vm){
  87. return Container(
  88. width: double.infinity,
  89. // padding: const EdgeInsets.only(left: 15, right: 15,top: 14,bottom: 14),
  90. color: Colors.yellow,
  91. child: Container(
  92. margin: const EdgeInsets.only(left: 15, right: 15,top: 14,bottom: 14),
  93. color: Colors.white,
  94. padding: const EdgeInsets.only(left: 15, right: 15,top: 17,bottom: 17),
  95. height: 280,
  96. child: Column(
  97. mainAxisAlignment: MainAxisAlignment.center,
  98. crossAxisAlignment: CrossAxisAlignment.start,
  99. children: [
  100. // 卡片头部(头像 标题 时间)
  101. NewsFeedCardHeader(
  102. key: UniqueKey(),
  103. title: item['title'],
  104. avator: item['avator'],
  105. time: item['time'],
  106. ),
  107. const SizedBox(height: 15),
  108. // 卡片中间 (文字和图片)
  109. Expanded(
  110. child: NewsFeedCardContent(
  111. key: UniqueKey(),
  112. content: item['content'],
  113. imageUrls: item['imageUrls'],
  114. ),
  115. ),
  116. const SizedBox(height: 26),
  117. // // 卡片底部 (点赞 评论 分享)
  118. NewsFeedCardFooter(
  119. key: UniqueKey(),
  120. isLike: item['isLike'],
  121. ),
  122. ]
  123. ),
  124. )
  125. );
  126. }
  127. Widget _buildNesFeedList(BuildContext context, WidgetRef ref, vm){
  128. final itemList = vm.state.list?? [];
  129. if(itemList.isEmpty){
  130. return const Center(child: Text('No Data'));
  131. }else {
  132. List itemsList = vm.state.list.toList();
  133. return ListView.builder(
  134. key: UniqueKey(),
  135. itemCount: itemsList.length,
  136. itemBuilder: (context, index) {
  137. return _buildNewsItem(context, ref, itemsList[index], vm);
  138. },
  139. );
  140. }
  141. }
  142. @override
  143. Widget build(BuildContext context, WidgetRef ref) {
  144. final vm = ref.read(garagesaleVmProvider.notifier);
  145. return Scaffold(
  146. appBar: MyAppBar.searchAppBar(
  147. context,
  148. backgroundColor: context.appColors.whiteBG,
  149. actions: [
  150. IconButton(
  151. icon: const Icon(Icons.search),
  152. onPressed: () {
  153. // do something
  154. },
  155. ),
  156. ],
  157. ),
  158. backgroundColor: ColorUtils.string2Color("#F2F3F6"),
  159. body: Column(
  160. children: [
  161. // tab 分类 (For sale For Rent)
  162. _buildTabsSection(context, ref, vm),
  163. // 发布组件
  164. _buildPostSection(context, ref, vm),
  165. NotificationListener<ScrollNotification>(
  166. onNotification: (ScrollNotification notification) {
  167. // 检查当前页面是否是可见的
  168. bool isDownOrUp = notification.metrics.axis == Axis.vertical;
  169. if (notification is UserScrollNotification) {
  170. // 检查滚动方向
  171. switch (notification.direction) {
  172. case ScrollDirection.forward:
  173. print('Scrolling down');
  174. break;
  175. case ScrollDirection.reverse:
  176. print('Scrolling up');
  177. break;
  178. case ScrollDirection.idle:
  179. print('Scrolling stopped');
  180. break;
  181. }
  182. } else if (notification is ScrollUpdateNotification) {
  183. // 检查滚动位置变化
  184. double currentScrollPosition = notification.metrics.pixels;
  185. double maxScrollExtent = notification.metrics.maxScrollExtent;
  186. // 判断是否满足某个条件
  187. if (currentScrollPosition > 0 && currentScrollPosition < maxScrollExtent) {
  188. print('Current scroll position: $currentScrollPosition');
  189. // 在这里添加你的条件判断逻辑
  190. }
  191. // 只有当上下滚动时才拦截通知
  192. if (notification.metrics.axis == Axis.vertical) {
  193. final tabsRouter = ref.watch(communityVmProvider).tabsRouter;
  194. }
  195. }
  196. return false; // 返回 false 表示不拦截通知
  197. },
  198. child: Expanded(
  199. child: EasyRefresh(
  200. // 上拉加载
  201. onLoad: () async{
  202. Log.d("----onLoad");
  203. vm.onLoadData();
  204. },
  205. // 下拉刷新
  206. onRefresh: () async{
  207. Log.d("----onRefresh");
  208. vm.refreshListData();
  209. },
  210. child: _buildNesFeedList(context, ref, vm),
  211. ),
  212. ),
  213. )
  214. ],
  215. ),
  216. );
  217. }
  218. }