|
@@ -1,8 +1,10 @@
|
|
import 'package:cpt_community/components/custom_tabs_state.dart';
|
|
import 'package:cpt_community/components/custom_tabs_state.dart';
|
|
import 'package:cpt_community/components/custom_tabs_state.dart';
|
|
import 'package:cpt_community/components/custom_tabs_state.dart';
|
|
|
|
+import 'package:cpt_community/modules/newsfeed/newsfeed_vm.dart';
|
|
import 'package:cs_resources/theme/app_colors_theme.dart';
|
|
import 'package:cs_resources/theme/app_colors_theme.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:auto_route/auto_route.dart';
|
|
import 'package:auto_route/auto_route.dart';
|
|
|
|
+import 'package:flutter_hooks/flutter_hooks.dart';
|
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
|
import 'package:router/ext/auto_router_extensions.dart';
|
|
import 'package:router/ext/auto_router_extensions.dart';
|
|
import 'package:shared/utils/color_utils.dart';
|
|
import 'package:shared/utils/color_utils.dart';
|
|
@@ -12,29 +14,34 @@ import 'package:widgets/ext/ex_widget.dart';
|
|
import 'package:widgets/my_text_view.dart';
|
|
import 'package:widgets/my_text_view.dart';
|
|
import 'package:widgets/my_appbar.dart';
|
|
import 'package:widgets/my_appbar.dart';
|
|
|
|
|
|
|
|
+import '../modules/community/community_vm.dart';
|
|
|
|
+import '../modules/garagesale/garagesale_vm.dart';
|
|
import 'custom_tabs_state.dart';
|
|
import 'custom_tabs_state.dart';
|
|
import 'custom_tabs_vm.dart';
|
|
import 'custom_tabs_vm.dart';
|
|
|
|
|
|
-
|
|
|
|
class CustomTabs extends HookConsumerWidget {
|
|
class CustomTabs extends HookConsumerWidget {
|
|
List tabsList;
|
|
List tabsList;
|
|
- int activeIndex = 0;
|
|
|
|
Widget? Function(BuildContext)? tabItemBuilder;
|
|
Widget? Function(BuildContext)? tabItemBuilder;
|
|
VoidCallback? onClickAction;
|
|
VoidCallback? onClickAction;
|
|
- CustomTabs({Key? key, required this.tabsList, required this.activeIndex, this.onClickAction, this.tabItemBuilder}) :
|
|
|
|
- super(key: key);
|
|
|
|
|
|
+ CustomTabs({
|
|
|
|
+ Key? key,
|
|
|
|
+ required this.tabsList,
|
|
|
|
+ this.onClickAction,
|
|
|
|
+ this.tabItemBuilder
|
|
|
|
+ }) : super(key: key);
|
|
|
|
|
|
Widget _buildTabItem(BuildContext context, WidgetRef ref, vm, item, index) {
|
|
Widget _buildTabItem(BuildContext context, WidgetRef ref, vm, item, index) {
|
|
-
|
|
|
|
// 监听 activeIndex 的变化
|
|
// 监听 activeIndex 的变化
|
|
- final activeIndex = ref.watch(customTabsVmProvider.select((state) => state.activeIndex));
|
|
|
|
|
|
+ final activeTabIndex = ref.watch(customTabsVmProvider.select((state) => state.activeTabIndex));
|
|
|
|
+ // final activeTabItemIndex = item['active'];
|
|
|
|
+
|
|
|
|
|
|
return Container(
|
|
return Container(
|
|
width: MediaQuery.of(context).size.width / vm.state.tabsList.length - 30,
|
|
width: MediaQuery.of(context).size.width / vm.state.tabsList.length - 30,
|
|
height: 43,
|
|
height: 43,
|
|
padding: const EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10),
|
|
padding: const EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10),
|
|
- decoration: index==activeIndex? BoxDecoration(
|
|
|
|
- color: index==activeIndex? context.appColors.btnBgDefault: ColorUtils.string2Color("#F2F3F6"),
|
|
|
|
|
|
+ decoration: index==activeTabIndex? BoxDecoration(
|
|
|
|
+ color: index==activeTabIndex? context.appColors.btnBgDefault: ColorUtils.string2Color("#F2F3F6"),
|
|
borderRadius: BorderRadius.circular(20),
|
|
borderRadius: BorderRadius.circular(20),
|
|
boxShadow: [
|
|
boxShadow: [
|
|
BoxShadow(
|
|
BoxShadow(
|
|
@@ -55,7 +62,7 @@ class CustomTabs extends HookConsumerWidget {
|
|
fontSize: 16,
|
|
fontSize: 16,
|
|
textAlign: TextAlign.center,
|
|
textAlign: TextAlign.center,
|
|
isFontMedium: true,
|
|
isFontMedium: true,
|
|
- textColor: index == activeIndex ? Colors.white :ColorUtils.string2Color("#000000"),
|
|
|
|
|
|
+ textColor: index == activeTabIndex ? Colors.white :ColorUtils.string2Color("#000000"),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
@@ -66,10 +73,24 @@ class CustomTabs extends HookConsumerWidget {
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
- List<Widget> _buildTabs(BuildContext context, WidgetRef ref, vm){
|
|
|
|
- tabsList = vm.state.tabsList;
|
|
|
|
|
|
+ List<Widget> _buildTabs(BuildContext context, WidgetRef ref, vm, tablist){
|
|
|
|
+
|
|
|
|
+ int currentUseTag = ref.watch(customTabsVmProvider.select((state) => state.useTag!));
|
|
|
|
|
|
|
|
+ ref.listen(customTabsVmProvider.select((state) => state.useTag), (previous, next) {
|
|
|
|
+ // 设置当前的 tabsList
|
|
|
|
+ if(next == 1){
|
|
|
|
+ // Garage Sale
|
|
|
|
+ List tabsList = ref.read(newsfeedVmProvider).tabsList;
|
|
|
|
+ }else if(next == 0){
|
|
|
|
+ List tabsList = ref.read(garagesaleVmProvider).tabsList;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ });
|
|
int tabsLength = tabsList.length;
|
|
int tabsLength = tabsList.length;
|
|
|
|
+
|
|
|
|
+ print("000328942424----${tabsList}");
|
|
|
|
+
|
|
return List.generate(tabsLength, (index) {
|
|
return List.generate(tabsLength, (index) {
|
|
return _buildTabItem(context, ref, vm, tabsList[index], index);
|
|
return _buildTabItem(context, ref, vm, tabsList[index], index);
|
|
});
|
|
});
|
|
@@ -77,11 +98,17 @@ class CustomTabs extends HookConsumerWidget {
|
|
|
|
|
|
@override
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
- final vm = ref.read(customTabsVmProvider.notifier);
|
|
|
|
- // 初始化状态,只在第一次构建时执行
|
|
|
|
- if (vm.state.tabsList!.isEmpty) {
|
|
|
|
- vm.initPropData(tabsList, activeIndex, tabItemBuilder, onClickAction);
|
|
|
|
- }
|
|
|
|
|
|
+ final vm = ref.watch(customTabsVmProvider.notifier);
|
|
|
|
+ // 使用useEffect钩子
|
|
|
|
+ useEffect(() {
|
|
|
|
+ print('副作用函数执行');
|
|
|
|
+ // 这里是副作用逻辑
|
|
|
|
+ vm.initPropData(tabsList, tabItemBuilder, onClickAction);
|
|
|
|
+ // 返回清理函数
|
|
|
|
+ return () {
|
|
|
|
+ print('清理函数执行');
|
|
|
|
+ };
|
|
|
|
+ }, []); // 空依赖列表意味着这个副作用只在组件挂载时执行一次
|
|
|
|
|
|
return SingleChildScrollView(
|
|
return SingleChildScrollView(
|
|
scrollDirection: Axis.horizontal,
|
|
scrollDirection: Axis.horizontal,
|
|
@@ -90,7 +117,7 @@ class CustomTabs extends HookConsumerWidget {
|
|
child: Row(
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.max,
|
|
mainAxisSize: MainAxisSize.max,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
- children: _buildTabs(context, ref, vm),
|
|
|
|
|
|
+ children: _buildTabs(context, ref, vm, tabsList),
|
|
).constrained(
|
|
).constrained(
|
|
maxWidth: MediaQuery.of(context).size.width
|
|
maxWidth: MediaQuery.of(context).size.width
|
|
),
|
|
),
|