已开启
docs:更新modal组件br_rnoh0.72分支的中英文文档至v0.4.2模板 #28
fangzhen创建于 8月18日
docs:更新modal组件br_rnoh0.72分支的中英文文档至v0.4.2模板 #28
已开启
共 2 个文件变更+237-173
| @@ -1,4 +1,4 @@ | |||
| 1 | -> 模板版本：v0.4.0 | 1 | +> 文档模板：v0.4.2 |
| 2 | 2 | ||
| 3 | <p align="center"> | 3 | <p align="center"> |
| 4 | <h1 align="center"> <code>react-native-modal</code> </h1> | 4 | <h1 align="center"> <code>react-native-modal</code> </h1> |
| @@ -8,39 +8,47 @@ | |||
| 8 | 8 | ||
| 9 | 该第三方库的仓库已迁移至 Gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-modal` 版本所属关系如下： | 9 | 该第三方库的仓库已迁移至 Gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-modal` 版本所属关系如下： |
| 10 | 10 | ||
| 11 | -| 三方库名称 | 三方库版本 | 发布信息 | 支持 RN 版本 | Autolink | 编译 API 版本 | 社区基线版本 | npm 地址 | | 11 | +| 三方库名称 | 三方库版本（npm地址） | 发布信息 | 支持RN版本 | Autolink | 编译API版本 | 社区基线版本 | 源码地址 | |
| 12 | -| --------------------------------------- | ------------------- | ----------------------------------------------------------------------------------------- | --------------- | -------- | ------------- | ------------ | ------------------------------------------------------------------------------------ | | 12 | +| --------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | ----------------------- | -------- | ----------- | ------------ | ------------------------------------------------------------ | |
| 13 | -| @react-native-ohos/react-native-modal | ~ 14.0.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.77.\*/0.82.\* | 否 | API12+ | 14.0.0-rc.1 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | | 13 | +| @react-native-ohos/react-native-modal | [~ 13.0.2](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | [Gitcode Releases](https://gitcode.com/CPF-RN/rntpc_react-native-modal/releases) | 0.72.\* | 否 | API12+ | 13.0.1 | [br_rnoh0.72](https://gitcode.com/CPF-RN/rntpc_react-native-modal/tree/br_rnoh0.72) | |
| 14 | -| @react-native-ohos/react-native-modal | ~ 13.0.2 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.72.\* | 否 | API12+ | 13.0.1 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | | 14 | +| @react-native-oh-tpl/react-native-modal | [~ 13.0.1-0.0.1@deprecated](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-modal) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72.* | 否 | API12+ | 13.0.1 | [sig](https://github.com/react-native-oh-library/react-native-modal/tree/sig) | |
| 15 | -| @react-native-oh-tpl/react-native-modal | ~ 13.0.1@deprecated | [Github Releases](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72.\* | 否 | API12+ | 13.0.1 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-modal) | | ||
| 16 | 15 | ||
| 17 | -## 1. 安装与使用 | 16 | +## 简介 |
| 17 | + | ||
| 18 | +react-native-modal 是基于 RN 原生 Modal 封装的增强模态框组件，提供丰富进出动画、手势侧滑关闭、遮罩自定义、滚动适配等扩展能力，API 简洁且兼容多端。 | ||
| 19 | + | ||
| 20 | +## 下载安装 | ||
| 18 | 21 | ||
| 19 | 进入到工程目录并输入以下命令： | 22 | 进入到工程目录并输入以下命令： |
| 20 | 23 | ||
| 21 | -<!-- tabs:start --> | ||
| 22 | - | ||
| 23 | #### **npm** | 24 | #### **npm** |
| 24 | 25 | ||
| 25 | ```bash | 26 | ```bash |
| 26 | -# V13.0.1 | ||
| 27 | -npm install @react-native-oh-tpl/react-native-modal | ||
| 28 | - | ||
| 29 | -# V14.0.1 | ||
| 30 | npm install @react-native-ohos/react-native-modal | 27 | npm install @react-native-ohos/react-native-modal |
| 31 | ``` | 28 | ``` |
| 32 | 29 | ||
| 33 | #### **yarn** | 30 | #### **yarn** |
| 34 | 31 | ||
| 35 | ```bash | 32 | ```bash |
| 36 | -# V13.0.1 | ||
| 37 | -yarn add @react-native-oh-tpl/react-native-modal | ||
| 38 | - | ||
| 39 | -# V14.0.1 | ||
| 40 | yarn add @react-native-ohos/react-native-modal | 33 | yarn add @react-native-ohos/react-native-modal |
| 41 | ``` | 34 | ``` |
| 42 | 35 | ||
| 43 | -<!-- tabs:end --> | 36 | +## Link |
| 37 | + | ||
| 38 | +| | 是否支持autolink | RN框架版本 | | ||
| 39 | +| ------- | ---------------- | -------------- | | ||
| 40 | +| ~13.0.2 | No | 0.72 | | ||
| 41 | +| ~13.0.1-0.0.1@deprecated | No | 0.72 | | ||
| 42 | + | ||
| 43 | +## 约束与限制 | ||
| 44 | + | ||
| 45 | +### 兼容性 | ||
| 46 | + | ||
| 47 | +本文档内容基于以下版本验证通过： | ||
| 48 | + | ||
| 49 | +1. RNOH: 0.72.139; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; | ||
| 50 | + | ||
| 51 | + ## 使用示例 | ||
| 44 | 52 | ||
| 45 | 下面的代码展示了这个库的基本使用场景： | 53 | 下面的代码展示了这个库的基本使用场景： |
| 46 | 54 | ||
| @@ -131,84 +139,108 @@ const styles = StyleSheet.create({ | |||
| 131 | export default DefaultModal; | 139 | export default DefaultModal; |
| 132 | ``` | 140 | ``` |
| 133 | 141 | ||
| 134 | -## 2. Link | 142 | +## 接口说明 |
| 135 | - | ||
| 136 | -| | 是否支持 autolink | RN 框架版本 | | ||
| 137 | -| ------------------ | ----------------- | ----------- | | ||
| 138 | -| ~14.0.1 | 否 | 0.77/0.82 | | ||
| 139 | -| ~13.0.2 | 否 | 0.72 | | ||
| 140 | -| ~13.0.1@deprecated | 否 | 0.72 | | ||
| 141 | - | ||
| 142 | -## 3. 约束与限制 | ||
| 143 | - | ||
| 144 | -### 3.1 兼容性 | ||
| 145 | - | ||
| 146 | -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： | ||
| 147 | - | ||
| 148 | -| 三方库版本 | 发布信息 | 支持 RN 版本 | | ||
| 149 | -| ----------------- | -------------------------------------------------------------------------------------------------------------------------- | ------------ | | ||
| 150 | -| 14.0.1 | [@react-native-ohos/react-native-modal Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.77/0.82 | | ||
| 151 | -| 13.0.2 | [@react-native-ohos/react-native-modal Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.72 | | ||
| 152 | -| 13.0.1@deprecated | [@react-native-oh-tpl/react-native-modal Releases](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72 | | ||
| 153 | - | ||
| 154 | -## 4. 属性 | ||
| 155 | 143 | ||
| 156 | > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 | 144 | > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 |
| 157 | 145 | ||
| 158 | -> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 | 146 | +> [!TIP] "OpenHarmony Support"列为 yes 表示 OpenHarmony平台支持 该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 |
 | |||
| 159 | 147 | ||
| 160 | -| Name | Description | Type | Default | Required | Platform | HarmonyOS Support | | 148 | +### 组件 |
| 161 | -| ------------------------------ | -------------------------------------------------------------- | -------------------- | ------------------------------ | -------- | -------- | ----------------- | | ||
| 162 | -| animationIn | 弹窗显示动画 | `string` or `object` | "slideInUp" | no | all | yes | | ||
| 163 | -| animationInTiming | 弹窗显示动画时长（毫秒） | `number` | 300 | no | all | yes | | ||
| 164 | -| animationOut | 弹窗隐藏动画 | `string` or `object` | "slideOutDown" | no | all | yes | | ||
| 165 | -| animationOutTiming | 弹窗隐藏动画时长（毫秒） | `number` | 300 | no | all | yes | | ||
| 166 | -| avoidKeyboard | 键盘弹出时是否自动上移弹窗 | `bool` | false | no | all | yes | | ||
| 167 | -| coverScreen | 是否使用原生 Modal 组件覆盖整个屏幕 | `bool` | true | no | all | yes | | ||
| 168 | -| hasBackdrop | 渲染遮罩层 | `bool` | true | no | all | yes | | ||
| 169 | -| backdropColor | 遮罩层背景色 | `string` | "black" | no | all | yes | | ||
| 170 | -| backdropOpacity | 弹窗显示时遮罩层的透明度 | `number` | 0.70 | no | all | yes | | ||
| 171 | -| backdropTransitionInTiming | 遮罩层显示动画时长（毫秒） | `number` | 300 | no | all | yes | | ||
| 172 | -| backdropTransitionOutTiming | 遮罩层隐藏动画时长（毫秒） | `number` | 300 | no | all | yes | | ||
| 173 | -| customBackdrop | 自定义遮罩层元素 | `node` | null | no | all | yes | | ||
| 174 | -| children | 弹窗内容 | `node` | **REQUIRED** | yes | all | yes | | ||
| 175 | -| deviceHeight | 设备高度（适用于可隐藏导航栏的设备） | `number` | null | no | all | yes | | ||
| 176 | -| deviceWidth | 设备宽度（适用于可隐藏导航栏的设备） | `number` | null | no | all | yes | | ||
| 177 | -| isVisible | 是否显示弹窗 | `bool` | **REQUIRED** | yes | all | yes | | ||
| 178 | -| onBackButtonPress | 安卓设备按下返回键时触发 | `func` | () => null | no | Android | yes | | ||
| 179 | -| onBackdropPress | 点击遮罩层时触发 | `func` | () => null | no | all | yes | | ||
| 180 | -| onModalWillHide | 弹窗隐藏动画开始前触发 | `func` | () => null | no | all | yes | | ||
| 181 | -| onModalHide | 弹窗完全隐藏后触发 | `func` | () => null | no | all | yes | | ||
| 182 | -| onModalWillShow | 弹窗显示动画开始前触发 | `func` | () => null | no | all | yes | | ||
| 183 | -| onModalShow | 弹窗完全显示后触发 | `func` | () => null | no | all | yes | | ||
| 184 | -| onSwipeStart | 滑动操作开始时触发 | `func` | () => null | no | all | yes | | ||
| 185 | -| onSwipeMove | 每次滑动事件触发时调用 | `func` | (percentageShown) => null | no | all | yes | | ||
| 186 | -| onSwipeComplete | 达到滑动阈值时触发 | `func` | ({ swipingDirection }) => null | no | all | yes | | ||
| 187 | -| onSwipeCancel | 未达到滑动阈值时触发 | `func` | () => null | no | all | yes | | ||
| 188 | -| panResponderThreshold | 触摸响应器开始识别滑动事件的阈值 | `number` | 4 | no | all | no | | ||
| 189 | -| scrollOffset | 大于 0 时禁用滑动关闭功能，用于实现可滚动内容 | `number` | 0 | no | all | no | | ||
| 190 | -| scrollOffsetMax | 用于实现内容可滚动时的越界滚动效果 | `number` | 0 | no | all | yes | | ||
| 191 | -| scrollTo | 用于实现可滚动弹窗 | `func` | null | no | all | yes | | ||
| 192 | -| scrollHorizontal | 滚动视图为横向滚动时设为 true（保证滚动逻辑正常） | `bool` | false | no | all | yes | | ||
| 193 | -| swipeThreshold | 触发滑动完成回调的滑动阈值 | `number` | 100 | no | all | yes | | ||
| 194 | -| swipeDirection | 定义弹窗可滑动的方向，支持 up/down/left/right 单个值或数组组合 | `string` or `array` | null | no | all | yes | | ||
| 195 | -| useNativeDriver | 是否使用原生驱动执行动画 | `bool` | false | no | all | yes | | ||
| 196 | -| useNativeDriverForBackdrop | 遮罩层动画是否使用原生驱动（避免安卓端闪烁问题） | `bool` | null | no | all | yes | | ||
| 197 | -| hideModalContentWhileAnimating | 动画完成前隐藏弹窗内容以提升性能 | `bool` | false | no | all | no | | ||
| 198 | -| propagateSwipe | 允许滑动事件传递给子组件（如弹窗内的滚动视图） | `bool` or `func` | false | no | all | no | | ||
| 199 | -| style | 应用到弹窗的样式 | `any` | null | no | all | yes | | ||
| 200 | 149 | ||
| 201 | -## 5. 静态方法 | 150 | +| 名称 | 参数类型 | 必填 | 平台 | OpenHarmony平台支持 | 描述 | |
| 151 | +| ----- | -------- | ---- | ---- | ------------------- | --------- | | ||
| 152 | +| Modal | / | yes | all | yes | Modal组件 | | ||
| 202 | 153 | ||
| 203 | -## 6. API | 154 | +### 属性 |
| 204 | 155 | ||
| 205 | -## 7. 遗留问题 | 156 | +| 名称 | 参数类型 | 默认值 | 必填 | 平台 | HarmonyOS平台支持 | 描述 | |
| 157 | +| ------------------------------ | -------------------------------------------------------- | ------------------------------ | ---- | ------- | ----------------- | ------------------------------------------------------------ | | ||
| 158 | +| animationIn | `string` or `object` | "slideInUp" | no | all | yes | 弹窗显示动画 | | ||
| 159 | +| animationInTiming | `number` | 300 | no | all | yes | 弹窗显示动画时长（毫秒） | | ||
| 160 | +| animationOut | `string` or `object` | "slideOutDown" | no | all | yes | 弹窗隐藏动画 | | ||
| 161 | +| animationOutTiming | `number` | 300 | no | all | yes | 弹窗隐藏动画时长（毫秒） | | ||
| 162 | +| avoidKeyboard | `bool` | false | no | all | yes | 键盘弹出时是否自动上移弹窗 | | ||
| 163 | +| coverScreen | `bool` | true | no | all | yes | 是否使用原生 Modal 组件覆盖整个屏幕 | | ||
| 164 | +| hasBackdrop | `bool` | true | no | all | yes | 渲染遮罩层 | | ||
| 165 | +| backdropColor | `string` | "black" | no | all | yes | 遮罩层背景色 | | ||
| 166 | +| backdropOpacity | `number` | 0.70 | no | all | yes | 弹窗显示时遮罩层的透明度 | | ||
| 167 | +| backdropTransitionInTiming | `number` | 300 | no | all | yes | 遮罩层显示动画时长（毫秒） | | ||
| 168 | +| backdropTransitionOutTiming | `number` | 300 | no | all | yes | 遮罩层隐藏动画时长（毫秒） | | ||
| 169 | +| customBackdrop | `node` | null | no | all | yes | 自定义遮罩层元素 | | ||
| 170 | +| children | `node` | **REQUIRED** | yes | all | yes | 弹窗内容 | | ||
| 171 | +| deviceHeight | `number` | null | no | all | yes | 设备高度（适用于可隐藏导航栏的设备） | | ||
| 172 | +| deviceWidth | `number` | null | no | all | yes | 设备宽度（适用于可隐藏导航栏的设备） | | ||
| 173 | +| isVisible | `bool` | **REQUIRED** | yes | all | yes | 是否显示弹窗 | | ||
| 174 | +| onBackButtonPress | `func` | () => null | no | Android | yes | 安卓设备按下返回键时触发 | | ||
| 175 | +| onBackdropPress | `func` | () => null | no | all | yes | 点击遮罩层时触发 | | ||
| 176 | +| onModalWillHide | `func` | () => null | no | all | yes | 弹窗隐藏动画开始前触发 | | ||
| 177 | +| onModalHide | `func` | () => null | no | all | yes | 弹窗完全隐藏后触发 | | ||
| 178 | +| onModalWillShow | `func` | () => null | no | all | yes | 弹窗显示动画开始前触发 | | ||
| 179 | +| onModalShow | `func` | () => null | no | all | yes | 弹窗完全显示后触发 | | ||
| 180 | +| onSwipeStart | `func` | () => null | no | all | yes | 滑动操作开始时触发 | | ||
| 181 | +| onSwipeMove | `func` | (percentageShown) => null | no | all | yes | 每次滑动事件触发时调用 | | ||
| 182 | +| onSwipeComplete | `func` | ({ swipingDirection }) => null | no | all | yes | 达到滑动阈值时触发 | | ||
| 183 | +| onSwipeCancel | `func` | () => null | no | all | yes | 未达到滑动阈值时触发 | | ||
| 184 | +| panResponderThreshold | `number` | 4 | no | all | no | 触摸响应器开始识别滑动事件的阈值 | | ||
| 185 | +| scrollOffset | `number` | 0 | no | all | no | 大于 0 时禁用滑动关闭功能，用于实现可滚动内容 | | ||
| 186 | +| scrollOffsetMax | `number` | 0 | no | all | yes | 用于实现内容可滚动时的越界滚动效果 | | ||
| 187 | +| scrollTo | `func` | null | no | all | yes | 用于实现可滚动弹窗 | | ||
| 188 | +| scrollHorizontal | `bool` | false | no | all | yes | 滚动视图为横向滚动时设为 true（保证滚动逻辑正常） | | ||
| 189 | +| swipeThreshold | `number` | 100 | no | all | yes | 触发滑动完成回调的滑动阈值 | | ||
| 190 | +| swipeDirection | `string` or `array` | null | no | all | yes | 定义弹窗可滑动的方向，支持 up/down/left/right 单个值或数组组合 | | ||
| 191 | +| useNativeDriver | `bool` | false | no | all | yes | 是否使用原生驱动执行动画 | | ||
| 192 | +| useNativeDriverForBackdrop | `bool` | null | no | all | yes | 遮罩层动画是否使用原生驱动（避免安卓端闪烁问题） | | ||
| 193 | +| hideModalContentWhileAnimating | `bool` | false | no | all | no | 动画完成前隐藏弹窗内容以提升性能 | | ||
| 194 | +| propagateSwipe | `bool` or `func` | false | no | all | no | 允许滑动事件传递给子组件（如弹窗内的滚动视图） | | ||
| 195 | +| style | `any` | null | no | all | yes | 应用到弹窗的样式 | | ||
| 196 | +| hardwareAccelerated | `bool` | false | no | android | no | 强制为 Modal 独立窗口开启 GPU 硬件加速渲染 | | ||
| 197 | +| statusBarTranslucent | `bool` | false | no | android | no | Modal 布局穿透系统状态栏，内容可以绘制到状态栏下方，实现沉浸式全屏弹窗 | | ||
| 198 | +| supportedOrientations | string[] | ['portrait', 'landscape'] | no | ios | no | 单独控制当前 Modal 允许旋转的屏幕方向，不受页面全局方向限制 | | ||
| 199 | +| presentationStyle | 'fullScreen'\|'overFullScreen'\|'pageSheet'\|'formSheet' | fullScreen | no | ios | no | Modal 显示状态 | | ||
| 200 | +| onDismiss | `func` | () => void | no | ios | no | Modal 关闭动画完全结束后触发回调 | | ||
| 201 | +| onShow | `func` | () => void | no | all | yes | Modal 弹出动画执行完成、弹窗完全显示后触发 | | ||
| 202 | +| onOrientationChange | `func` | (orientation) => void | no | all | yes | 弹窗展示期间设备横竖屏切换时触发；弹窗首次渲染也会执行一次，返回当前横竖屏状态 | | ||
| 203 | + | ||
| 204 | +### API | ||
| 205 | + | ||
| 206 | +| 名称 | 类型 | 参数类型 | 返回值 | 必填 | 平台 | OpenHarmony平台支持 | 描述 | | ||
| 207 | +| ----- | -------- | -------- | ------ | ---- | ---- | ------------------- | ----------------------------------------------------------- | | ||
| 208 | +| open | function | / | / | no | all | yes | 命令式打开弹窗，需要通过ref调用（modalRef.current.open()） | | ||
| 209 | +| close | function | / | / | no | all | yes | 命令式关闭弹窗，需要通过ref调用（modalRef.current.close()） | | ||
| 210 | + | ||
| 211 | +## 遗留问题 | ||
| 206 | 212 | ||
| 207 | - [ ] hideModalContentWhileAnimating 属性无效果，上游社区 bug。 | 213 | - [ ] hideModalContentWhileAnimating 属性无效果，上游社区 bug。 |
| 208 | - [ ] 三端表现一致，存在滑动冲突问题，在此场景下不支持 scrollOffset，propagateSwipe，panResponderThreshold。 | 214 | - [ ] 三端表现一致，存在滑动冲突问题，在此场景下不支持 scrollOffset，propagateSwipe，panResponderThreshold。 |
| 209 | 215 | ||
| 210 | -## 8. 其他 | 216 | +## 其他 |
| 211 | 217 | ||
| 212 | -## 9. 开源协议 | 218 | +无 |
| 213 | 219 | ||
| 214 | -本项目基于 [The MIT License (MIT)](https://github.com/react-native-modal/react-native-modal/blob/master/LICENSE.md) ，请自由地享受和参与开源。 | 220 | +## 目录结构 |
| 221 | + | ||
| 222 | +```` | ||
| 223 | +/rntpc_react-native-modal # 项目根目录 | ||
| 224 | +├── src # RN 代码（核心库源码） | ||
| 225 | +│ └─ index.ts # 入口文件，导出 ReactNativeModal | ||
| 226 | +│ └─ modal.tsx # Modal 核心组件实现 | ||
| 227 | +│ └─ modal.style.ts # 动画 / 样式相关 | ||
| 228 | +│ └─ types.ts # 类型定义（ModalProps、动画、方向等） | ||
| 229 | +│ └─ utils.ts # 工具函数 | ||
| 230 | +│ └─ global.d.ts # 全局类型声明 | ||
【AI-Review】【一般】【基础代码问题】【可读性问题】目录结构文档了不存在的文件 global.d.ts ● 问题: 目录结构章节中列出了 ● 影响: 开发者按文档导航源码时找不到该文件，造成困惑；文档与实际代码不一致，降低文档可信度，后续维护者可能误以为该文件缺失是 bug 而去补建无意义的空文件。 ● 建议: 从目录结构中删除   | |||
| 231 | +├── dist # 编译产物（发布包入口 dist/index.js） | ||
| 232 | +├── example # 示例 Demo | ||
| 233 | +├── package.json # 包配置，name: @react-native-ohos/react-native-modal | ||
| 234 | +├── tsconfig.json # TS 编译配置 | ||
| 235 | +├── buildEnv.sh # 构建环境脚本 | ||
| 236 | +├── README.md # 中文安装使用方法 | ||
| 237 | +└── README_en.md # 英文安装使用方法 | ||
| 238 | +```` | ||
| 239 | + | ||
| 240 | +## 贡献代码 | ||
| 241 | + | ||
| 242 | +使用过程中发现任何问题都可以提交 [Issue](https://gitcode.com/CPF-RN/rntpc_react-native-modal/issues)，当然，也非常欢迎提交 [PR](https://gitcode.com/CPF-RN/rntpc_react-native-modal/pulls) 。 | ||
| 243 | + | ||
| 244 | +## 开源协议 | ||
| 245 | + | ||
| 246 | +本项目基于 [MIT License](https://gitcode.com/CPF-RN/rntpc_react-native-modal/blob/master/LICENSE) ，请自由地享受和参与开源。 | ||
| @@ -1,46 +1,54 @@ | |||
| 1 | -> Template version: v0.4.0 | 1 | +> Document Template: v0.4.2 |
| 2 | 2 | ||
| 3 | <p align="center"> | 3 | <p align="center"> |
| 4 | <h1 align="center"> <code>react-native-modal</code> </h1> | 4 | <h1 align="center"> <code>react-native-modal</code> </h1> |
| 5 | </p> | 5 | </p> |
| 6 | 6 | ||
| 7 | -This project is based on [react-native-modal](https://github.com/react-native-modal/react-native-modal) . | 7 | +This project is based on [react-native-modal](https://github.com/react-native-modal/react-native-modal). |
| 8 | 8 | ||
| 9 | This third-party library has been migrated to Gitcode and is now available for direct download from npm, the new package name is: `@react-native-ohos/react-native-modal`, The version correspondence details are as follows: | 9 | This third-party library has been migrated to Gitcode and is now available for direct download from npm, the new package name is: `@react-native-ohos/react-native-modal`, The version correspondence details are as follows: |
| 10 | 10 | ||
| 11 | -| Name | Version | Release Information | Supported RN Version | Supported Autolink | Compile API Version | Community Baseline Version | npm Address | | 11 | +| Name | Version(Npm Address) | Release Information | Supported RN Version | Supported Autolink | Compile API Version | Community Baseline Version | Source code address | |
| 12 | -| --------------------------------------- | ------------------- | ----------------------------------------------------------------------------------------- | -------------------- | ------------------ | ------------------- | -------------------------- | ------------------------------------------------------------------------------------ | | 12 | +| ------------------------------------- | --------------------------------------------------------- | ------------------------------------------------------------ | ---------------------- | -------- | ------------------- | -------------------------- | ----------------------------------------------------------- | |
| 13 | -| @react-native-ohos/react-native-modal | ~ 14.0.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.77.\*/0.82.\* | No | API12+ | 14.0.0-rc.1 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | | 13 | +| @react-native-ohos/react-native-modal | [~ 13.0.2](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | [Gitcode Releases](https://gitcode.com/CPF-RN/rntpc_react-native-modal/releases) | 0.72.\* | No | API12+ | 13.0.1 | [br_rnoh0.72](https://gitcode.com/CPF-RN/rntpc_react-native-modal/tree/br_rnoh0.72) | |
| 14 | -| @react-native-ohos/react-native-modal | ~ 13.0.2 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.72.\* | No | API12+ | 13.0.1 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-modal) | | 14 | +| @react-native-oh-tpl/react-native-modal | [~ 13.0.1-0.0.1@deprecated](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-modal) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72.* | No | API12+ | 13.0.1 | [sig](https://github.com/react-native-oh-library/react-native-modal/tree/sig) | |
| 15 | -| @react-native-oh-tpl/react-native-modal | ~ 13.0.1@deprecated | [Github Releases](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72.\* | No | API12+ | 13.0.1 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-modal) | | ||
| 16 | 15 | ||
| 17 | -## 1. Installation and Usage | 16 | +## Introduction |
| 17 | + | ||
| 18 | +react-native-modal is an enhanced modal component wrapped around React Native's native Modal. It offers extended capabilities including abundant enter/exit animations, swipe-to-close gestures, customizable overlays, and scroll compatibility, featuring concise APIs and cross-platform support. | ||
| 19 | + | ||
| 20 | +## Installation | ||
| 18 | 21 | ||
| 19 | Go to the project directory and execute the following instruction: | 22 | Go to the project directory and execute the following instruction: |
| 20 | 23 | ||
| 21 | -<!-- tabs:start --> | ||
| 22 | - | ||
| 23 | #### **npm** | 24 | #### **npm** |
| 24 | 25 | ||
| 25 | ```bash | 26 | ```bash |
| 26 | -# V13.0.1 | ||
| 27 | -npm install @react-native-oh-tpl/react-native-modal | ||
| 28 | - | ||
| 29 | -# V14.0.1 | ||
| 30 | npm install @react-native-ohos/react-native-modal | 27 | npm install @react-native-ohos/react-native-modal |
| 31 | ``` | 28 | ``` |
| 32 | 29 | ||
| 33 | #### **yarn** | 30 | #### **yarn** |
| 34 | 31 | ||
| 35 | ```bash | 32 | ```bash |
| 36 | -# V13.0.1 | ||
| 37 | -yarn add @react-native-oh-tpl/react-native-modal | ||
| 38 | - | ||
| 39 | -# V14.0.1 | ||
| 40 | yarn add @react-native-ohos/react-native-modal | 33 | yarn add @react-native-ohos/react-native-modal |
| 41 | ``` | 34 | ``` |
| 42 | 35 | ||
| 43 | -<!-- tabs:end --> | 36 | +## Link |
| 37 | + | ||
| 38 | +| | Supported Autolink | Supported RN Version | | ||
| 39 | +| ------- | ------------------ | -------------------- | | ||
| 40 | +| ~13.0.2 | No | 0.72 | | ||
| 41 | +| ~13.0.1@deprecated | No | 0.72 | | ||
【AI-Review】【建议】【基础代码问题】【可读性问题】deprecated 版本号在版本表与 Link 表中不一致 ● 问题: 同一份 README 中存在两处版本声明不一致：
● 影响: 用户无法从文档确定 @react-native-oh-tpl/react-native-modal 的实际安装版本号，两处自相矛盾降低文档可信度；按 Link 表执行 ● 建议: 核对 npm 上 @react-native-oh-tpl/react-native-modal 的实际发布版本，在版本信息表（第 14 行）与 Link 表（第 41 行）使用完全一致的版本号字符串。 | |||
| 42 | + | ||
| 43 | +## Constraints | ||
| 44 | + | ||
| 45 | +### Compatibility | ||
| 46 | + | ||
| 47 | +This document is verified based on the following versions: | ||
| 48 | + | ||
| 49 | +1. RNOH: 0.72.139; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; | ||
| 50 | + | ||
| 51 | +## Example | ||
| 44 | 52 | ||
| 45 | The following code shows the basic use scenario of the repository: | 53 | The following code shows the basic use scenario of the repository: |
| 46 | 54 | ||
| @@ -131,84 +139,108 @@ const styles = StyleSheet.create({ | |||
| 131 | export default DefaultModal; | 139 | export default DefaultModal; |
| 132 | ``` | 140 | ``` |
| 133 | 141 | ||
| 134 | -## 2. Link | 142 | +## Available APIs |
| 135 | - | ||
| 136 | -| | Supported Autolink | Supported RN Version | | ||
| 137 | -| ------------------ | ------------------ | -------------------- | | ||
| 138 | -| ~14.0.1 | No | 0.77/0.82 | | ||
| 139 | -| ~13.0.2 | No | 0.72 | | ||
| 140 | -| ~13.0.1@deprecated | No | 0.72 | | ||
| 141 | - | ||
| 142 | -## 3. Constraints | ||
| 143 | - | ||
| 144 | -### 3.1 Compatibility | ||
| 145 | - | ||
| 146 | -Check the release version information in the release address of the third-party library: | ||
| 147 | - | ||
| 148 | -| Version | Release Information | Supported RN Version | | ||
| 149 | -| ----------------- | -------------------------------------------------------------------------------------------------------------------------- | -------------------- | | ||
| 150 | -| 14.0.1 | [@react-native-ohos/react-native-modal Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.77/0.82 | | ||
| 151 | -| 13.0.2 | [@react-native-ohos/react-native-modal Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-modal/releases) | 0.72 | | ||
| 152 | -| 13.0.1@deprecated | [@react-native-oh-tpl/react-native-modal Releases](https://github.com/react-native-oh-library/react-native-modal/releases) | 0.72 | | ||
| 153 | - | ||
| 154 | -## 4. Properties | ||
| 155 | 143 | ||
| 156 | > [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. | 144 | > [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. |
| 157 | 145 | ||
| 158 | -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. | 146 | +> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the OpenHarmony platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. |
【AI-Review】【一般】【基础代码问题】【可读性问题】TIP提示引用的列名与属性表实际列头不一致 ● 问题：README_en.md 第 146 行 TIP 提示引用了列名"HarmonyOS Support"（原文：If the value of HarmonyOS Support is yes），但第 156 行属性表的实际列头是"OpenHarmony Platform Support"，表中不存在名为"HarmonyOS Support"的列。同时 TIP 中使用"HarmonyOS"前缀而列头使用"OpenHarmony"前缀，命名不一致。此问题由本 PR 重命名列头时引入：旧版本列头为"HarmonyOS Support"（与旧版 TIP 引用一致），新版本将列头改为"OpenHarmony Platform Support"但未同步更新 TIP 中的列名引用，仅将描述中的"HarmonyOS platform"改为了"OpenHarmony platform"。 ● 影响：一般。用户按 TIP 提示查找名为"HarmonyOS Support"的列时找不到对应列，造成理解困惑；"HarmonyOS"与"OpenHarmony"前缀混用也降低文档一致性。 ● 建议：将 TIP 中的列名引用更新为实际列头"OpenHarmony Platform Support"，例如改为：If the value of OpenHarmony Platform Support is yes；并统一使用"OpenHarmony"或"HarmonyOS"前缀之一。 | |||
| 159 | 147 | ||
| 160 | -| Name | Description | Type | Default | Required | Platform | HarmonyOS Support | | 148 | +### Components |
| 161 | -| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------- | -------------------- | ------------------------------ | -------- | -------- | ----------------- | | ||
| 162 | -| animationIn | Modal show animation | `string` or `object` | "slideInUp" | no | all | yes | | ||
| 163 | -| animationInTiming | Timing for the modal show animation (in ms) | `number` | 300 | no | all | yes | | ||
| 164 | -| animationOut | Modal hide animation | `string` or `object` | "slideOutDown" | no | all | yes | | ||
| 165 | -| animationOutTiming | Timing for the modal hide animation (in ms) | `number` | 300 | no | all | yes | | ||
| 166 | -| avoidKeyboard | Move the modal up if the keyboard is open | `bool` | false | no | all | yes | | ||
| 167 | -| coverScreen | Will use RN `Modal` component to cover the entire screen wherever the modal is mounted in the component hierarchy | `bool` | true | no | all | yes | | ||
| 168 | -| hasBackdrop | Render the backdrop | `bool` | true | no | all | yes | | ||
| 169 | -| backdropColor | The backdrop background color | `string` | "black" | no | all | yes | | ||
| 170 | -| backdropOpacity | The backdrop opacity when the modal is visible | `number` | 0.70 | no | all | yes | | ||
| 171 | -| backdropTransitionInTiming | The backdrop show timing (in ms) | `number` | 300 | no | all | yes | | ||
| 172 | -| backdropTransitionOutTiming | The backdrop hide timing (in ms) | `number` | 300 | no | all | yes | | ||
| 173 | -| customBackdrop | The custom backdrop element | `node` | null | no | all | yes | | ||
| 174 | -| children | The modal content | `node` | **REQUIRED** | yes | all | yes | | ||
| 175 | -| deviceHeight | Device height (useful on devices that can hide the navigation bar) | `number` | null | no | all | yes | | ||
| 176 | -| deviceWidth | Device width (useful on devices that can hide the navigation bar) | `number` | null | no | all | yes | | ||
| 177 | -| isVisible | Show the modal? | `bool` | **REQUIRED** | yes | all | yes | | ||
| 178 | -| onBackButtonPress | Called when the Android back button is pressed | `func` | () => null | no | Android | yes | | ||
| 179 | -| onBackdropPress | Called when the backdrop is pressed | `func` | () => null | no | all | yes | | ||
| 180 | -| onModalWillHide | Called before the modal hide animation begins | `func` | () => null | no | all | yes | | ||
| 181 | -| onModalHide | Called when the modal is completely hidden | `func` | () => null | no | all | yes | | ||
| 182 | -| onModalWillShow | Called before the modal show animation begins | `func` | () => null | no | all | yes | | ||
| 183 | -| onModalShow | Called when the modal is completely visible | `func` | () => null | no | all | yes | | ||
| 184 | -| onSwipeStart | Called when the swipe action started | `func` | () => null | no | all | yes | | ||
| 185 | -| onSwipeMove | Called on each swipe event | `func` | (percentageShown) => null | no | all | yes | | ||
| 186 | -| onSwipeComplete | Called when the `swipeThreshold` has been reached | `func` | ({ swipingDirection }) => null | no | all | yes | | ||
| 187 | -| onSwipeCancel | Called when the `swipeThreshold` has not been reached | `func` | () => null | no | all | yes | | ||
| 188 | -| panResponderThreshold | The threshold for when the panResponder should pick up swipe events | `number` | 4 | no | all | no | | ||
| 189 | -| scrollOffset | When > 0, disables swipe-to-close, in order to implement scrollable content | `number` | 0 | no | all | no | | ||
| 190 | -| scrollOffsetMax | Used to implement overscroll feel when content is scrollable. See `/example` directory | `number` | 0 | no | all | yes | | ||
| 191 | -| scrollTo | Used to implement scrollable modal. See `/example` directory for reference on how to use it | `func` | null | no | all | yes | | ||
| 192 | -| scrollHorizontal | Set to true if your scrollView is horizontal (for a correct scroll handling) | `bool` | false | no | all | yes | | ||
| 193 | -| swipeThreshold | Swiping threshold that when reached calls `onSwipeComplete` | `number` | 100 | no | all | yes | | ||
| 194 | -| swipeDirection | Defines the direction where the modal can be swiped. Can be 'up', 'down', 'left', or 'right', or a combination of them like `['up','down']` | `string` or `array` | null | no | all | yes | | ||
| 195 | -| useNativeDriver | Defines if animations should use native driver | `bool` | false | no | all | yes | | ||
| 196 | -| useNativeDriverForBackdrop | Defines if animations for backdrop should use native driver (to avoid flashing on android) | `bool` | null | no | all | yes | | ||
| 197 | -| hideModalContentWhileAnimating | Enhances the performance by hiding the modal content until the animations complete | `bool` | false | no | all | no | | ||
| 198 | -| propagateSwipe | Allows swipe events to propagate to children components (eg a ScrollView inside a modal) | `bool` or `func` | false | no | all | no | | ||
| 199 | -| style | Style applied to the modal | `any` | null | no | all | yes | | ||
| 200 | 149 | ||
| 201 | -## 5. Static Methods | 150 | +| Name | Parameter Type | Required | Platform | OpenHarmony Platform Support | Description | |
| 151 | +| ----- | ---- | -------- | -------- | ------------------- | ---------------- | | ||
| 152 | +| Modal | / | yes | all | yes | Modal component | | ||
| 202 | 153 | ||
| 203 | -## 6. APIs | 154 | +### Properties |
| 204 | 155 | ||
| 205 | -## 7. Known Issues | 156 | +| Name | Parameter Type | Default Value | Required | Platform | OpenHarmony Platform Support | Description | |
| 157 | +| ------------------------------ | -------------------------------------------------------- | ------------------------------ | -------- | -------- | ---------------------------- | ------------------------------------------------------------ | | ||
| 158 | +| animationIn | `string` or `object` | "slideInUp" | no | all | yes | Modal show animation | | ||
| 159 | +| animationInTiming | `number` | 300 | no | all | yes | Duration of the modal show animation (ms) | | ||
| 160 | +| animationOut | `string` or `object` | "slideOutDown" | no | all | yes | Modal hide animation | | ||
| 161 | +| animationOutTiming | `number` | 300 | no | all | yes | Duration of the modal hide animation (ms) | | ||
| 162 | +| avoidKeyboard | `bool` | false | no | all | yes | Whether to move the modal up automatically when the keyboard appears | | ||
| 163 | +| coverScreen | `bool` | true | no | all | yes | Whether to cover the entire screen using the native Modal component | | ||
| 164 | +| hasBackdrop | `bool` | true | no | all | yes | Render the backdrop | | ||
| 165 | +| backdropColor | `string` | "black" | no | all | yes | Backdrop background color | | ||
| 166 | +| backdropOpacity | `number` | 0.70 | no | all | yes | Opacity of the backdrop when the modal is shown | | ||
| 167 | +| backdropTransitionInTiming | `number` | 300 | no | all | yes | Duration of the backdrop show animation (ms) | | ||
| 168 | +| backdropTransitionOutTiming | `number` | 300 | no | all | yes | Duration of the backdrop hide animation (ms) | | ||
| 169 | +| customBackdrop | `node` | null | no | all | yes | Custom backdrop element | | ||
| 170 | +| children | `node` | **REQUIRED** | yes | all | yes | Modal content | | ||
| 171 | +| deviceHeight | `number` | null | no | all | yes | Device height (applicable to devices with a hideable navigation bar) | | ||
| 172 | +| deviceWidth | `number` | null | no | all | yes | Device width (applicable to devices with a hideable navigation bar) | | ||
| 173 | +| isVisible | `bool` | **REQUIRED** | yes | all | yes | Whether to show the modal | | ||
| 174 | +| onBackButtonPress | `func` | () => null | no | Android | yes | Triggered when the back button is pressed on Android devices | | ||
| 175 | +| onBackdropPress | `func` | () => null | no | all | yes | Triggered when the backdrop is pressed | | ||
| 176 | +| onModalWillHide | `func` | () => null | no | all | yes | Triggered before the modal hide animation starts | | ||
| 177 | +| onModalHide | `func` | () => null | no | all | yes | Triggered after the modal is completely hidden | | ||
| 178 | +| onModalWillShow | `func` | () => null | no | all | yes | Triggered before the modal show animation starts | | ||
| 179 | +| onModalShow | `func` | () => null | no | all | yes | Triggered after the modal is completely shown | | ||
| 180 | +| onSwipeStart | `func` | () => null | no | all | yes | Triggered when a swipe starts | | ||
| 181 | +| onSwipeMove | `func` | (percentageShown) => null | no | all | yes | Called on each swipe event | | ||
| 182 | +| onSwipeComplete | `func` | ({ swipingDirection }) => null | no | all | yes | Triggered when the swipe threshold is reached | | ||
| 183 | +| onSwipeCancel | `func` | () => null | no | all | yes | Triggered when the swipe threshold is not reached | | ||
| 184 | +| panResponderThreshold | `number` | 4 | no | all | no | Threshold at which the touch responder starts recognizing swipe events | | ||
| 185 | +| scrollOffset | `number` | 0 | no | all | no | When greater than 0, disables swipe-to-close; used for scrollable content | | ||
| 186 | +| scrollOffsetMax | `number` | 0 | no | all | yes | Used to implement overscroll effects when content is scrollable | | ||
| 187 | +| scrollTo | `func` | null | no | all | yes | Used to implement a scrollable modal | | ||
| 188 | +| scrollHorizontal | `bool` | false | no | all | yes | Set to true when the scroll view scrolls horizontally (ensures correct scroll logic) | | ||
| 189 | +| swipeThreshold | `number` | 100 | no | all | yes | Swipe threshold that triggers the swipe-complete callback | | ||
| 190 | +| swipeDirection | `string` or `array` | null | no | all | yes | Defines the swipe direction(s) of the modal; supports a single value or an array combination of up/down/left/right | | ||
| 191 | +| useNativeDriver | `bool` | false | no | all | yes | Whether to use the native driver to run animations | | ||
| 192 | +| useNativeDriverForBackdrop | `bool` | null | no | all | yes | Whether the backdrop animation uses the native driver (avoids flicker on Android) | | ||
| 193 | +| hideModalContentWhileAnimating | `bool` | false | no | all | no | Hide the modal content before the animation completes to improve performance | | ||
| 194 | +| propagateSwipe | `bool` or `func` | false | no | all | no | Allow swipe events to propagate to child components (e.g., a scroll view inside the modal) | | ||
| 195 | +| style | `any` | null | no | all | yes | Style applied to the modal | | ||
| 196 | +| hardwareAccelerated | `bool` | false | no | android | no | Force GPU hardware-accelerated rendering for the Modal's independent window | | ||
| 197 | +| statusBarTranslucent | `bool` | false | no | android | no | The Modal layout extends through the system status bar so content can be drawn beneath it, enabling an immersive full-screen modal | | ||
| 198 | +| supportedOrientations | string[] | ['portrait', 'landscape'] | no | ios | no | Independently controls the screen orientations allowed for the current Modal, overriding the page's global orientation setting | | ||
| 199 | +| presentationStyle | 'fullScreen'\|'overFullScreen'\|'pageSheet'\|'formSheet' | fullScreen | no | ios | no | Modal display style | | ||
| 200 | +| onDismiss | `func` | () => void | no | ios | no | Callback triggered after the Modal close animation fully completes | | ||
| 201 | +| onShow | `func` | () => void | no | all | yes | Triggered after the Modal show animation completes and the modal is fully shown | | ||
| 202 | +| onOrientationChange | `func` | (orientation) => void | no | all | yes | Triggered when the device switches between portrait and landscape while the modal is shown; also fires once on first render, returning the current orientation | | ||
| 203 | + | ||
| 204 | +### API | ||
| 205 | + | ||
| 206 | +| Name | Type | Parameter Type | Return Value | Required | Platform | OpenHarmony Platform Support | Description | | ||
| 207 | +| ----- | -------- | -------------- | ------------ | -------- | -------- | ---------------------------- | ------------------------------------------------------------ | | ||
| 208 | +| open | function | / | / | no | all | yes | Open the modal imperatively via ref calls (`modalRef.current.open()`) | | ||
| 209 | +| close | function | / | / | no | all | yes | Close the modal imperatively via ref calls (`modalRef.current.close()`) | | ||
| 210 | + | ||
| 211 | +## Known Issues | ||
| 206 | 212 | ||
| 207 | - [ ] The hideModalContentWhileAnimating property has no effect; it’s an upstream community bug. | 213 | - [ ] The hideModalContentWhileAnimating property has no effect; it’s an upstream community bug. |
| 208 | - [ ] Consistent behavior across all three platforms. There are sliding conflict issues, and scrollOffset, propagateSwipe, and panResponderThreshold are not supported in this scenario. | 214 | - [ ] Consistent behavior across all three platforms. There are sliding conflict issues, and scrollOffset, propagateSwipe, and panResponderThreshold are not supported in this scenario. |
| 209 | 215 | ||
| 210 | -## 8. Others | 216 | +## Others |
| 211 | 217 | ||
| 212 | -## 9. License | 218 | +None. |
| 213 | 219 | ||
| 214 | -This project is licensed under [The MIT License (MIT)](https://github.com/react-native-modal/react-native-modal/blob/master/LICENSE.md). | 220 | +## Directory Structure |
| 221 | + | ||
| 222 | +```` | ||
| 223 | +/rntpc_react-native-modal # project root directory | ||
| 224 | +├── src # RN code (core library source) | ||
| 225 | +│ └─ index.ts # entry file, exports ReactNativeModal | ||
| 226 | +│ └─ modal.tsx # Modal core component implementation | ||
| 227 | +│ └─ modal.style.ts # animation / styles | ||
| 228 | +│ └─ types.ts # type definitions (ModalProps, animations, directions, etc.) | ||
| 229 | +│ └─ utils.ts # utility functions | ||
| 230 | +│ └─ global.d.ts # global type declarations | ||
【AI-Review】【一般】【基础代码问题】【可读性问题】目录结构文档了不存在的文件 global.d.ts ● 问题: 目录结构章节中列出了 ● 影响: 开发者按文档导航源码时找不到该文件，造成困惑；文档与实际代码不一致，降低文档可信度，后续维护者可能误以为该文件缺失是 bug 而去补建无意义的空文件。 ● 建议: 从目录结构中删除 | |||
| 231 | +├── dist # build output (published package entry dist/index.js) | ||
| 232 | +├── example # example demo | ||
| 233 | +├── package.json # package config, name: @react-native-ohos/react-native-modal | ||
| 234 | +├── tsconfig.json # TypeScript compile config | ||
| 235 | +├── buildEnv.sh # build environment script | ||
| 236 | +├── README.md # Chinese installation and usage guide | ||
| 237 | +└── README_en.md # English installation and usage guide | ||
| 238 | +```` | ||
| 239 | + | ||
| 240 | +## How to Contribute | ||
| 241 | + | ||
| 242 | +If you find any problem when using react-native-modal, submit an [issue](https://gitcode.com/CPF-RN/rntpc_react-native-modal/issues) or a [PR](https://gitcode.com/CPF-RN/rntpc_react-native-modal/pulls) . | ||
| 243 | + | ||
| 244 | +## License | ||
| 245 | + | ||
| 246 | +This project is based on the [MIT License](https://gitcode.com/CPF-RN/rntpc_react-native-modal/blob/master/LICENSE). Please feel free to enjoy and contribute to open source. | ||
【AI-Review】【一般】【基础代码问题】【可读性问题】TIP提示引用的列名与属性表实际列头不一致
● 问题：README.md 第 146 行 TIP 提示引用了列名"OpenHarmony Support"（原文："OpenHarmony Support"列为 yes 表示 OpenHarmony平台支持 该属性），但第 156 行属性表的实际列头是"HarmonyOS平台支持"，表中不存在名为"OpenHarmony Support"的列。同时 TIP 中使用"OpenHarmony"前缀而列头使用"HarmonyOS"前缀，命名不一致。此问题由本 PR 重命名列头时引入：旧版本列头为"HarmonyOS Support"（与旧版 TIP 引用一致），新版本将列头改为中文"HarmonyOS平台支持"但未同步更新 TIP 中的列名引用。
● 影响：一般。用户按 TIP 提示查找名为"OpenHarmony Support"的列时找不到对应列，造成理解困惑；"HarmonyOS"与"OpenHarmony"前缀混用也降低文档一致性。
● 建议：将 TIP 中的列名引用更新为实际列头"HarmonyOS平台支持"，例如改为："HarmonyOS平台支持"列为 yes 表示 OpenHarmony 平台支持该属性；或将列头统一改为"OpenHarmony平台支持"并同步更新 TIP 中的引用。建议全文档统一使用"OpenHarmony"或"HarmonyOS"前缀之一。