import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:get/get.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; class Home extends StatefulWidget { const Home({Key? key}) : super(key: key); @override _Home createState() => _Home(); } class _Home extends State { List images = [ ['images/index/index.png', 'images/index/indexActive.png'], ['images/index/job.png', 'images/index/jobActive.png'], ['images/index/user.png', 'images/index/userActive.png'], ]; final List _titles = ['首页', '订单列表', '个人中心']; int _currentIndex = 0; final tabTextStyleSelected = TextStyle(color: const Color(0xFF06B03B),fontSize: 15.sp,fontWeight: FontWeight.bold); //选线卡选中字体颜色 final tabTextStyleNormal = TextStyle(color: const Color(0xFF323232),fontSize: 15.sp,fontWeight: FontWeight.bold); //选项卡未选中字体颜色 int _tabIndex = 0; //选项卡下标 var _body = [Text('我是首页'), Text('我是订单列表'), Text('我是个人中心')]; TextStyle getTabTextStyle(int curIndex) { //设置tabbar 选中和未选中的状态文本 if (curIndex == _tabIndex) { return tabTextStyleSelected; } return tabTextStyleNormal; } Image getTabIcon(int curIndex) { //设置tabbar选中和未选中的状态图标 if (curIndex == _tabIndex) { return Image.asset( images[curIndex][1], width: 20.w, height: 20.w, ); } return Image.asset( images[curIndex][0], width: 20.w, height: 20.w, ); } Image getTabImage(path) { return Image.asset(path, width: 26.w, height: 26.w); } // 切换底部选项卡,标题的变化设置 Text getTabTitle(int curIndex) { return Text(_titles[curIndex], style: getTabTextStyle(curIndex)); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( elevation: 0, centerTitle: true, backgroundColor: Colors.white, title: Text( '首页', style: TextStyle( color: Colors.black, fontSize: 17.sp, letterSpacing: 2, fontWeight: FontWeight.bold ), ), ), body: _body[_tabIndex], bottomNavigationBar: Container( height: 65.h, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Column( children: [ getTabIcon(0), getTabTitle(0) ], ), Column( children: [ getTabIcon(1), getTabTitle(1) ], ), Column( children: [ getTabIcon(2), getTabTitle(2) ], ), ], ), ), ); } }