@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.
Contents
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 | |
| 7.2.80 | Apache-2.0 | |
| 7.2.79 | Apache-2.0 | |
| 7.2.78 | Apache-2.0 | |
| 7.2.77 | Apache-2.0 | |
| 7.2.71 | Apache-2.0 | |
| 7.2.70 | Apache-2.0 | |
| 7.2.69 | Apache-2.0 | |
| 7.2.68 | Apache-2.0 | |
| 7.2.67 | Apache-2.0 | |
| 7.2.66 | Apache-2.0 | |
| 7.2.65 | Apache-2.0 | |
| 7.2.64 | Apache-2.0 | |
| 7.2.63 | Apache-2.0 | |
| 7.2.62 | Apache-2.0 | |
| 7.2.61 | Apache-2.0 | |
| 7.2.60 | Apache-2.0 | |
| 7.2.59 | Apache-2.0 | |
| 7.2.58 | Apache-2.0 | |
| 7.2.57 | Apache-2.0 | |
| 7.2.55 | Apache-2.0 | |
| 7.2.54 | Apache-2.0 | |
| 7.2.53 | Apache-2.0 | |
| 7.2.52 | Apache-2.0 | |
| 7.2.50 | Apache-2.0 | |
| 7.2.49 | Apache-2.0 |
Showing the latest 30 of 257. See every release on npm
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 |