BottomNavigationBarItem 设置图片和文字的

2022-07-12  本文已影响0人  follow_er

解决方法: 在icon上添加padding
代码示例:

class _BusinessTabbarPageState extends State<BusinessTabbarPage> {
  int currentIndex;
  Widget currentPage;
  final List _tabs = [
    BusinessListPage(),
    HighSeasBusinessListPage(),
  ];

  final List<BottomNavigationBarItem> _bottomTabs = [
    //icon部分的设置!!!!
    BottomNavigationBarItem(
        icon:Padding(padding: EdgeInsets.all(8),
        child: Image.asset("assets/images/business_unSelected.png",fit: BoxFit.cover,width: 25,height: 25)),
        activeIcon:Padding(padding: EdgeInsets.all(8),
        child: Image.asset("assets/images/business_Selected.png",fit: BoxFit.cover,width: 25,height: 25)),
        title:Text('我的商机')
    ),
    BottomNavigationBarItem(
        icon:Padding(padding: EdgeInsets.all(8),
        child: Image.asset("assets/images/business_unSelected.png",fit: BoxFit.cover,width: 25,height: 25)),
        activeIcon:Padding(padding: EdgeInsets.all(8),
        child: Image.asset("assets/images/business_Selected.png",fit: BoxFit.cover,width: 25,height: 25)),
        title:Text('公海商机'),
    )
  ];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    currentIndex = widget.currentIndex;
    currentPage = _tabs[currentIndex];
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Color.fromRGBO(244, 245, 245, 1.0),
        bottomNavigationBar: BottomNavigationBar(
          type:BottomNavigationBarType.fixed,
          currentIndex: currentIndex,
          items:_bottomTabs,
          onTap: (index){
            setState(() {
              currentIndex = index;
              currentPage = _tabs[currentIndex];
            });
          },
          fixedColor: AppColor.blue,
          selectedLabelStyle: TextStyle(
              color:  AppColor.blue,
              fontWeight: FontWeight.w600,
              fontSize: 14.0
          ),
          unselectedLabelStyle: TextStyle(
              color:  Colors.black,
              fontWeight: FontWeight.w600,
              fontSize: 14.0
          ),
        ),
        body:currentPage
    );
  }
}
上一篇下一篇

猜你喜欢

热点阅读