react-native-spk-time-picker

The component is a time selector. Allows you to select: hour, minutes and format (AM/PM). and get those selected values.

Installation

To install use the following commands:

npm install react-native-spk-time-picker

yarn add react-native-spk-time-picker

Simple Picker Component

Simple Usage

import TimePicker from react-native-spk-time-picker;

export default function App() {
 return (
    <View style={styles.container}>
      <TimePicker
        getTime={(values) => { console.log(values) }}
      />      
    </View >
  )
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
    padding: 10
  }
});

Custom Time Picker Component

Custom Usage

import TimePicker from react-native-spk-time-picker;

export default function App() {
 return (
    <View style={styles.container}>
      <TimePicker
        currentHour={12}
        currentMinutes={6}
        currentFormat={1}
        primaryColor="#4d4dff"
        arrowButtonStyle={{ width: 50, height: 50, borderRadius: 25, borderColor: "#4d4dff", padding: 0 }}
        textStyle={{ fontSize: 50 }}
        iconSize={30}
        radioButtonText={{ fontSize: 20 }}
        selectButtonStyle={{ backgroundColor: '#4d4dff', width: '100%' }}
        selectButtonTextStyle={{ color: '#fff' }}
        selectButtonText={"Seleccionar"}
        getTime={(values) => { console.log(values) }}
      />    
    </View >
  )
}

Props