feat: 适配 headerbar ios26

hooks/README.md

@@ -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 版本上都能正确处理安全区域。

hooks/useSafeAreaWithPadding.ts

@@ -0,0 +1,32 @@
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+
+/**
+ * 获取安全区域距离并添加额外间距的 hook
+ * @param extraPadding 额外的间距对象，默认所有方向都是 0
+ * @returns 包含所有方向安全区域距离加上额外间距的对象
+ */
+export const useSafeAreaWithPadding = (extraPadding: {
+  top?: number;
+  bottom?: number;
+  left?: number;
+  right?: number;
+} = {}) => {
+  const insets = useSafeAreaInsets();
+
+  return {
+    top: insets.top + (extraPadding.top || 40),
+    bottom: insets.bottom + (extraPadding.bottom || 0),
+    left: insets.left + (extraPadding.left || 0),
+    right: insets.right + (extraPadding.right || 0),
+  };
+};
+
+/**
+ * 获取安全区域顶部距离的 hook
+ * @param extraPadding 额外的间距，默认为 20 像素
+ * @returns 顶部安全区域距离加上额外间距的总值
+ */
+export const useSafeAreaTop = (extraPadding: number = 50) => {
+  const insets = useSafeAreaInsets();
+  return insets.top + extraPadding;
+};