react-native-countdown-picker

A wrapper on top of ActionSheetPicker-3.0 for displaying countdown timer in an actionsheet

Installation

1npm i --save react-native-countdown-picker

You need CocoaPods to install ActionSheetPicker-3.0. To integrate ActionSheetPicker-3.0 into your Xcode project using CocoaPods, specify it in your Podfile:

1pod 'ActionSheetPicker-3.0'

Then, run the following command:

1$ pod install

Add it to your iOS project

1. Run npm install react-native-countdown-picker --save
2. Open your project in XCode, right click on Libraries and click Add Files to "Your Project Name" (Screenshot) then (Screenshot).
3. Add libCJCountDownPicker.a to Build Phases -> Link Binary With Libraries (Screenshot).
4. Whenever you want to use it within React code now you can: var CountDownPicker = require('NativeModules').CountDownPicker;

Example

1var CountDownPicker = require('NativeModules').CountDownPicker;
2
3var ExampleApp = React.createClass({
4  showPicker: function() {
5    CountDownPicker.showCountDownPickerWithOptions({
6      title: 'show', //optional
7      countDownDuration: '' //optional intial time
8    }, (cancelled, duration) => {
9        if(cancelled) {
10          AlertIOS.alert('Error', 'select a time');
11        }
12        //duration is in seconds.
13    });
14  },  
15  render: function() {
16    return (
17      <TouchableHighlight
18            onPress={this.showPicker}
19            underlayColor="#f7f7f7">
20	      <View style={styles.container}>
21	        <Image source={require('image!announcement')} style={styles.image} />
22	      </View>
23	   </TouchableHighlight>
24    );
25  }
26});