diff --git a/README.md b/README.md index f37de3bd..f4b54aff 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,16 @@ # `@react-native-community/segmented-control` -![CircleCI branch][circle-ci-badge] ![npm][npm-badge] [![Lean Core Extracted][lean-core-badge]][lean-core-issue] +![Supports iOS and Android][support-badge]![CircleCI branch][circle-ci-badge] ![npm][npm-badge] [![Lean Core Extracted][lean-core-badge]][lean-core-issue] + +React Native SegmentedControl library. Use SegmentedControl to render a UISegmentedControl iOS. + +For Android, it has a js implementation that mocks iOS 13 style of UISegmentedControl. + +| iOS | Android | +| --- | ---- | +| | | -React Native SegmentedControlIOS library. Use SegmentedControlIOS to render a UISegmentedControl iOS. - ## Getting started @@ -49,14 +55,14 @@ import {SegmentedControlIOS} from 'react-native'; to: ```javascript -import SegmentedControlIOS from '@react-native-community/segmented-control'; +import SegmentedControl from '@react-native-community/segmented-control'; ``` ## Usage Start by importing the library: -Use `SegmentedControlIOS` to render a UISegmentedControl iOS. +Use `SegmentedControl` to render a UISegmentedControl iOS. #### Programmatically changing selected index @@ -66,10 +72,10 @@ Note that the state variable would need to be updated as the user selects a value and changes the index, as shown in the example below. ```javascript -import SegmentedControlIOS from '@react-native-community/segmented-control'; +import SegmentedControl from '@react-native-community/segmented-control'; return ( - { @@ -101,9 +107,9 @@ If false the user won't be able to interact with the control. Default value is t If true, then selecting a segment won't persist visually. The `onValueChange` callback will still work as expected. -| Type | Required | -| ---- | -------- | -| bool | No | +| Type | Required | Platform | +| ---- | -------- | ---- | +| bool | No | iOS | --- @@ -190,9 +196,9 @@ The labels for the control's segment buttons, in order. (iOS 13 only) Overrides the control's appearance irrespective of the OS theme -| Type | Required | -| --------------- | -------- | -| 'dark' | 'light' | No | +| Type | Required | Platform | +| --------------- | -------- | ---- | +| 'dark' | 'light' | No | iOS | ## Maintainers @@ -211,3 +217,4 @@ The library is released under the MIT licence. For more information see [`LICENS [npm-badge]: https://img.shields.io/npm/v/@react-native-community/segmented-control.svg?style=flat-square [lean-core-badge]: https://img.shields.io/badge/Lean%20Core-Extracted-brightgreen.svg?style=flat-square [lean-core-issue]: https://github.com/facebook/react-native/issues/23313 +[support-badge]:https://img.shields.io/badge/platforms-android%20|%20ios-lightgrey.svg?style=flat-square