Why We Need :

In today’s era, if you develop any application related to event and alarm then there are lot’s of functionality which is based on the calendar such as setting the event, setting the alarm, etc so let’s start the topic “How to open phone default calendar in react-native“.

Output is like –

• 

React native provide default functionality to open the phone calendar, so we follow these steps.

So we are going to learn how to add a calendar in android and iOS without using any third-party library.

Step1:

Import the linking from react native, because linking is a default functionality of react-native.

import { Linking } from 'react-native';

Step2:

Now we are going to implement the design part, where we click to open the calendar.

<TouchableOpacity 
 style={{
 borderWidth: 1, borderColor: 'rgba(223,102,58,1)', height: 30, width: 
 200, borderRadius: 15, alignContent: 'center', alignItems: 'center',justifyContent: 'center'}}
onPress={() => this.addCalendar()}>
<Text style={{ fontSize: 15, color: 'rgba(227,117,65,1)' }}>
Add to </Text><Text style={{ textDecorationLine: 'underline'}}> Calender </Text>
</ TouchableOpacity >

Step3:

Now we are ready to define the function for opening the calendar.

addCalendar() {
 if(Platform.OS === 'ios') {
    Linking.openURL('calshow:');
   } else if(Platform.OS === 'android') {
 Linking.openURL('content://com.android.calendar/time/');
}

that’s it, now you able to see your calendar and perform any operation on this

So the topic  “How to open phone default calendar in react-native is completed, “you can find the next issue list here.

and you can find my post on medium as well click here please follow me on medium as well.

And if any other query/issue then please comment.

Happy Coding Guyz.