All Projects → bradmartin → nativescript-snackbar

bradmartin / nativescript-snackbar

Licence: Apache-2.0 license
🍭 🍫 NativeScript plugin for Material Design SnackBar

Programming Languages

javascript
184084 projects - #8 most used programming language
typescript
32286 projects
CSS
56736 projects
shell
77523 projects
Vue
7211 projects
HTML
75241 projects
ruby
36898 projects - #4 most used programming language

Projects that are alternatives of or similar to nativescript-snackbar

nativescript-ng2-drawer-seed
Nativescript template project with drawer support
Stars: ✭ 17 (-77.03%)
Mutual labels:  nativescript
nativescript-dev-webpack
A package to help with webpacking NativeScript apps.
Stars: ✭ 98 (+32.43%)
Mutual labels:  nativescript
nativescript-app-icon-changer
Change the homescreen icon of your NativeScript iOS app at runtime!
Stars: ✭ 16 (-78.38%)
Mutual labels:  nativescript
nativescript-ng-shadow
Angular directive to apply shadows to native elements according to the elevation level guidelines of material design specification
Stars: ✭ 54 (-27.03%)
Mutual labels:  nativescript
nativescript-fancy-calendar
Fancy calendar for NativeScript 😄 🍻
Stars: ✭ 21 (-71.62%)
Mutual labels:  nativescript
nativescript-apple-sign-in
Sign In With Apple, as seen on WWDC 2019, available with iOS 13
Stars: ✭ 37 (-50%)
Mutual labels:  nativescript
Sudoku
The classic game in its brand new, modern shape. Badges, points & leaderboards included.
Stars: ✭ 13 (-82.43%)
Mutual labels:  nativescript
angular2-webpack-advance-starter
An advanced Angular2 Webpack Starter project with support for ngrx/store, ngrx/effects, ng2-translate, angulartics2, lodash, NativeScript (*native* mobile), Electron (Mac, Windows and Linux desktop) and more.
Stars: ✭ 49 (-33.78%)
Mutual labels:  nativescript
nativescript-vue-rollup-template
A NativeScript template ready to roll with Vue.js and .vue files.
Stars: ✭ 39 (-47.3%)
Mutual labels:  nativescript
nativescript-windowed-modal
Consistent modals for Android and iOS
Stars: ✭ 47 (-36.49%)
Mutual labels:  nativescript
nativescript-image-filters
NativeScript plugin to apply filters to images
Stars: ✭ 30 (-59.46%)
Mutual labels:  nativescript
nativescript-menu
A plugin that adds a pop-up menu to NativeScript
Stars: ✭ 17 (-77.03%)
Mutual labels:  nativescript
nativescript-angular-web-starter
A starter project to create web and native mobile apps using nativescript and angular with single shared code base.
Stars: ✭ 47 (-36.49%)
Mutual labels:  nativescript
nativescript-dev-typescript
TypeScript support for NativeScript projects
Stars: ✭ 20 (-72.97%)
Mutual labels:  nativescript
nativescript-pushy
Easy push notifications for your NativeScript app!
Stars: ✭ 19 (-74.32%)
Mutual labels:  nativescript
nativescript-loading-indicator
NativeScript Loading Indicator plugin
Stars: ✭ 48 (-35.14%)
Mutual labels:  nativescript
nativescript-numeric-keyboard
🔢 Replace the meh default number/phone keyboard with this stylish one
Stars: ✭ 33 (-55.41%)
Mutual labels:  nativescript
nativescript-vue-examples
🍈 NativeScript and Vue code samples.
Stars: ✭ 13 (-82.43%)
Mutual labels:  nativescript
nativescript-taptic-engine
📳 Use Apple's Taptic Engine to vibrate your iPhone 6s (and up) in a variety of ways
Stars: ✭ 16 (-78.38%)
Mutual labels:  nativescript
nativescript-webview-interface
Plugin for bi-directional communication between webView and android/ios
Stars: ✭ 87 (+17.57%)
Mutual labels:  nativescript

** DEPRECATION NOTICE **

Package has been deprecated as of July 12th, 2019.

Please use the version published by nStudio.

Installation:

tns plugin add @nstudio/nativescript-snackbar


NativeScript-Snackbar 🍭 🍫 🍦

NativeScript plugin for Material Design SnackBar component.

Demo

Snackbar

Installation

NativeScript 5.4 and older

tns plugin add nativescript-snackbar

Changelog

Usage

TS

import { SnackBar, SnackBarOptions } from "nativescript-snackbar";

// Create an instance of SnackBar
const snackbar = new SnackBar();

/// Show a simple snackbar with no actions
public showSimple() {
    snackbar.simple('Snackbar', 'red', '#fff', 3, false).then((args) => {
         this.set('jsonResult', JSON.stringify(args));
   })
}

/// Show an Action snack bar
public showAction() {
  const options: SnackBarOptions = {
    actionText: this.get('actionText'),
    actionTextColor: '#ff4081', // Optional, Android only
    snackText: this.get('snackText'),
    textColor: '#346db2', // Optional, Android only
    hideDelay: 3500,
    backgroundColor: '#eaeaea', // Optional, Android only
    maxLines: 3, // Optional, Android Only
    isRTL: false, // Optional, Android Only
    view: <View>someView // Optional, Android Only, default to topmost().currentPage
  };

  snackbar.action(options).then((args) => {
    if (args.command === "Action") {
      this.set('jsonResult', JSON.stringify(args));
    } else {
      this.set('jsonResult', JSON.stringify(args));
    }
  });
}

API

Show a simple SnackBar (color args will only work on Android)

  • simple(snackText: string, textColor?: string, backgroundColor?: string, maxLines?: number, isRTL?: boolean, view?: View): Promise

Show a SnackBar with Action.

  • action(options: SnackBarOptions): Promise

Manually dismiss an active SnackBar

  • dismiss(): Promise

SnackBarOptions Interface

  • actionText: string
  • actionTextColor: string
  • snackText: string
  • hideDelay: number
  • textColor: string
  • backgroundColor: string
  • maxLines: number
  • isRTL: boolean
  • view: View
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].