NeXTSTEP Programming Mastermind

    nativescript-toasty-ns-7
    TypeScript icon, indicating that this package has built-in type declarations

    14.0.0 • Public • Published

    NativeScript-Toasty

    Build CI npm npm

    Install

    NativeScript 7.0+

    tns plugin add nativescript-toasty

    NativeScript < 7.0

    tns plugin add nativescript-toasty@3.0.0-alpha.2

    Usage

    TypeScript

    import { Toasty } from 'nativescript-toasty';
    import { isIOS } from '@nativescript/core/platform';
    // Toasty accepts an object for customizing its behavior/appearance. The only REQUIRED value is `text` which is the message for the toast.
    const toast = new Toasty({ text: 'Toast message' });
    toast.show();
     
    // you can also chain the methods together and there's no need to create a reference to the Toasty instance with this approach
    new Toasty({ text: 'Some Message' })
      .setToastDuration(ToastDuration.LONG)
      .setToastPosition(ToastPosition.BOTTOM)
      .setTextColor(new Color('white'))
      .setBackgroundColor('#ff9999')
      .show();
     
    // or you can set the properties of the Toasty instance
    const toasty = new Toasty({
      text: 'Somethign something...',
      position: ToastPosition.TOP,
      yAxisOffset: 100,
      xAxisOffset: 10,
      ios: {
        displayShadow: true,
        shadowColor: '#fff000',
        cornerRadius: 24,
      },
      anchorView: someButton.nativeView, // must be the native iOS/Android view instance (button, page, action bar, tabbar, etc.)
    });
     
    toasty.duration = ToastDuration.SHORT;
    toasty.textColor = '#fff';
    toasty.backgroundColor = new Color('purple');
    toasty.show();

    JavaScript

    var toasty = require('nativescript-toasty').Toasty;
    var toast = new toasty({ text: 'Toast message' });
    toast.show();

    API

     
      constructor(optsToastyOptions);
     
      positionToastPosition;
     
      durationToastDuration;
     
      textColorColor | string;
     
      backgroundColorColor | string;
     
      yAxisOffset?: Length | number;
     
      xAxisOffset?: Length | number;
     
      readonly widthnumber;
     
      readonly heightnumber;
     
     
      /**
       * Show the Toasty
       */
      show();
     
      /**
       * Cancels the Toasty
       */
      cancel();
     
    /**
     * Sets the Toast position.
     */
      setToastPosition(valueToastPosition)Toasty;
     
    /**
     * Sets the Toast duration.
     */
      setToastDuration(valueToastDuration)Toasty;
     
    /**
      * Set the text color of the toast.
      * @param value [Color | string] - Color of the string message.
      */
      setTextColor(valueColor | string)Toasty;
     
    /**
      * Set the background color of the toast.
      * @param value [Color |  string] - Color of the background.
      * On Android this currently removes the default Toast rounded borders.
      */
      setBackgroundColor(valueColor | string)Toasty;
    export enum ToastDuration {
      'SHORT',
      'LONG',
    }
     
    export enum ToastPosition {
      'BOTTOM',
      'BOTTOM_LEFT',
      'BOTTOM_RIGHT',
      'CENTER',
      'CENTER_LEFT',
      'CENTER_RIGHT',
      'TOP',
      'TOP_LEFT',
      'TOP_RIGHT',
    }
     
    export interface ToastyOptions {
      /**
       * Message text of the Toast.
       */
      text: string;
     
      /**
       * Duration to show the Toast.
       */
      duration?: ToastDuration;
     
      /**
       * Position of the Toast.
       */
      position?: ToastPosition;
     
      /**
       * Text color of the Toast message.
       */
      textColor?: Color | string;
     
      /**
       * Background Color of the Toast.
       */
      backgroundColor?: Color | string;
     
      /**
       * Android specific configuration options.
       */
      android?: any;
     
      /**
       * iOS Specific configuration options.
       */
      ios?: {
        /**
         * The native iOS view to anchor the Toast to.
         */
        anchorView?: any;
     
        /**
         * The number of lines to allow for the toast message.
         */
        messageNumberOfLines?: number;
     
        /**
         * The corner radius of the Toast.
         */
        cornerRadius?: number;
     
        /**
         * True to display a shadow for the Toast.
         */
        displayShadow?: boolean;
     
        /**
         * The color of the shadow. Only visible if `displayShadow` is true.
         */
        shadowColor?: Color | string;
      };
    }

    Install

    npm i nativescript-toasty-ns-7

    DownloadsWeekly Downloads

    7

    Version

    14.0.0

    License

    MIT

    Unpacked Size

    34.5 kB

    Total Files

    8

    Last publish

    Collaborators

    • avatar