Skip to content

Simple Callout View for react-native which can be used on both iOS/Android

License

Notifications You must be signed in to change notification settings

mayuur/react-native-callout

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-callout

Simple Callout View for react-native which can be used on both iOS/Android

Content

Installation

npm install react-native-callout

Usage example

var MJCallout = require('react-native-callout');

var Application = React.createClass({
  render: function() {
    return (
      <View>
        <Text>
          MJCallout Example
        </Text>
        <View style={{position:'absolute', top:100, left:100}}>
          <MJCallout width={200} visibility={1} calloutText={"Sample Callout Text"} arrowDirection={'up'}>
          </MJCallout>
        </View>
      </View>
    );
  }
});

Properties

  • width (Number) - Width of the Callout (default is 200)
  • arrowDirection (Enum) - Directions for the arrow of the callout, namely: up, down, left & right
  • visibility (Number) - Set 0 for hiding the callout and 1 to show the callout
  • calloutText (String) - Text to be shown inside the callout,

Live example

git clone https://github.com/mayuur/react-native-callout.git
cd react-native-callout/examples
npm install
react-native run-ios
OR
react-native run-android

Additionally, you can open the iOS or Android Project and debug it accordingly

License

MIT License

Questions?

Feel free to create an issue or Talk to me @mayuur

About

Simple Callout View for react-native which can be used on both iOS/Android

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published