react-native-scroll-month-calendar

The package allows you accept create a horizontal month calender and its content , quick easy and fast .

Compatibility

Our release cycle is independent of react-native. We follow semver and here is the compatibility table:

@react-native-scroll-month-calendar	react-native
^0.0.8	^0.59

Installation

Add react-native-scroll-month-calendar to your project by running;

npm install react-native-scroll-month-calendar

or

yarn add react-native-scroll-month-calendar

and that's it, you're all good to go!

Usage

import {ScrollMonthCalender} from 'react-native-scroll-month-calender'
import React, {Component} from 'react';
import {View} from 'react-native';

class MyApp extends Component {
   myHistory= [
          {month:"January", content: "jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"February", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"March", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"April", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"May", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"June", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"July", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"August", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"September", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"October", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"November", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"},
        {month:"December", content:"jdjjdjdjdjdjdjdjdjdjdjdjd"}
    ]
  render() {
    return (
      <View style={{flex: 1}}>
         <ScrollMonthCalender history={myHistory} monthTextStyle={}, contentTextStyle={} 
         style={{marginTop:100}} onMonthChange={()=>{}}/>
        />
      </View>
    );
  }
}

Note:

You can also make use of the new props enableDefaultStyles to use the default style.

Don't forget to star, like and share :)