导航栏

ln_jq_app/lib/pages/c_page/base_widgets/view.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
-import 'package:getx_scaffold/common/index.dart';
+import 'package:get/get.dart';
 import 'package:getx_scaffold/getx_scaffold.dart';
+import 'package:ln_jq_app/common/login_util.dart';
 import 'package:ln_jq_app/pages/c_page/car_info/view.dart';
 import 'package:ln_jq_app/pages/c_page/map/view.dart';
 import 'package:ln_jq_app/pages/c_page/mine/view.dart';
@@ -9,9 +10,10 @@ import 'package:ln_jq_app/pages/c_page/reservation/view.dart';
 import 'index.dart';
 
 class BaseWidgetsPage extends GetView<BaseWidgetsController> {
-   BaseWidgetsPage({super.key});
+  BaseWidgetsPage({super.key});
 
   final PageController _pageController = PageController();
+
   // 主视图
   Widget _buildView() {
     return PageView(
@@ -20,54 +22,68 @@ class BaseWidgetsPage extends GetView<BaseWidgetsController> {
       onPageChanged: (index) {
         jumpTabAndPage(index);
       },
-      children: _buildPages(), // 页面的列表
+      children: _buildPages(),
     );
   }
 
   void jumpTabAndPage(int index) {
-    controller.pageIndex = index; // 更新页面索引
-    controller.updateUi(); // 更新 UI
+    controller.pageIndex = index;
+    controller.updateUi();
     _pageController.jumpToPage(controller.pageIndex);
   }
-  // 对应的页面
+
   List<Widget> _buildPages() {
-    return [
-      ReservationPage(),
-      MapPage(),
-      CarInfoPage(),
-      MinePage(),
-    ];
+    return [ReservationPage(), MapPage(), CarInfoPage(), MinePage()];
   }
 
-  //导航栏
+  // 自定义导航栏 (悬浮胶囊样式)
   Widget _buildNavigationBar() {
-    return NavigationX(
-      currentIndex: controller.pageIndex, // 当前选中的tab索引
-      onTap: (index) {
-        jumpTabAndPage(index);
-      }, // 切换tab事件
-      items: [
-        NavigationItemModel(
-          label: '加氢预约',
-          icon: AntdIcon.orderedlist,
-          selectedIcon: AntdIcon.calendar_fill,
+    return SafeArea(
+      child: Container(
+        height: 50.h,
+        margin: const EdgeInsets.fromLTRB(24, 0, 24, 10), // 悬浮边距
+        decoration: BoxDecoration(
+          color: Color.fromRGBO(240, 244, 247, 1), // 浅灰色背景
+          borderRadius: BorderRadius.circular(30),
+          boxShadow: [
+            BoxShadow(
+              color: Colors.black.withOpacity(0.05),
+              blurRadius: 10,
+              offset: const Offset(0, 5),
+            ),
+          ],
         ),
-        NavigationItemModel(
-          label: '地图',
-          icon: AntdIcon.location,
-          selectedIcon: AntdIcon.location_fill,
+        child: Row(
+          mainAxisAlignment: MainAxisAlignment.spaceAround,
+          children: [
+            _buildNavItem(0, "ic_h2_select@2x", "ic_h2@2x"),
+            _buildNavItem(1, "ic_map_select@2x", "ic_map@2x"),
+            _buildNavItem(2, "ic_car_select@2x", "ic_car@2x"),
+            _buildNavItem(3, "ic_user_select@2x", "ic_user@2x"),
+          ],
         ),
-        NavigationItemModel(
-          label: '车辆信息',
-          icon: AntdIcon.car,
-          selectedIcon: AntdIcon.car_fill,
+      ),
+    );
+  }
+
+  // 构建单个导航项
+  Widget _buildNavItem(int index, String icon, String selectedIcon) {
+    bool isSelected = controller.pageIndex == index;
+    return GestureDetector(
+      onTap: () => jumpTabAndPage(index),
+      behavior: HitTestBehavior.opaque,
+      child: AnimatedContainer(
+        duration: const Duration(milliseconds: 200),
+        padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 8),
+        decoration: BoxDecoration(
+          color: isSelected ? const Color(0xFF006633) : Colors.transparent, // 选中时的深绿色背景
+          borderRadius: BorderRadius.circular(20),
         ),
-        NavigationItemModel(
-          label: '我的',
-          icon: AntdIcon.user,
-          selectedIcon: AntdIcon.user,
-        ),
-      ],
+        child: SizedBox(
+          height: 24,
+          width: 24,
+          child: LoginUtil.getAssImg(isSelected ? selectedIcon : icon),),
+      ),
     );
   }
 
@@ -78,10 +94,10 @@ class BaseWidgetsPage extends GetView<BaseWidgetsController> {
       id: 'baseWidgets',
       builder: (_) {
         return Scaffold(
-          extendBody: false,
+          extendBody: true, // 重要：让 body 延伸到导航栏后面
           resizeToAvoidBottomInset: false,
           bottomNavigationBar: _buildNavigationBar(),
-          body: SafeArea(child: _buildView()),
+          body: _buildView(), // 移除 SafeArea 以获得更好的全屏沉浸感
         );
       },
     );