|
@@ -1,126 +0,0 @@
|
|
|
-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:flutter/material.dart';
|
|
|
-import 'package:auto_route/auto_route.dart';
|
|
|
-import 'package:flutter_hooks/flutter_hooks.dart';
|
|
|
-import 'package:hooks_riverpod/hooks_riverpod.dart';
|
|
|
-import 'package:router/ext/auto_router_extensions.dart';
|
|
|
-import 'package:shared/utils/color_utils.dart';
|
|
|
-import 'package:shared/utils/log_utils.dart';
|
|
|
-import 'package:widgets/my_load_image.dart';
|
|
|
-import 'package:widgets/ext/ex_widget.dart';
|
|
|
-import 'package:widgets/my_text_view.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_vm.dart';
|
|
|
-
|
|
|
-class CustomTabs extends HookConsumerWidget {
|
|
|
- List tabsList;
|
|
|
- Widget? Function(BuildContext)? tabItemBuilder;
|
|
|
- VoidCallback? onClickAction;
|
|
|
- CustomTabs({
|
|
|
- Key? key,
|
|
|
- required this.tabsList,
|
|
|
- this.onClickAction,
|
|
|
- this.tabItemBuilder
|
|
|
- }) : super(key: key);
|
|
|
-
|
|
|
- Widget _buildTabItem(BuildContext context, WidgetRef ref, vm, item, index) {
|
|
|
- // 监听 activeIndex 的变化
|
|
|
- final activeTabIndex = ref.watch(customTabsVmProvider.select((state) => state.activeTabIndex));
|
|
|
- // final activeTabItemIndex = item['active'];
|
|
|
-
|
|
|
-
|
|
|
- return Container(
|
|
|
- width: MediaQuery.of(context).size.width / vm.state.tabsList.length - 30,
|
|
|
- height: 43,
|
|
|
- padding: const EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10),
|
|
|
- decoration: index==activeTabIndex? BoxDecoration(
|
|
|
- color: index==activeTabIndex? context.appColors.btnBgDefault: ColorUtils.string2Color("#F2F3F6"),
|
|
|
- borderRadius: BorderRadius.circular(20),
|
|
|
- boxShadow: [
|
|
|
- BoxShadow(
|
|
|
- color: Colors.grey.withOpacity(0.5),
|
|
|
- spreadRadius: 1,
|
|
|
- blurRadius: 5,
|
|
|
- offset: const Offset(0, 2), // changes position of shadow
|
|
|
- ),
|
|
|
- ],
|
|
|
- ): null,
|
|
|
- child: Row(
|
|
|
- children: [
|
|
|
- Expanded(
|
|
|
- child: Container(
|
|
|
- alignment: Alignment.center,
|
|
|
- child: MyTextView(
|
|
|
- item['title'],
|
|
|
- fontSize: 16,
|
|
|
- textAlign: TextAlign.center,
|
|
|
- isFontMedium: true,
|
|
|
- textColor: index == activeTabIndex ? Colors.white :ColorUtils.string2Color("#000000"),
|
|
|
- ),
|
|
|
- ),
|
|
|
- ),
|
|
|
- ],
|
|
|
- ),
|
|
|
- ).onTap((){
|
|
|
- vm.handlerClickTab(index, item);
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- 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;
|
|
|
-
|
|
|
- print("000328942424----${tabsList}");
|
|
|
-
|
|
|
- return List.generate(tabsLength, (index) {
|
|
|
- return _buildTabItem(context, ref, vm, tabsList[index], index);
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- @override
|
|
|
- Widget build(BuildContext context, WidgetRef ref) {
|
|
|
- final vm = ref.watch(customTabsVmProvider.notifier);
|
|
|
- // 使用useEffect钩子
|
|
|
- useEffect(() {
|
|
|
- print('副作用函数执行');
|
|
|
- // 这里是副作用逻辑
|
|
|
- vm.initPropData(tabsList, tabItemBuilder, onClickAction);
|
|
|
- // 返回清理函数
|
|
|
- return () {
|
|
|
- print('清理函数执行');
|
|
|
- };
|
|
|
- }, []); // 空依赖列表意味着这个副作用只在组件挂载时执行一次
|
|
|
-
|
|
|
- return SingleChildScrollView(
|
|
|
- scrollDirection: Axis.horizontal,
|
|
|
- physics: const BouncingScrollPhysics(),
|
|
|
- clipBehavior: Clip.none,
|
|
|
- child: Row(
|
|
|
- mainAxisSize: MainAxisSize.max,
|
|
|
- mainAxisAlignment: MainAxisAlignment.center,
|
|
|
- children: _buildTabs(context, ref, vm, tabsList),
|
|
|
- ).constrained(
|
|
|
- maxWidth: MediaQuery.of(context).size.width
|
|
|
- ),
|
|
|
- );
|
|
|
- }
|
|
|
-}
|