A React Native bridge around native tooltips

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

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
reference	object		Reference of react component of which you need tooltip
onHide	func		Callback function invoked on tooltip hide

GitHub