ToolTip

Android Device	Android Emulator	iOS Device	iOS Simulator
✅	✅	✅	✅

• ToolTip(...)
• Intefaces
• Types

Installing

    ns plugin add @triniwiz/nativescript-tooltip

QuickStart

JavaScript

var tt = require('@triniwiz/nativescript-tooltip');

var options = {
	position: 'bottom',
	text: 'Hello 👋',
	backgroundColor: 'orange',
	textColor: 'blue',
};

var tooltip = new tt.ToolTip(viewToAnchor, options);

tooltip.show();

TypeScript

import { ToolTip, ToolTipConfig } from '@triniwiz/nativescript-tooltip';

const options: ToolTipConfig = {
	position: 'bottom',
	text: 'Hello 👋',
	backgroundColor: 'orange',
	textColor: 'blue',
};
const tooltip = new ToolTip(viewToAnchor, options);

tooltip.show();

API

ToolTip(...)

new ToolTip(...);

Creates new ToolTip

Param	Type	Note
view	View	The view to anchor to
config	ToolTipConfig

Returns: ToolTip

---

show()

 show(): void;

Shows the ToolTip

---

hide()

 shide(): void;

Hides the ToolTip

---

Interfaces

ToolTipConfig

Prop	Type	Notes
showArrow?	boolean	Show or Hide arrow
position?	ToolTipPosition	Set position of the tooltip bubble
text	string	Text to display
textSize?	number	Size of the text to be dislayed
duration?	number	Time to auto hide the tooltip
width?	Size of tooltip
backgroundColor?	string
textColor?	string
dismissOnTapOutside?	boolean
dismissOnTap?	boolean
padding?	number
arrowSize?	number
radius?	number
onShow?	Function	Called when the tooltip appears
onClick?	Function	Called when the tooltip is tapped
onDimiss?	Function	Called when the tooltip is hidden

Types

ToolTipPosition

"left" | "up" | "right" | "down";