news_page.dart 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235
  1. import 'package:cs_resources/generated/assets.dart';
  2. import 'package:flutter/material.dart';
  3. import 'package:auto_route/auto_route.dart';
  4. import 'package:flutter/rendering.dart';
  5. import 'package:flutter_hooks/flutter_hooks.dart';
  6. import 'package:hooks_riverpod/hooks_riverpod.dart';
  7. import 'package:router/ext/auto_router_extensions.dart';
  8. import 'package:shared/utils/color_utils.dart';
  9. import 'package:shared/utils/log_utils.dart';
  10. import 'package:widgets/my_button.dart';
  11. import 'package:widgets/my_load_image.dart';
  12. import 'package:widgets/ext/ex_widget.dart';
  13. import 'package:widgets/my_text_view.dart';
  14. import 'package:widgets/my_appbar.dart';
  15. import 'package:cs_resources/theme/app_colors_theme.dart';
  16. import 'package:widgets/widget_export.dart';
  17. import '../../../components/newfeed_card_header.dart';
  18. import '../../../components/newsfeed_card_content.dart';
  19. import '../../../components/newsfeed_card_footer.dart';
  20. import '../../../router/page/community_page_router.dart';
  21. import '../community_vm.dart';
  22. import 'news_vm.dart';
  23. @RoutePage()
  24. class NewsPage extends HookConsumerWidget {
  25. const NewsPage({Key? key}) : super(key: key);
  26. //启动当前页面
  27. static void startInstance({BuildContext? context}) {
  28. if (context != null) {
  29. context.router.push(const NewsPageRoute());
  30. } else {
  31. appRouter.push(const NewsPageRoute());
  32. }
  33. }
  34. bool _isPreventScroll(ScrollNotification notification, WidgetRef ref){
  35. // 检查当前页面是否是可见的
  36. bool isDownOrUp = notification.metrics.axis == Axis.vertical;
  37. if (notification is ScrollUpdateNotification) {
  38. // 检查滚动位置变化
  39. double currentScrollPosition = notification.metrics.pixels;
  40. double maxScrollExtent = notification.metrics.maxScrollExtent;
  41. // 判断是否满足某个条件
  42. if (currentScrollPosition > 0 && currentScrollPosition < maxScrollExtent) {
  43. print('Current scroll position: $currentScrollPosition');
  44. // 在这里添加你的条件判断逻辑
  45. }
  46. // 只有当上下滚动时才拦截通知
  47. if (isDownOrUp) {
  48. final vm = ref.read(communityVmProvider.notifier);
  49. final currentTabRouter = vm.state!.tabsRouter;
  50. if(currentTabRouter!.activeIndex == 0){
  51. return false; // false 不拦截
  52. }else {
  53. Log.d("----news_page 滚动时---拦截了其他的");
  54. return true; // true 拦截
  55. }
  56. }else {
  57. return false;
  58. }
  59. }else if (notification is ScrollEndNotification) {
  60. // 检查滚动位置变化
  61. double currentScrollPosition = notification.metrics.pixels;
  62. double maxScrollExtent = notification.metrics.maxScrollExtent;
  63. // 判断是否满足某个条件
  64. if (currentScrollPosition > 0 && currentScrollPosition < maxScrollExtent) {
  65. print('Current scroll position: $currentScrollPosition');
  66. // 在这里添加你的条件判断逻辑
  67. }
  68. // 只有当上下滚动时才拦截通知
  69. if (isDownOrUp) {
  70. final vm = ref.read(communityVmProvider.notifier);
  71. final currentTabRouter = vm.state!.tabsRouter;
  72. if(currentTabRouter!.activeIndex == 0){
  73. return false; // false 不拦截
  74. }else {
  75. Log.d("----news_page 滚动时---拦截了其他的");
  76. return true; // true 拦截
  77. }
  78. }else {
  79. return true;
  80. }
  81. }else {
  82. return false;
  83. }
  84. // return false;
  85. }
  86. @override
  87. Widget build(BuildContext context, WidgetRef ref) {
  88. final vm = ref.read(newsVmProvider.notifier);
  89. return Scaffold(
  90. // appBar: MyAppBar.appBar(
  91. // context,
  92. // "news",
  93. // backgroundColor: context.appColors.whiteBG,
  94. // ),
  95. // backgroundColor: ColorUtils.string2Color("#F2F3F6"),
  96. body: NotificationListener<ScrollNotification>(
  97. onNotification: (ScrollNotification notification) {
  98. // 是否拦截滚动 false 表示不拦截通知
  99. return _isPreventScroll(notification, ref);
  100. // return false;
  101. },
  102. child: EasyRefresh(
  103. controller: EasyRefreshController(),
  104. key: UniqueKey(),
  105. // 上拉加载
  106. onLoad: () async{
  107. Log.d("----onLoad");
  108. vm.onLoadData();
  109. },
  110. // 下拉刷新
  111. onRefresh: () async{
  112. Log.d("----onRefresh");
  113. vm.refreshListData();
  114. },
  115. child: _buildNewsFeedList(context, ref, vm),
  116. ),
  117. )
  118. );
  119. }
  120. Widget _buildNewsItem(BuildContext context, WidgetRef ref, item, vm){
  121. return SizedBox(
  122. width: double.infinity,
  123. // color: Colors.yellow,
  124. child: Stack(
  125. children: [
  126. Container(
  127. margin: const EdgeInsets.only(left: 15, right: 15,top: 14,bottom: 14),
  128. color: Colors.white,
  129. padding: const EdgeInsets.only(left: 15, right: 15,top: 17,bottom: 17),
  130. height: 280,
  131. child: Column(
  132. mainAxisAlignment: MainAxisAlignment.center,
  133. crossAxisAlignment: CrossAxisAlignment.start,
  134. children: [
  135. // 卡片头部(头像 标题 时间)
  136. NewsFeedCardHeader(
  137. key: UniqueKey(),
  138. title: item['title'],
  139. avator: item['avator'],
  140. time: item['time'],
  141. ),
  142. const SizedBox(height: 15),
  143. // 卡片中间 (文字和图片)
  144. Expanded(
  145. child: NewsFeedCardContent(
  146. key: UniqueKey(),
  147. content: item['content'],
  148. imageUrls: item['imageUrls'],
  149. ),
  150. ),
  151. const SizedBox(height: 26),
  152. // // 卡片底部 (点赞 评论 分享)
  153. NewsFeedCardFooter(
  154. key: UniqueKey(),
  155. isLike: item['isLike'],
  156. onLike: (){
  157. vm.handlerClickActionBtn('like', item);
  158. },
  159. onComment: (){
  160. vm.handlerClickActionBtn('comments', item);
  161. },
  162. onShare: (){
  163. vm.handlerClickActionBtn('share', item);
  164. },
  165. ),
  166. ]
  167. ),
  168. ),
  169. // 右上角 关注/取消关注 按钮
  170. Visibility(
  171. visible: !item['isFollow'],
  172. child: Positioned(
  173. right: 40,
  174. top: 35,
  175. child: Container(
  176. width: 83.5,
  177. height: 45.5,
  178. alignment: Alignment.center,
  179. // decoration: BoxDecoration(
  180. // color: ColorUtils.string2Color('#4161D0'),
  181. // borderRadius: BorderRadius.circular(5),
  182. // ),
  183. child: MyButton(
  184. text: '+Follow',
  185. textColor: Colors.white,
  186. backgroundColor: ColorUtils.string2Color('#4161D0'),
  187. radius: 8,
  188. minHeight: 27.5,
  189. padding: const EdgeInsets.only(left: 5, right: 5,top:9,bottom:9),
  190. fontWeight: FontWeight.w400,
  191. fontSize: 14,
  192. onPressed: (){
  193. // Navigator.pop(context);
  194. },
  195. ),
  196. )
  197. ),
  198. )
  199. ],
  200. ),
  201. ).onTap((){
  202. vm.handlerClickActionBtn(null, item);
  203. });
  204. }
  205. Widget _buildNewsFeedList(BuildContext context, WidgetRef ref, vm){
  206. final itemList = vm.state.list?? [];
  207. if(itemList.isEmpty){
  208. return const Center(child: Text('No Data'));
  209. }else {
  210. List itemsList = vm.state.list.toList();
  211. return ListView.builder(
  212. key: UniqueKey(),
  213. itemCount: itemsList.length,
  214. itemBuilder: (context, index) {
  215. return _buildNewsItem(context, ref, itemsList[index], vm);
  216. },
  217. );
  218. }
  219. // return Text("879424");
  220. }
  221. }