import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import '../TabBar/widgets/Information/index.dart'; import '../TabBar/widgets/main/index.dart'; import '../TabBar/widgets/order/index.dart'; import '../TabBar/widgets/home/index.dart'; class Home extends StatefulWidget { const Home({Key? key}) : super(key: key); @override _Home createState() => _Home(); } class _Home extends State { //下标 当前tab int _tabIndex = 0; final List _titles = ['首页', '订单', '资讯','我的']; final tabTextStyleSelected = TextStyle( color: const Color(0xFFFF703B), fontSize: 15.sp, fontWeight: FontWeight.bold); //选线卡选中字体颜色 final tabTextStyleNormal = TextStyle( color: const Color(0xFF323232), fontSize: 15.sp, fontWeight: FontWeight.bold); //选项卡未选中字体颜色 TextStyle getTabTextStyle(int curIndex) { //设置tabbar 选中和未选中的状态文本 if (curIndex == _tabIndex) { return tabTextStyleSelected; } return tabTextStyleNormal; } // 切换底部选项卡,标题的变化设置 Text getTabTitle(int curIndex) { return Text(_titles[curIndex], style: getTabTextStyle(curIndex)); } List images = [ ['images/index/HomesOFFImgaes.png', 'images/index/HomesNOImgaes.png'], ['images/index/OrdersOFFImgaes.png', 'images/index/OrdersNOImgaes.png'], ['images/index/newsONImages.png', 'images/index/newsOFFImages.png'], ['images/index/MineOFFImgaes.png', 'images/index/MineNOImgaes.png'], ]; Image getTabIcon(int curIndex) { //设置tabbar选中和未选中的状态图标 if (curIndex == _tabIndex) { return Image.asset( images[curIndex][1], width: 22.w, height: 22.w, ); } return Image.asset( images[curIndex][0], width: 22.w, height: 22.w, ); } Image getTabImage(path) { return Image.asset(path, width: 22.w, height: 22.w); } //内容 var _body = [HomePage(), OrderPage(),Information(), MainPage()]; Widget tabBar(index) { return GestureDetector( behavior: HitTestBehavior.opaque, onTap: () { setState(() { _tabIndex = index; }); }, child: Container( width: 93.w, height: 65.h, child: Column( children: [ getTabIcon(index), Padding( padding: EdgeInsets.fromLTRB(0, 6.h, 0, 0), child: getTabTitle(index), ) ], ), ), ); } @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, appBar: AppBar( elevation: 0, centerTitle: true, backgroundColor: Colors.white, title: Text( _titles[_tabIndex], style: TextStyle( color: Colors.black, fontSize: 17.sp, letterSpacing: 2, fontWeight: FontWeight.bold), ), ), body: _body[_tabIndex], bottomNavigationBar: Container( padding: EdgeInsets.fromLTRB(0, 7.h, 0, 7.h), decoration: BoxDecoration( color: const Color(0xFFFFFFFF), boxShadow: [ BoxShadow( color: const Color(0x14000000), offset: Offset(0, -2.w), blurRadius: 3.w, ), ], ), child: Row( children:_titles.asMap().keys.map((index) =>tabBar(index)).toList(), ), ), ); } }