# 安全区域 Hooks 这个目录包含了与设备安全区域相关的 React hooks。 ## useSafeAreaTop 获取顶部安全区域距离的 hook,可以添加额外的间距。 ```typescript import { useSafeAreaTop } from '@/hooks/useSafeAreaWithPadding'; // 使用默认的 20 像素额外间距 const topPadding = useSafeAreaTop(); // 使用自定义的额外间距 const customTopPadding = useSafeAreaTop(10); ``` ## useSafeAreaWithPadding 获取所有方向的安全区域距离,并可以为每个方向添加不同的额外间距。 ```typescript import { useSafeAreaWithPadding } from '@/hooks/useSafeAreaWithPadding'; // 使用默认值(无额外间距) const safeAreas = useSafeAreaWithPadding(); // 为不同方向添加不同的额外间距 const customSafeAreas = useSafeAreaWithPadding({ top: 20, bottom: 10, left: 5, right: 5 }); ``` 这些 hooks 基于 `react-native-safe-area-context` 库,确保你的应用在不同设备和 iOS 版本上都能正确处理安全区域。