UI

ios/Runner.xcodeproj/project.pbxproj

@@ -874,7 +874,7 @@
 				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = NO;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 33;
+				CURRENT_PROJECT_VERSION = 34;
 				DEVELOPMENT_TEAM = YF3Q8DVP52;
 				ENABLE_BITCODE = NO;
 				FRAMEWORK_SEARCH_PATHS = (
@@ -924,7 +924,7 @@
 					"$(PROJECT_DIR)/baidu",
 					"$(PROJECT_DIR)/Runner/baidu",
 				);
-				MARKETING_VERSION = 1.0.33;
+				MARKETING_VERSION = 1.0.34;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_LDFLAGS = (
 					"$(inherited)",
@@ -1110,7 +1110,7 @@
 				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = NO;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 33;
+				CURRENT_PROJECT_VERSION = 34;
 				DEVELOPMENT_TEAM = YF3Q8DVP52;
 				ENABLE_BITCODE = NO;
 				FRAMEWORK_SEARCH_PATHS = (
@@ -1160,7 +1160,7 @@
 					"$(PROJECT_DIR)/baidu",
 					"$(PROJECT_DIR)/Runner/baidu",
 				);
-				MARKETING_VERSION = 1.0.33;
+				MARKETING_VERSION = 1.0.34;
 				ONLY_ACTIVE_ARCH = YES;
 				OTHER_LDFLAGS = (
 					"$(inherited)",
@@ -1239,7 +1239,7 @@
 				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = NO;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 33;
+				CURRENT_PROJECT_VERSION = 34;
 				DEVELOPMENT_TEAM = YF3Q8DVP52;
 				ENABLE_BITCODE = NO;
 				FRAMEWORK_SEARCH_PATHS = (
@@ -1289,7 +1289,7 @@
 					"$(PROJECT_DIR)/baidu",
 					"$(PROJECT_DIR)/Runner/baidu",
 				);
-				MARKETING_VERSION = 1.0.33;
+				MARKETING_VERSION = 1.0.34;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_LDFLAGS = (
 					"$(inherited)",

lib/article/hot_article_item.dart

@@ -111,11 +111,11 @@ class _HotArticlePage extends State<HotArticlePage> {
             scrollDirection: Axis.vertical,
             itemBuilder: (context, position) {
               return AspectRatio(
-                aspectRatio: 2.47,
+                aspectRatio: position == 0 ? 1.38 : 3.56,
                 child: Container(
-                  height: 130.h,
-                  margin: EdgeInsets.symmetric(vertical: 8, horizontal: 16),
-                  child: HotArticleItem(article: articles[position]),
+                  height: position == 0 ? 247.h : 96.h,
+                  margin: EdgeInsets.symmetric(vertical: 6.h, horizontal: 16.w),
+                  child: HotArticleItem(article: articles[position], isHot: position == 0),
                 ),
               );
             },

lib/home/huixiang_brand_page.dart

@@ -10,6 +10,7 @@ import 'package:huixiang/generated/l10n.dart';
 import 'package:huixiang/main.dart';
 import 'package:huixiang/retrofit/data/banner.dart';
 import 'package:huixiang/retrofit/data/base_data.dart';
+import 'package:huixiang/retrofit/data/brand.dart';
 import 'package:huixiang/retrofit/data/brand_data.dart';
 import 'package:huixiang/retrofit/retrofit_api.dart';
 import 'package:huixiang/utils/MyPainter.dart';
@@ -32,14 +33,13 @@ class _BrandPage extends State<BrandPage>
     with SingleTickerProviderStateMixin, AutomaticKeepAliveClientMixin {
   ScrollController scrollController = ScrollController();
 
-  GlobalKey chiliGlobalKey = GlobalKey();
-  GlobalKey milkTeaGlobalKey = GlobalKey();
-  GlobalKey breadGlobalKey = GlobalKey();
-
   ApiService apiService;
+  List<Brand> brands = [];
   BrandData brandData;
+  List<GlobalKey> globaKeys = [];
   List<BannerData> bannerData = [];
-  List<String> brandText = [];
+
+  // List<String> brandText = [];
   var isShowMore = false;
 
   queryHome() async {
@@ -56,10 +56,29 @@ class _BrandPage extends State<BrandPage>
         .map((e) => BannerData.fromJson(e))
         .toList());
 
+    BaseData brand = await apiService.queryHomeBrand().catchError((onError) {
+      refreshController.refreshFailed();
+    }).catchError((onError) {
+      refreshController.refreshFailed();
+    });
+    if (brand != null && brand.isSuccess) {
+      brands.clear();
+      globaKeys.clear();
+      brands.addAll((brand.data["brandList"] as List<dynamic>)
+          .map((e) => Brand.fromJson(e))
+          .toList());
+      brands.forEach((element) {
+        globaKeys.add(GlobalKey());
+      });
+      setState(() {});
+    } else {
+      refreshController.refreshFailed();
+    }
+
     if (baseData != null && baseData.isSuccess) {
       refreshController.refreshCompleted();
       brandData = BrandData.fromJson(baseData.data);
-      brandText = (brandData.contents as Map<String, dynamic>).keys.toList();
+      // brandText = (brandData.contents as Map<String, dynamic>).keys.toList();
       setState(() {});
     } else {
       refreshController.refreshFailed();
@@ -99,40 +118,47 @@ class _BrandPage extends State<BrandPage>
         padding: EdgeInsets.only(bottom: 76.h),
         child: Stack(
           children: [
-            Container(
-              child: SmartRefresher(
-                controller: refreshController,
-                enablePullDown: true,
-                enablePullUp: false,
-                header: MyHeader(),
-                physics: ClampingScrollPhysics(),
-                onRefresh: queryHome,
-                scrollController: scrollController,
-                child: Container(
-                  child: SingleChildScrollView(
-                    physics: NeverScrollableScrollPhysics(),
-                    child: Container(
-                      color: Color(0xFFF7F7F7),
-                      margin: EdgeInsets.only(top: 16.h),
-                      child: Column(
-                        children: homeChildItem(),
+            Positioned(
+              child: Container(
+                child: SmartRefresher(
+                  controller: refreshController,
+                  enablePullDown: true,
+                  enablePullUp: false,
+                  header: MyHeader(),
+                  physics: ClampingScrollPhysics(),
+                  onRefresh: queryHome,
+                  scrollController: scrollController,
+                  child: Container(
+                    child: SingleChildScrollView(
+                      physics: NeverScrollableScrollPhysics(),
+                      child: Container(
+                        color: Color(0xFFF7F7F7),
+                        margin: EdgeInsets.only(top: 16.h),
+                        child: Column(
+                          children: homeChildItem(),
+                        ),
                       ),
                     ),
                   ),
                 ),
               ),
-            ),
-            Positioned(
-              child: StoreTitleTab(
-                brandText,
-                scrollController: scrollController,
-                chiliGlobalKey: chiliGlobalKey,
-                milkTeaGlobalKey: milkTeaGlobalKey,
-                breadGlobalKey: breadGlobalKey,
-                isScroll: true,
-              ),
+              bottom: 0,
               top: 0,
+              left: 0,
+              right: 0,
             ),
+            if (brands != null && brands.length > 0)
+              Positioned(
+                child: StoreTitleTab(
+                  brands,
+                  globaKeys,
+                  scrollController,
+                  isScroll: true,
+                ),
+                top: 0,
+                left: 0,
+                right: 0,
+              ),
           ],
         ),
       ),
@@ -144,36 +170,28 @@ class _BrandPage extends State<BrandPage>
       banner(),
       buildInfo(),
       StoreTitleTab(
-        brandText,
-        scrollController: scrollController,
-        chiliGlobalKey: chiliGlobalKey,
-        milkTeaGlobalKey: milkTeaGlobalKey,
-        breadGlobalKey: breadGlobalKey,
+        brands,
+        globaKeys,
+        scrollController,
         isScroll: false,
       )
     ];
-    if (brandData == null) return widgets;
-    (brandData.contents as Map<String, dynamic>).forEach((key, value) {
+    if (brands == null) return widgets;
+    brands.forEach((value) {
       widgets.add(Container(
-        key: key == "百年川椒"
-            ? chiliGlobalKey
-            : (key == "前进麦味" ? breadGlobalKey : milkTeaGlobalKey),
+        key: globaKeys[brands.indexOf(value)],
         child: Container(
           color: Colors.white,
           child: Html(
-            data: value,
+            data: value.content,
             customImageRenders: {
               base64DataUriMatcher(): base64ImageRender(),
               assetUriMatcher(): assetImageRender(),
               networkSourceMatcher(extension: "svg"): svgNetworkImageRender(),
               networkSourceMatcher(): networkImageRender(
-                  loadingWidget: () {
-                return Container();
-              },
-                // mapUrl: (url) {
-                //     print("objectUrl: $url");
-                //     return "$url?imageMogr2/format/webp/blur/1x0/quality/75";
-                // }
+                loadingWidget: () {
+                  return Container();
+                },
               ),
             },
           ),

lib/retrofit/data/article.dart

@@ -67,6 +67,10 @@ class Article {
     _likes = value;
   }
 
+  set viewers(int value) {
+    _viewers = value;
+  }
+
   Article({
       String id, 
       String createTime, 

lib/retrofit/data/brand.dart

@@ -12,6 +12,7 @@ class Brand {
   String _video;
   String _desc;
   String _content;
+  String _icon;
   int _sort;
   String _storeId;
 
@@ -20,6 +21,7 @@ class Brand {
   String get video => _video;
   String get desc => _desc;
   String get content => _content;
+  String get icon => _icon;
   int get sort => _sort;
   String get storeId => _storeId;
 
@@ -36,6 +38,7 @@ class Brand {
     _video = video;
     _desc = desc;
     _content = content;
+    _icon = icon;
     _sort = sort;
     _storeId = storeId;
 }
@@ -46,6 +49,7 @@ class Brand {
     _video = json["video"];
     _desc = json["desc"];
     _content = json["content"];
+    _icon = json["icon"];
     _sort = json["sort"];
     _storeId = json["storeId"];
   }

lib/view_widget/hot_item.dart

@@ -9,26 +9,41 @@ import 'package:huixiang/view_widget/custom_image.dart';
 import 'package:huixiang/view_widget/icon_text.dart';
 import 'package:huixiang/view_widget/round_button.dart';
 
-class HotArticleItem extends StatelessWidget {
+class HotArticleItem extends StatefulWidget {
   final Article article;
   final bool isHot;
 
   HotArticleItem({this.article, this.isHot});
 
+  @override
+  State<StatefulWidget> createState() {
+    return _HotArticleItem();
+  }
+
+}
+
+class _HotArticleItem extends State<HotArticleItem> {
+
   @override
   Widget build(BuildContext context) {
     return GestureDetector(
       onTap: () {
-        Navigator.of(context).pushNamed('/router/store_detail_page',
-            arguments: {"articleId": article.id});
+        click();
       },
       child: hotItem(context),
     );
   }
 
+  click() async {
+    await Navigator.of(context).pushNamed('/router/store_detail_page',
+        arguments: {"articleId": widget.article.id});
+    widget.article.viewers = (widget.article.viewers + 1);
+    setState(() {});
+  }
+
   Widget hotItem(BuildContext context) {
     return Container(
-      padding: EdgeInsets.all((isHot == null || !isHot) ? 8 : 0),
+      padding: EdgeInsets.all((widget.isHot == null || !widget.isHot) ? 8 : 0),
       decoration: BoxDecoration(
         color: Colors.white,
         boxShadow: [
@@ -41,48 +56,48 @@ class HotArticleItem extends StatelessWidget {
         ],
         borderRadius: BorderRadius.circular(4),
       ),
-      child: (isHot == null || !isHot)
+      child: (widget.isHot == null || !widget.isHot)
           ? Row(
+        children: [
+          Visibility(
+            visible: widget.article != null &&
+                widget.article.coverImg != null &&
+                widget.article.coverImg != "",
+            child: Stack(
+              alignment: Alignment.center,
               children: [
-                Visibility(
-                  visible: article != null &&
-                      article.coverImg != null &&
-                      article.coverImg != "",
-                  child: Stack(
-                    alignment: Alignment.center,
-                    children: [
-                      MImage(
-                        article != null ? article.coverImg : "",
-                        fit: BoxFit.cover,
-                        radius: BorderRadius.circular(2),
-                        aspectRatio: 1,
-                        errorSrc: "assets/image/default_1.png",
-                        fadeSrc: "assets/image/default_1.png",
-                      ),
-                      Visibility(
-                        visible: (article != null &&
-                            article.coverImg != "" &&
-                            article.coverImg.endsWith(".mp4")),
-                        child: Icon(
-                          Icons.play_circle_outline,
-                          size: 24,
-                          color: Colors.white,
-                        ),
-                      ),
-                    ],
-                  ),
+                MImage(
+                  widget.article != null ? widget.article.coverImg : "",
+                  fit: BoxFit.cover,
+                  radius: BorderRadius.circular(2),
+                  aspectRatio: 1,
+                  errorSrc: "assets/image/default_1.png",
+                  fadeSrc: "assets/image/default_1.png",
                 ),
-                Expanded(
-                  child: Container(
-                    margin: EdgeInsets.only(left: 8.w),
-                    child: articleText(context),
+                Visibility(
+                  visible: (widget.article != null &&
+                      widget.article.coverImg != "" &&
+                      widget.article.coverImg.endsWith(".mp4")),
+                  child: Icon(
+                    Icons.play_circle_outline,
+                    size: 24,
+                    color: Colors.white,
                   ),
                 ),
               ],
-            )
-          : Column(
-              children: articleContent(context),
             ),
+          ),
+          Expanded(
+            child: Container(
+              margin: EdgeInsets.only(left: 8.w),
+              child: articleText(context),
+            ),
+          ),
+        ],
+      )
+          : Column(
+        children: articleContent(context),
+      ),
     );
   }
 
@@ -94,48 +109,48 @@ class HotArticleItem extends StatelessWidget {
         Column(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
-            (isHot == null || !isHot)
+            (widget.isHot == null || !widget.isHot)
                 ? Text(
-                    article != null ? article.mainTitle : "",
-                    maxLines: 1,
-                    overflow: TextOverflow.ellipsis,
-                    style: TextStyle(
-                      fontWeight: FontWeight.w600,
-                      fontSize: 14.sp,
-                      color: Colors.black,
-                    ),
-                  )
+              widget.article != null ? widget.article.mainTitle : "",
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+              style: TextStyle(
+                fontWeight: FontWeight.w600,
+                fontSize: 14.sp,
+                color: Colors.black,
+              ),
+            )
                 : Row(
-                    children: [
-                      RoundButton(
-                        text: "HOT",
-                        textColor: Colors.white,
-                        backgroup: Color(0xFFFF441A),
-                        radius: 2,
-                        fontSize: 10.sp,
-                        fontWeight: MyFontWeight.medium,
-                        padding: EdgeInsets.all(2),
-                      ),
-                      SizedBox(
-                        width: 6.w,
-                      ),
-                      Text(
-                        article != null ? article.mainTitle : "",
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                        style: TextStyle(
-                          fontWeight: FontWeight.w600,
-                          fontSize: 14.sp,
-                          color: Colors.black,
-                        ),
-                      ),
-                    ],
+              children: [
+                RoundButton(
+                  text: "HOT",
+                  textColor: Colors.white,
+                  backgroup: Color(0xFFFF441A),
+                  radius: 2,
+                  fontSize: 10.sp,
+                  fontWeight: MyFontWeight.medium,
+                  padding: EdgeInsets.all(2),
+                ),
+                SizedBox(
+                  width: 6.w,
+                ),
+                Text(
+                  widget.article != null ? widget.article.mainTitle : "",
+                  maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
+                  style: TextStyle(
+                    fontWeight: FontWeight.w600,
+                    fontSize: 14.sp,
+                    color: Colors.black,
                   ),
+                ),
+              ],
+            ),
             SizedBox(
               height: 4.h,
             ),
             Text(
-              article != null ? (article.viceTitle ?? "") : "",
+              widget.article != null ? (widget.article.viceTitle ?? "") : "",
               maxLines: AppUtils.textScale(context) > 1.05 ? 1 : 2,
               overflow: TextOverflow.ellipsis,
               style: TextStyle(
@@ -155,8 +170,8 @@ class HotArticleItem extends StatelessWidget {
                 children: [
                   Text(
                     S.of(context).zuozhe(
-                        (article != null && article.author != null)
-                            ? article.author.name
+                        (widget.article != null && widget.article.author != null)
+                            ? widget.article.author.name
                             : ""),
                     style: TextStyle(
                       fontSize: 10.sp,
@@ -177,7 +192,7 @@ class HotArticleItem extends StatelessWidget {
                           height: 16.h,
                         ),
                         Text(
-                          (article != null) ? "${article.likes}" : "",
+                          (widget.article != null) ? "${widget.article.likes}" : "",
                           style: TextStyle(
                             fontSize: 10.sp,
                             color: Color(0xFFB2B2B2),
@@ -199,7 +214,7 @@ class HotArticleItem extends StatelessWidget {
                           height: 16.h,
                         ),
                         Text(
-                          (article != null) ? "${article.viewers}" : "",
+                          (widget.article != null) ? "${widget.article.viewers}" : "",
                           style: TextStyle(
                             fontSize: 10.sp,
                             color: Color(0xFFB2B2B2),
@@ -213,7 +228,7 @@ class HotArticleItem extends StatelessWidget {
               flex: 1,
             ),
             IconText(
-              article != null ? (article.createTime.split(" ")[0]) : "",
+              widget.article != null ? (widget.article.createTime.split(" ")[0]) : "",
               textStyle: TextStyle(
                 fontSize: 10.sp,
                 fontWeight: FontWeight.w400,
@@ -233,15 +248,15 @@ class HotArticleItem extends StatelessWidget {
     return [
       Expanded(
         child: Visibility(
-          visible: article != null &&
-              article.coverImg != null &&
-              article.coverImg != "",
+          visible: widget.article != null &&
+              widget.article.coverImg != null &&
+              widget.article.coverImg != "",
           child: Stack(
             alignment: Alignment.center,
             children: [
               Positioned(
                 child: MImage(
-                  article != null ? article.coverImg : "",
+                  widget.article != null ? widget.article.coverImg : "",
                   fit: BoxFit.cover,
                   radius: BorderRadius.circular(4),
                   width: MediaQuery.of(context).size.width - 32.w,
@@ -254,9 +269,9 @@ class HotArticleItem extends StatelessWidget {
               ),
               Positioned(
                 child: Visibility(
-                  visible: (article != null &&
-                      article.coverImg != "" &&
-                      article.coverImg.endsWith(".mp4")),
+                  visible: (widget.article != null &&
+                      widget.article.coverImg != "" &&
+                      widget.article.coverImg.endsWith(".mp4")),
                   child: Center(
                     child: Icon(
                       Icons.play_circle_outline,
@@ -284,4 +299,6 @@ class HotArticleItem extends StatelessWidget {
       ),
     ];
   }
+
+
 }

lib/view_widget/store_title_tab.dart

@@ -1,23 +1,22 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:huixiang/retrofit/data/brand.dart';
 import 'package:huixiang/view_widget/icon_text.dart';
 
 class StoreTitleTab extends StatefulWidget {
   final ScrollController scrollController;
-  final List<String> brandText;
-
-  final GlobalKey chiliGlobalKey;
-  final GlobalKey milkTeaGlobalKey;
-  final GlobalKey breadGlobalKey;
+  final List<Brand> brands;
 
+  final List<GlobalKey> globaKeys;
   final bool isScroll;
 
-  StoreTitleTab(this.brandText,
-      {this.scrollController,
-      this.chiliGlobalKey,
-      this.milkTeaGlobalKey,
-      this.breadGlobalKey, this.isScroll = false});
+  StoreTitleTab(this.brands,
+      this.globaKeys,
+      this.scrollController,
+      {
+      this.isScroll = false,
+      });
 
   @override
   State<StatefulWidget> createState() {
@@ -30,28 +29,20 @@ class _StoreTitleTab extends State<StoreTitleTab> {
   int selectedIndex1 = -1;
   bool isVisible = false;
 
-  List<String> images = [
-    "assets/image/icon_chili.webp",
-    "assets/image/icon_milk_tea.webp",
-    "assets/image/icon_bread.webp",
-  ];
-
   @override
   void initState() {
     super.initState();
 
-    if (widget.scrollController != null) {
+    print("firstOffset: ${widget.globaKeys}");
+    print("firstOffset: ${widget.brands}");
+    if (widget.scrollController != null && widget.globaKeys != null && widget.globaKeys.length > 0) {
       widget.scrollController?.addListener(() {
-        RenderBox chiliRenderBox = widget.chiliGlobalKey.currentContext.findRenderObject();
-        RenderBox milkTeaRenderBox = widget.milkTeaGlobalKey.currentContext.findRenderObject();
-        RenderBox breadRenderBox = widget.breadGlobalKey.currentContext.findRenderObject();
-
-        Offset chiliOffset = chiliRenderBox?.localToGlobal(Offset.zero);
-        Offset milkTeaOffset = milkTeaRenderBox?.localToGlobal(Offset.zero);
-        Offset breadOffset = breadRenderBox?.localToGlobal(Offset.zero);
-
+        if (widget.globaKeys[0].currentContext == null) return;
+        RenderBox firstRenderBox = widget.globaKeys[0].currentContext.findRenderObject();
+        Offset first = firstRenderBox?.localToGlobal(Offset.zero);
+        print("firstOffset: ${first.dy}");
         var top = 96.h;
-        if (chiliOffset.dy <= top) {
+        if (first.dy <= top) {
           if (!isVisible) {
             isVisible = true;
             setState(() {});
@@ -62,31 +53,65 @@ class _StoreTitleTab extends State<StoreTitleTab> {
           if (b) setState(() {});
           selectedIndex = -1;
         }
-        if (chiliOffset.dy <= top && breadOffset.dy > top) {
-          selectedIndex = 0;
-          if (selectedIndex1 != selectedIndex) {
-            setState(() {
-              print("object：$selectedIndex");
-            });
-            selectedIndex1 = selectedIndex;
-          }
-        } else if (breadOffset.dy <= top && milkTeaOffset.dy > top) {
-          selectedIndex = 1;
-          if (selectedIndex1 != selectedIndex) {
-            setState(() {
-              print("object：$selectedIndex");
-            });
-            selectedIndex1 = selectedIndex;
-          }
-        } else if (milkTeaOffset.dy <= top) {
-          selectedIndex = 2;
-          if (selectedIndex1 != selectedIndex) {
-            setState(() {
-              print("object：$selectedIndex");
-            });
-            selectedIndex1 = selectedIndex;
+
+        widget.globaKeys.forEach((element) {
+          if (widget.globaKeys.indexOf(element) < (widget.globaKeys.length - 1)) {
+            if (element.currentContext == null) return;
+            RenderBox renderBox = element.currentContext.findRenderObject();
+            Offset offset = renderBox?.localToGlobal(Offset.zero);
+            RenderBox nextRenderBox = element.currentContext.findRenderObject();
+            Offset nextOffset = nextRenderBox?.localToGlobal(Offset.zero);
+            if (offset.dy <= top && nextOffset.dy > top) {
+              selectedIndex = widget.globaKeys.indexOf(element);
+              if (selectedIndex1 != selectedIndex) {
+                setState(() {
+                  print("object：$selectedIndex");
+                });
+                selectedIndex1 = selectedIndex;
+              }
+              return;
+            }
+          } else {
+            RenderBox lastRenderBox = element.currentContext.findRenderObject();
+            Offset lastOffset = lastRenderBox?.localToGlobal(Offset.zero);
+            if (lastOffset.dy <= top) {
+              selectedIndex = widget.globaKeys.indexOf(element);
+              if (selectedIndex1 != selectedIndex) {
+                setState(() {
+                  print("object：$selectedIndex");
+                });
+                selectedIndex1 = selectedIndex;
+              }
+              return;
+            }
           }
-        }
+        });
+
+        // if (chiliOffset.dy <= top && breadOffset.dy > top) {
+        //   selectedIndex = 0;
+        //   if (selectedIndex1 != selectedIndex) {
+        //     setState(() {
+        //       print("object：$selectedIndex");
+        //     });
+        //     selectedIndex1 = selectedIndex;
+        //   }
+        // } else if (breadOffset.dy <= top && milkTeaOffset.dy > top) {
+        //   selectedIndex = 1;
+        //   if (selectedIndex1 != selectedIndex) {
+        //     setState(() {
+        //       print("object：$selectedIndex");
+        //     });
+        //     selectedIndex1 = selectedIndex;
+        //   }
+        // } else if (milkTeaOffset.dy <= top) {
+        //   selectedIndex = 2;
+        //   if (selectedIndex1 != selectedIndex) {
+        //     setState(() {
+        //       print("object：$selectedIndex");
+        //     });
+        //     selectedIndex1 = selectedIndex;
+        //   }
+        // }
       });
     }
   }
@@ -95,21 +120,23 @@ class _StoreTitleTab extends State<StoreTitleTab> {
   Widget build(BuildContext context) {
     return Visibility(
       visible: (!widget.isScroll) ? true : isVisible,
-      child: Container(
-        width: MediaQuery.of(context).size.width,
+      child: SingleChildScrollView(
+        physics: BouncingScrollPhysics(),
+        scrollDirection: Axis.horizontal,
         child: Container(
           height: 52.h,
+          constraints: BoxConstraints(minWidth: MediaQuery.of(context).size.width),
           color: Colors.white,
           padding: EdgeInsets.all(6),
           alignment: Alignment.center,
           child: Row(
             mainAxisAlignment: MainAxisAlignment.spaceAround,
             crossAxisAlignment: CrossAxisAlignment.center,
-            children: (widget.brandText == null || widget.brandText.isEmpty)
+            children: (widget.brands == null || widget.brands.length == 0)
                 ? []
-                : (widget.brandText.map((e) {
-                    return item(e, selectedIndex == widget.brandText.indexOf(e),
-                        widget.brandText.indexOf(e));
+                : (widget.brands.map((e) {
+                    return item(e, selectedIndex == widget.brands.indexOf(e),
+                        widget.brands.indexOf(e));
                   }).toList()),
           ),
         ),
@@ -117,53 +144,53 @@ class _StoreTitleTab extends State<StoreTitleTab> {
     );
   }
 
-  Widget item(text, isSelected, index) {
+  Widget item(Brand text, isSelected, index) {
     print("selectedIndex: $selectedIndex");
     return GestureDetector(
       onTap: () {
-        FlexParentData parendData;
-        if (index == 0) {
-          parendData = widget.chiliGlobalKey.currentContext
-              .findRenderObject()
-              .parentData;
-        } else if (index == 2) {
-          parendData = widget.milkTeaGlobalKey.currentContext
-              .findRenderObject()
-              .parentData;
-        } else if (index == 1) {
-          parendData = widget.breadGlobalKey.currentContext
-              .findRenderObject()
-              .parentData;
-        }
+        FlexParentData parendData = widget.globaKeys[index].currentContext
+            .findRenderObject()
+            .parentData;
         double offset = parendData.offset.dy - 52.h + 20.h;
         widget.scrollController.animateTo(offset,
             duration: Duration(seconds: 1), curve: Curves.ease);
       },
-      child: tabItem(text, isSelected, index),
+      child: Container(
+        padding: EdgeInsets.symmetric(horizontal: 15.w),
+        child: tabItem(text, isSelected, index),
+      ),
     );
   }
 
-  Widget tabItem(text, isSelected, index) {
+  // List<String> images = [
+  //   "assets/image/icon_chili.webp",
+  //   "assets/image/icon_milk_tea.webp",
+  //   "assets/image/icon_bread.webp",
+  // ];
+
+  Widget tabItem(Brand text, isSelected, index) {
     if (isSelected) {
       return IconText(
-        text,
+        text.name,
         isMax: false,
-        rightImage: images[index],
+        rightImage: text.icon ?? "assets/image/icon_chili.webp",
         iconSize: 16,
         iconColor: Colors.red,
         textStyle: TextStyle(
-            fontWeight: FontWeight.bold,
-            fontSize: 16.sp,
-            color: Color(0xFF353535)),
+          fontWeight: FontWeight.bold,
+          fontSize: 16.sp,
+          color: Color(0xFF353535),
+        ),
       );
     } else {
       return IconText(
-        text,
+        text.name,
         isMax: false,
         textStyle: TextStyle(
-            fontWeight: FontWeight.bold,
-            fontSize: 16.sp,
-            color: Color(0xFF353535)),
+          fontWeight: FontWeight.bold,
+          fontSize: 16.sp,
+          color: Color(0xFF353535),
+        ),
       );
     }
   }