NativeScript ToolTip

Install

tns plugin add nativescript-tooltip

Usage

TypeScript

import {ToolTip} from "nativescript-tooltip";
const tip = new ToolTip(view,{text:"Some Text"});
tip.show();  //.hide()

JavaScript

const ToolTip = require("nativescript-tooltip").ToolTip;
const tip = new ToolTip(view,{text:"Some Text"});
tip.show();  //.hide()

Styling

Android

Add the following to your styles.xml in app/App_Resources/Android/values

<!-- Custom ToolTip -->

    <style name="CustomToolTipLayoutStyle" parent="ToolTipLayoutDefaultStyle">
        <item name="ttlm_backgroundColor">#FFFF00</item>
        <item name="android:textColor">#000000</item>
    </style>

IOS

TypeScript

import {ToolTip} from "nativescript-tooltip";
const tip = new ToolTip(view,{text:"Some Text",backgroundColor:"pink",textColor:"black"});
tip.show();  //.hide()

JavaScript

const ToolTip = require("nativescript-tooltip").ToolTip;
const tip = new ToolTip(view,{text:"Some Text",backgroundColor:"pink",textColor:"black"});
tip.show();  //.hide()

Config

const config = {
  position?: "left" | "up" | "right" | "down" | "top" | "bottom";;
  text: string;
  viewType?: "native";
  duration?: number;
  fadeDuration?: number,
  width?: number;
  delay?: number;
  hideArrow?: boolean;
  backgroundColor?: string;
  textColor?: string;
  style?:string;
}

ScreenShots

Android | IOS --------- | ---------- |