React Native: Native Tooltips

This library is a React Native bridge around native tooltips. It allows you to create simple tip views.

Note: Android SDK 27 > is supported

Android: florent37/ViewTooltip

iOS: calm/SexyTooltip

Before we dive into on how to use this library. We would like to thank all the contributor of florent37/ViewTooltip & calm/SexyTooltip libraries for providing such a awesome nice, cool library

Getting started

$ npm install react-native-tooltips --save

$ react-native link react-native-tooltips

• MAC

$ cd ./node_modules/react-native-tooltips/ios && pod install

Usage

import RNTooltips from 'react-native-tooltips';

• React Way

<RNTooltips text={"Long Press Description"} visible={this.state.visible} reference={this.state.reference} />

• API Way

RNTooltips.Show(
    this.state.reference,
    {
        text: 'Long Press Description'
    }
)

Props

Prop	Type	Default	Note
text	string		Text which needs to be displayed
position: Android	number		Position of the tooltip view. On iOS it is auto adjustable
align: Android	number		Alignment of tooltip
autoHide	bool		Should tip view get auto dismiss
duration	number		Duration after which tooltip view should be dismissed
clickToHide: iOS	bool		On click should tooltip view be dismissed
corner	number		Radius of corner
tintColor	string		Color of tooltip view background
textColor	string		Color of text
textSize	number		Size of text displayed
gravity	number		Gravity of text
visible	bool		Should tooltip be displayed
shadow	bool		Shadow on tooltip view
arrow: iOS	bool	true	Display Arrow
reference	object		Reference of react component of which you need tooltip
onHide	func		Callback function invoked on tooltip hide

Credits

• Android: florent37/ViewTooltip
• iOS: calm/SexyTooltip

Contribution

Contributions are welcome and are greatly appreciated! Every little bit helps, and credit will always be given.

License

This library is provided under the MIT License.

RNTooltips @ Pranav Raj Singh Chauhan

Other Contributions

awesome-react-native-native-modules

react-native-spruce

react-native-taptargetview & react-native-material-showcase-ios

react-native-bottom-action-sheet

react-native-popover-menu

react-native-shine-button

react-native-iconic

react-native-download-button

react-native-siri-wave-view

react-native-material-shadows

react-native-gradient-blur-view

react-native-about-libraries

vs-essential-plugins

prettier-pack