Flutter BottomNavigationbar 如何获取每个子项图片的中心坐标

你可以通过使用 `RenderBox` 来获取 BottomNavigationBar 的每个子项的中心坐标。

首先，你需要给每个子项的 icon 添加一个 `GlobalKey`，例如：

BottomNavigationBarItem(
  icon: Icon(Icons.home),
  title: Text('Home'),
  key: GlobalKey(),
)

然后，在 `onTap` 回调中获取该子项的 `RenderBox`，并根据其位置和大小计算出中心坐标。示例代码如下：

class MyBottomNavigationBar extends StatefulWidget {
  @override
  _MyBottomNavigationBarState createState() => _MyBottomNavigationBarState();
}

class _MyBottomNavigationBarState extends State<MyBottomNavigationBar> {
  final List<GlobalKey> _itemKeys = List.generate(4, (_) => GlobalKey());

  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        onTap: (index) {
          setState(() {
            _currentIndex = index;
          });

          // 获取子项的中心坐标
          final RenderBox itemRenderBox =
              _itemKeys[index].currentContext.findRenderObject();
          final Offset itemPosition = itemRenderBox.localToGlobal(
            itemRenderBox.size.center(Offset.zero),
            ancestor: context.findRenderObject(),
          );
          print('itemPosition: $itemPosition');
        },
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('Home'),
            key: _itemKeys[0],
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.search),
            title: Text('Search'),
            key: _itemKeys[1],
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person),
            title: Text('Profile'),
            key: _itemKeys[2],
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.settings),
            title: Text('Settings'),
            key: _itemKeys[3],
          ),
        ],
      ),
    );
  }
}

这样，当你点击 BottomNavigationBar 的某个子项时，就会在控制台中打印出该子项的中心坐标。