React-native-platform-specific-hook-selector NPM

react-native-platform-specific-hook-selector

Hook based simple wrapper for actionSheetIOS and native android picker. under the hood on IOS it uses actionSheetIOS and on android react-native-dialogs(because native android Picker don't have any method for calling it programmatically)

Showcase IOS	Showcase Android

Installation

npm i react-native-platform-specific-hook-selector react-native-dialogs --save

or

yarn add react-native-platform-specific-hook-selector react-native-dialogs

Example

import React, {useEffect} from 'react';
import {SafeAreaView, Text, StatusBar, Button, Alert} from 'react-native';

import useBaseActionSheetPicker from 'react-native-platform-specific-hook-selector';

const App = () => {
  const {selectedItem, renderPicker} = useBaseActionSheetPicker({
    cancelText: 'Cancel',
    title: 'Choose color',
  });

  useEffect(() => {
    if (selectedItem) {
      Alert.alert(selectedItem);
    }
  }, [selectedItem]);

  return (
    <>
      <StatusBar barStyle="dark-content" />
      <SafeAreaView>
        <Button
          onPress={() => renderPicker(['green', 'blue', 'red'])}
          title={'Choose color'}
        />
        <Text>{selectedItem}</Text>
      </SafeAreaView>
    </>
  );
};

export default App;