Flutter BottomNavigationBar图标在点击时减小，并在释放时返回正常大小

如何解决Flutter BottomNavigationBar图标在点击时减小，并在释放时返回正常大小

我有标准的底部导航。我已经隐藏了项目标题并使用了类型：BottomNavigationBarType.fixed以防止出现默认动画。

我想要的是：BottomNavigationBar项目图标在单击时变小，然后以动画方式恢复为正常大小。有人可以帮助我实现这一目标吗？

int _selectedindex = 0;
static const TextStyle optionStyle = TextStyle(fontSize: 30,fontWeight: FontWeight.bold);
static const List<Widget> _widgetoptions = <Widget>[
  Text(
    'Index 0: Home',style: optionStyle,),Text(
     'Index 1: Business',Text(
     'Index 2: School',];

void _onItemTapped(int index) {
  setState(() {
    _selectedindex = index;
  });
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('BottomNavigationBar Sample'),body: Center(
      child: _widgetoptions.elementAt(_selectedindex),bottomNavigationBar: BottomNavigationBar(
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: Icon(Icons.home),title: SizedBox.shrink(),BottomNavigationBarItem(
          icon: Icon(Icons.business),BottomNavigationBarItem(
          icon: Icon(Icons.school),],currentIndex: _selectedindex,selectedItemColor: Colors.Amber[800],onTap: _onItemTapped,type: BottomNavigationBarType.fixed,);
}

解决方法

您可以使用

AnimatedContainer

实现这一目标。将每个图标包装在一起，并在其中展开图标。如果您更改动画容器的高度，则会对其进行动画处理。