feat: 适配 headerbar ios26
This commit is contained in:
38
hooks/README.md
Normal file
38
hooks/README.md
Normal file
@@ -0,0 +1,38 @@
|
||||
# 安全区域 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 版本上都能正确处理安全区域。
|
||||
Reference in New Issue
Block a user