Flutter如何获取手机顶部安全区域上方区域的高度？

• 问题根源：你在SafeArea内部调用MediaQuery时，SafeArea已经修改了当前上下文的MediaQuery数据，返回的是去除安全区域后的padding值，所以拿到的始终是0。必须在SafeArea外部的上下文中获取原始的viewPadding。

• 修复后的代码示例：

Widget build(BuildContext context) {
    // 此处context未被SafeArea修改，能获取到正确的顶部安全区域高度
    final topSafeHeight = MediaQuery.of(context).viewPadding.top;
    print("顶部安全区域高度: $topSafeHeight");

    return SafeArea(
      child: Scaffold(
        body: _buildVideoContent(),
      ),
    );
  }

• 额外注意事项：
  • 如果你的应用开启了全屏模式（比如通过SystemChrome.setEnabledSystemUIMode隐藏了状态栏），viewPadding.top会返回0，需要先确保系统UI处于正常显示状态。
  • viewPadding包含了所有系统UI占据的空间（如刘海、状态栏），而padding是viewPadding减去键盘等临时UI的高度，所以用viewPadding.top获取顶部区域高度更准确。

内容的提问来源于stack exchange，提问作者Janaka