@nativescript-community/ui-material-snackbar

Material Design Snackbars provide brief messages about app processes at the bottom of the screen.
14,425 234
Install
npm install @nativescript-community/ui-material-snackbar
Latest Version:7.3.4
License:Apache-2.0
Last Updated:Oct 12, 2026
Links: GitHub  ·  npm
Maintainer: classicoldsong

NativeScript Material Snackbar

Material Design's Snackbar component for NativeScript.

npm npm

Contents

  1. Installation
  2. Changelog
  3. FAQ
  4. Usage

Installation

For NativeScript 7.0+

  • tns plugin add @nativescript-community/ui-material-snackbar

For NativeScript 6.x

  • tns plugin add nativescript-material-snackbar

If using tns-core-modules

  • tns plugin add nativescript-material-snackbar@2.5.4

Be sure to run a new build after adding plugins to avoid any issues.

Changelog

FAQ

Usage

TypeScript

import { SnackBar } from '@nativescript-community/ui-material-snackbar';

const snackbar = new SnackBar();

export function showSimpleSnackbar() {
    snackbar.simple(`I'm a simple snackbar`).then(result => console.log('Simple Snackbar:', result));
}

export function showActionSnackbar() {
    snackbar
        .action({
            message: `I'm a snackbar with an action`,
            actionText: 'Dismiss',
            hideDelay: 2000
        })
        .then(result => console.log('Action Snackbar:', result));
}

export function showColorfulSnackbar() {
    snackbar
        .action({
            message: `I'm a colorful snackbar`,
            textColor: 'blue',
            actionTextColor: 'yellow',
            backgroundColor: 'green',
            actionText: 'Dismiss',
            hideDelay: 2000
        })
        .then(result => console.log('Action Snackbar:', result));
}

Related Packages

@nativescript-community/ui-material-tabs

Material Design Tabs organize content across different screens, data sets, and o...

104,643 234
@nativescript-community/ui-material-ripple

The Material Design Ripple component provides a radial action in the form of a v...

64,491 234
@nativescript-community/ui-material-bottomsheet

Material Design Bottom Sheets slide up from the bottom of the screen to reveal m...

32,000 234
@nativescript-community/ui-material-dialogs

Material Design Dialogs inform users about a task and can contain critical infor...

18,310 234
@nativescript-community/ui-material-textfield

Material Design Text fields allow users to input text into your app.

16,446 234

Version History

Version Released License
7.3.4 Apache-2.0
7.3.3 Apache-2.0
7.3.2 Apache-2.0
7.3.1 Apache-2.0
7.3.0 Apache-2.0
Pre-releases (3)
Version Released License
6.2.14-alpha.1 Apache-2.0
6.2.14-alpha.0 Apache-2.0
5.4.0-alpha.4 Apache-2.0