diff --git a/README.md b/README.md index 1957ef4097e806651c9e2cb7db5c418b44d5a69f..57d081049cfbc26dfdd67000af1c4e154466cb03 100644 --- a/README.md +++ b/README.md @@ -40,8 +40,8 @@ | 13 | [@react-native-community/toolbar-android](https://github.com/react-native-toolbar-android/toolbar-android) | 0.2.1 | 是 | [@react-native-oh-tpl/toolbar-android](https://github.com/react-native-oh-library/toolbar-android/releases) | [链接](/zh-cn/react-native-community-toolbar-android.md) | | 14 | [@react-native-cookies/cookies](https://github.com/react-native-cookies/cookies) | 6.2.1 | 否 | [@react-native-oh-tpl/cookies](https://github.com/react-native-oh-library/react-native-cookies/releases) | [链接](/zh-cn/react-native-cookies-cookies.md) | | 15 | [@react-native-masked-view/masked-view](https://github.com/react-native-masked-view/masked-view) | 0.2.9 | 否 | [@react-native-oh-tpl/masked-view](https://github.com/react-native-oh-library/masked-view/releases) | [链接](/zh-cn/react-native-masked-view-masked-view.md) | -| 16 | [@react-native-picker/picker](https://github.com/react-native-picker/picker) | 2.5.1 | 是 | [@react-native-oh-tpl/picker](https://github.com/react-native-oh-library/picker/releases) | [链接](/zh-cn/react-native-picker-picker.md) | -| 17 | [@react-native-segmented-control/segmented-control](https://github.com/react-native-segmented-control/segmented-control) | 2.5.0 | \- | \- | [链接](/zh-cn/react-native-community-segmented-control.md) | +| 16 | [@react-native-picker/picker](https://github.com/react-native-picker/picker) | 2.5.1 | 是 | [@react-native-oh-tpl/picker](https://github.com/react-native-oh-library/picker/releases)| [链接](/zh-cn/react-native-picker-picker.md)| +| 17 | [@react-native-segmented-control/segmented-control](https://github.com/react-native-segmented-control/segmented-control) | 2.5.2 | 否 |[@react-native-oh-tpl/segmented-control](https://github.com/react-native-oh-library/segmented-control/releases)| [链接](/zh-cn/react-native-segmented-control-segmented-control.md) | | 18 | [@react-navigation/bottom-tabs](https://github.com/react-navigation/react-navigation/tree/6.x/packages/bottom-tabs) | 6.5.11 | \- | \- | [链接](/zh-cn/react-navigation-bottom-tabs.md) | | 19 | [@react-navigation/elements](https://github.com/react-navigation/react-navigation/tree/6.x/packages/elements) | 1.3.21 | \- | [@react-native-oh-tpl/elements](https://github.com/react-native-oh-library/react-navigation/releases) | [链接](/zh-cn/react-navigation-elements.md) | | 20 | [@react-navigation/native](https://github.com/react-navigation/react-navigation/tree/6.x/packages/native) | 6.1.9 | \- | \- | [链接](/zh-cn/react-navigation-native.md) | diff --git a/_sidebar.md b/_sidebar.md index ec9785e1f762d51c58b34aeff439ab5ac8ddfe8b..e7f88855320f7eb037acedcd9d0f12379d114a5b 100644 --- a/_sidebar.md +++ b/_sidebar.md @@ -59,7 +59,7 @@ - [react-i18next](/zh-cn/react-i18next.md) - [react-native-action-button](/zh-cn/react-native-action-button.md) - [react-native-autoheight-webview](/zh-cn/react-native-autoheight-webview.md) - - [@react-native-community/segmented-control](/zh-cn/react-native-community-segmented-control.md) + - [@react-native-segmented-control/segmented-control](/zh-cn/react-native-segmented-control-segmented-control.md) - [react-native-dotenv](/zh-cn/react-native-dotenv.md) - [react-native-qrcode-svg](/zh-cn/react-native-qrcode-svg.md) - [react-native-render-html](/zh-cn/react-native-render-html.md) diff --git a/zh-cn/README.md b/zh-cn/README.md index f790c7b41d5ac029d0d2a4bff21da855b2989310..714bed79834d691316534600e23d6f0c0e27793a 100644 --- a/zh-cn/README.md +++ b/zh-cn/README.md @@ -41,7 +41,7 @@ | 14 | [@react-native-cookies/cookies](https://github.com/react-native-cookies/cookies) | 6.2.1 | 否 | [@react-native-oh-tpl/cookies](https://github.com/react-native-oh-library/react-native-cookies/releases) | [链接](/zh-cn/react-native-cookies-cookies.md) | | 15 | [@react-native-masked-view/masked-view](https://github.com/react-native-masked-view/masked-view) | 0.2.9 | 否 | [@react-native-oh-tpl/masked-view](https://github.com/react-native-oh-library/masked-view/releases) | [链接](/zh-cn/react-native-masked-view-masked-view.md) | | 16 | [@react-native-picker/picker](https://github.com/react-native-picker/picker) | 2.5.1 | 是 | [@react-native-oh-tpl/picker](https://github.com/react-native-oh-library/picker/releases) | [链接](/zh-cn/react-native-picker-picker.md) | -| 17 | [@react-native-segmented-control/segmented-control](https://github.com/react-native-segmented-control/segmented-control) | 2.5.0 | \- | \- | [链接](/zh-cn/react-native-community-segmented-control.md) | +| 17 | [@react-native-segmented-control/segmented-control](https://github.com/react-native-segmented-control/segmented-control) | 2.5.2 | 否 | [@react-native-oh-tpl/segmented-control](https://github.com/react-native-oh-library/segmented-control/releases) | [链接](/zh-cn/react-native-segmented-control-segmented-control.md) | | 18 | [@react-navigation/bottom-tabs](https://github.com/react-navigation/react-navigation/tree/6.x/packages/bottom-tabs) | 6.5.11 | \- | \- | [链接](/zh-cn/react-navigation-bottom-tabs.md) | | 19 | [@react-navigation/elements](https://github.com/react-navigation/react-navigation/tree/6.x/packages/elements) | 1.3.21 | \- | [@react-native-oh-tpl/elements](https://github.com/react-native-oh-library/react-navigation/releases) | [链接](/zh-cn/react-navigation-elements.md) | | 20 | [@react-navigation/native](https://github.com/react-navigation/react-navigation/tree/6.x/packages/native) | 6.1.9 | \- | \- | [链接](/zh-cn/react-navigation-native.md) | diff --git a/zh-cn/react-native-community-segmented-control.md b/zh-cn/react-native-segmented-control-segmented-control.md similarity index 73% rename from zh-cn/react-native-community-segmented-control.md rename to zh-cn/react-native-segmented-control-segmented-control.md index a8a8873f9f2fadc46102be32b7a15f4504b2ba45..fda1d67e2f5905af17c3008813c7a4bf45e8c72f 100644 --- a/zh-cn/react-native-community-segmented-control.md +++ b/zh-cn/react-native-segmented-control-segmented-control.md @@ -1,4 +1,3 @@ - > 模板版本：v0.2.2

@@ -13,30 +12,37 @@

-> [!TIP] [Github 地址](https://github.com/react-native-segmented-control/segmented-control) +> [!TIP] [Github 地址](https://github.com/react-native-oh-library/segmented-control) ## 安装与使用 +请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/segmented-control Releases](https://github.com/react-native-oh-library/segmented-control/releases)，并下载适用版本的 tgz 包。 + + 进入到工程目录并输入以下命令： +> [!TIP] # 处替换为 tgz 包的路径 + #### **npm** ```bash -npm install @react-native-segmented-control/segmented-control@2.5.0 +npm install @react-native-oh-tpl/segmented-control@file:# ``` #### **yarn** ```bash -yarn add @react-native-segmented-control/segmented-control@2.5.0 +yarn add @react-native-oh-tpl/segmented-control@file:# ``` 下面的代码展示了这个库的基本使用场景： +> [!WARNING] 使用时 import 的库名不变。 + ```js import React, { useState, useEffect } from "react"; import SegmentedControl from "@react-native-segmented-control/segmented-control"; @@ -61,11 +67,9 @@ export const MSegmentedControl: React.FC = (): JSX.Element => { ### 兼容性 -本文档内容基于以下版本验证通过： +要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -1. RNOH：0.72.11; SDK：OpenHarmony(api11) 4.1.0.53; IDE：DevEco Studio 4.1.3.412; ROM：2.0.0.52; -2. RNOH：0.72.13; SDK：HarmonyOS NEXT Developer Preview1; IDE：DevEco Studio 4.1.3.500; ROM：2.0.0.58; -3. RNOH：0.72.27; SDK：HarmonyOS-Next-DB1 5.0.0.29(SP1) ; IDE：DevEco Studio 5.0.3.400; ROM：3.0.0.25; +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/segmented-control Releases](https://github.com/react-native-oh-library/segmented-control/releases) ## 属性 @@ -73,26 +77,26 @@ export const MSegmentedControl: React.FC = (): JSX.Element => { > [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 -详情见 [react-native-community/segmented-control 源库地址](https://github.com/react-native-segmented-control/segmented-control) +详情见 [@react-native-segmented-control/segmented-control 源库地址](https://github.com/react-native-segmented-control/segmented-control) | Name | Description | Type | Required | Platform | HarmonyOS Support | | ------------------------- | ---------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| enabled | If false the user won't be able to interact with the control. Default value is true. | boolean | No | All | Yes | -| momentary | If true, then selecting a segment won't persist visually. The onValueChange callback will still work as expected. | boolean | No | iOS | No | -| onChange | Callback that is called when the user taps a segment; passes the event as an argument | function | No | All | Yes | -| onValueChange | Callback that is called when the user taps a segment; passes the segment's value as an argument | function | No | All | Yes | -| selectedIndex | The index in props.values of the segment to be (pre)selected. | number | No | All | Yes | -| tintColor | Accent color of the control. | string | No | All | Yes | -| backgroundColor | Background color color of the control. | string | No | All | Yes | -| values | The labels for the control's segment buttons, in order. | string | Yes | All | Yes | -| appearance | Overrides the control's appearance irrespective of the OS theme | 'dark', 'light' | No | All | Yes | -| fontStyle | An object container,color: color of segment;fontSize: font-size of segment text;fontFamily: font-family of segment text;fontWeight: font-weight of segment text | object | No | All | Yes | -| activeFontStyle | An object container,color: overrides color of selected segment text;fontSize: overrides font-size of selected segment text;fontFamily: overrides font-family of selected segment text;fontWeight: overrides font-weight of selected segment text | object | No | All | Yes | -| tabStyle | Styles the clickable surface which is responsible to change tabs | object | No | Android, Web | Yes | +| enabled | If false the user won't be able to interact with the control. Default value is true. | boolean | No | iOS，Android | Yes | +| momentary | If true, then selecting a segment won't persist visually. The onValueChange callback will still work as expected. | boolean | No | iOS | Yes | +| onChange | Callback that is called when the user taps a segment; passes the event as an argument | function | No | iOS，Android | Yes | +| onValueChange | Callback that is called when the user taps a segment; passes the segment's value as an argument | function | No | iOS，Android | Yes | +| selectedIndex | The index in props.values of the segment to be (pre)selected. | number | No | iOS，Android | Yes | +| tintColor | Accent color of the control. | string | No | iOS，Android | Yes | +| backgroundColor | Background color color of the control. | string | No | iOS，Android | Yes | +| values | The labels for the control's segment buttons, in order. | string | Yes | iOS，Android | Yes | +| appearance | Overrides the control's appearance irrespective of the OS theme | 'dark', 'light' | No | iOS，Android | Yes | +| fontStyle | An object container,color: color of segment;fontSize: font-size of segment text;fontFamily: font-family of segment text;fontWeight: font-weight of segment text | object | No | iOS，Android | Yes | +| activeFontStyle | An object container,color: overrides color of selected segment text;fontSize: overrides font-size of selected segment text;fontFamily: overrides font-family of selected segment text;fontWeight: overrides font-weight of selected segment text | object | No | iOS，Android | Yes | +| tabStyle | Styles the clickable surface which is responsible to change tabs | object | No | Android | Yes | ## 遗留问题 -- [ ] @react-native-segmented-control/segmented-control 的fontFamily属性未实现 HarmonyOS 化: [issue#858](https://github.com/react-native-segmented-control/segmented-control/issues/858) -- [ ] @react-native-segmented-control/segmented-control 的momentary属性未实现 HarmonyOS 化: [issue#868](https://github.com/react-native-segmented-control/segmented-control/issues/868) +- [x] @react-native-segmented-control/segmented-control 的momentary属性未实现 HarmonyOS 化: [issue#868](https://github.com/react-native-segmented-control/segmented-control/issues/868) +- [x] @react-native-segmented-control/segmented-control 的fontFamily属性未实现 HarmonyOS 化: [issue#858](https://github.com/react-native-segmented-control/segmented-control/issues/858) ## 其他 @@ -100,4 +104,3 @@ export const MSegmentedControl: React.FC = (): JSX.Element => { 本项目基于 [The MIT License (MIT)](https://github.com/react-native-segmented-control/segmented-control/blob/master/LICENSE) ，请自由地享受和参与开源。 - \ No newline at end of file