Flutter中如何检测iOS/Android设备底部是否存在HomeBar

带有HomeBar（即底部虚拟导航栏，比如iPhone X及以后机型的底部横条、部分安卓设备的软件导航栏）的设备，需要为页面底部预留合适间距，以下是几种实用的判断方法：

方法一：利用Flutter自带的MediaQuery（推荐） #

通过MediaQuery获取屏幕底部的安全区域高度，带有HomeBar的设备底部安全区域高度会大于0，反之（如带实体Home键的设备）则为0。

代码示例：

// 在Widget的build方法中获取
bool hasHomeBar = MediaQuery.of(context).viewPadding.bottom > 0;

实际使用时，可以直接根据这个布尔值调整页面底部内边距：

Padding(
  padding: EdgeInsets.only(bottom: hasHomeBar ? 30 : 16),
  child: Text('需要适配底部间距的内容'),
)

方法二：通过设备信息判断（适合需精准机型适配的场景） #

借助device_info_plus第三方包获取设备型号，针对性判断是否存在HomeBar，但需要维护机型列表，灵活性不如第一种方法。

1. 先在pubspec.yaml中添加依赖：

dependencies:
  device_info_plus: ^9.0.2 # 版本号以最新为准

2. 实现判断逻辑：

import 'package:device_info_plus/device_info_plus.dart';
import 'dart:io';

Future<bool> checkHasHomeBar() async {
  final deviceInfo = DeviceInfoPlugin();
  if (Platform.isIOS) {
    final iosInfo = await deviceInfo.iosInfo;
    // 包含所有无实体Home键的iOS设备机型代码，需根据新机型补充
    final noHomeButtonModels = [
      'iPhone10,1', 'iPhone10,2', 'iPhone10,3', 'iPhone10,4',
      'iPhone10,5', 'iPhone10,6', 'iPhone11,8', 'iPhone12,1',
      // 更多新机型代码可自行补充
    ];
    return noHomeButtonModels.contains(iosInfo.utsname.machine);
  } else if (Platform.isAndroid) {
    final androidInfo = await deviceInfo.androidInfo;
    // 安卓设备判断是否为手机且无物理导航键
    return androidInfo.systemFeatures.contains('android.hardware.type.phone') &&
           !androidInfo.hasPhysicalKeys;
  }
  return false;
}

补充：直接使用SafeArea组件 #

如果只是需要为底部预留系统安全间距，无需手动判断，直接用SafeArea包裹页面内容即可，它会自动适配带HomeBar的设备：

SafeArea(
  bottom: true,
  child: Scaffold(
    body: YourPageContent(),
  ),
)

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