Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/naturalclar/react-native-color-picker-ios
iOS14 UIColorPicker Module for react-native
https://github.com/naturalclar/react-native-color-picker-ios
color-picker hacktoberfest ios react-native typescript
Last synced: about 10 hours ago
JSON representation
iOS14 UIColorPicker Module for react-native
- Host: GitHub
- URL: https://github.com/naturalclar/react-native-color-picker-ios
- Owner: Naturalclar
- License: mit
- Created: 2020-10-12T11:57:35.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2024-09-09T20:58:33.000Z (2 months ago)
- Last Synced: 2024-11-02T21:48:40.253Z (11 days ago)
- Topics: color-picker, hacktoberfest, ios, react-native, typescript
- Language: Java
- Homepage:
- Size: 2.39 MB
- Stars: 111
- Watchers: 4
- Forks: 7
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# react-native-color-picker-ios
[![BuildStatus][build-badge]][build]
[![Version][version-badge]][package]
[![MIT License][license-badge]][license]
iOS14 Color Picker Module for React Native
| Grid | Spectrum | Sliders |
| --- | --- | --- |
| 
| 
| 
|
## Installation
- using `npm`:
```sh
npm install react-native-color-picker-ios
```
- using `yarn`:
```sh
yarn add react-native-color-picker-ios
```
## Usage
```jsx
import * as React from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import ColorPicker from 'react-native-color-picker-ios';
const ColorSelectComponent = () => {
const handlePress = () => {
ColorPicker.showColorPicker(
{ supportsAlpha: true, initialColor: 'cyan' },
(color) => {
console.log(color);
}
);
};
return (
Click to Select Color
);
};
```
## Reference
### Methods
### `showColorPicker()`
```jsx
ColorPicker.showColorPicker(options, callback);
```
Displays the color picker modal, and runs callback function with selected color.
#### Options
| Name | Type | Required | default | Description |
| ------------- | ------- | -------- | ------- | ---------------------------------------------------------- |
| supportsAlpha | boolean | NO | false | if `true`, user are allowed to chose opacity of the color. |
| initialColor | string | NO | `#000` | sets initialColor selected by the picker |
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT
[build-badge]: https://github.com/Naturalclar/color-picker-ios/workflows/Build/badge.svg
[build]: https://github.com/Naturalclar/color-picker-ios/actions
[version-badge]: https://img.shields.io/npm/v/react-native-color-picker-ios.svg?style=flat-square
[package]: https://www.npmjs.com/package/react-native-color-picker-ios
[license-badge]: https://img.shields.io/npm/l/react-native-color-picker-ios.svg?style=flat-square
[license]: https://opensource.org/licenses/MIT