@nativescript-community/ui-material-snackbar
Material Design Snackbars provide brief messages about app processes at the bottom of the screen.
npm i --save @nativescript-community/ui-material-snackbar

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

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));
}