Skip to content

barryloh/SenchaTouchToast

Repository files navigation

Sencha Touch Toast

Contents

About

This plugin aims to recreate the Toast notification from Android to be used in Sencha Touch apps. This plugin allows the Toast to be called multiple times like in Android and it will get queued. Also, it allows for a custom action button on the Toast, e.g. UNDO.

Compatibility

These plugin have been tested working with Sencha Touch 2.3.1.

Getting Started

At the Application level, you'll need to add the required class to be loaded automatically.

Ext.Application({
	requires: [ 'BA.Toast' , .. ],
	..
});

At anytime needed, you can create a Toast instance by simply creating the class. Also include toast.js and toast.css into your app.

Usage

To show a simple toast:

Ext.create('BA.Toast', {
	message: 'This is a toast',
	toastDuration: 'SHORT'
});

To show a toast with an undo action button:

Ext.create('BA.Toast', {
	message: 'Toast that allows undo',
	toastDuration: 2500,
	doAction: {
		text: 'Undo',
		tap: function() {
			console.log('Perform undo function here');
			// Other code here..
		}
	}
});

Documentation

Parameter Value
message A string to display on the toast. Pick something real short and sweet!
toastDuration Duration of how long to show the Toast. Value can be set either in:

  • String
    • SHORT or short
    • LONG or long
  • Integer
    • Range from 0 to 10000
Defaults to long duration
doAction An object that must have two fields:

  • text
    A one-word string to display for the button
  • tap
    A function to be executed once it is tapped on. Besides hiding the Toast immediately.

FAQ

1. The Toast looks boring!

In toast.css, feel free to edit the 3 classes tied to the toast, message and action button.

2. How many lines of text does the Toast supports?

Only one line of text as the message.

3. Can I show more than one Toast at a time?

Unforunately that is not the right behaviour. Creating the class instance multiple times will queue the Toasts to display one after another.

Screenshots

Coming soon..

Changelog

  • Version 1.0
    • Release: April 2, 2015.
    • First release.

About

Android style Toast notification made just for Sencha Touch

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages