LiveSmashBar

LiveSmashBar allows you a great alternative for native snackbar & toast in Android. It allows a great extent of customisation & flexibility in terms of usage & behaviour.

Also it has support for LiveData which can be beneficial for displaying repetitive messages just be single initialization.

Library has been designed & developed purely in Kotlin. ❤️

Spread Your ❤️:

Samples

You can check the Demo Project developed in kotlin for better understanding of concepts & usage.

Download

This library is available in maven & jcenter which can also be imported from source as a module.

maven

<dependency>
    <groupId>com.yuvraj.livesmashbar</groupId>
    <artifactId>smashbar</artifactId>
    <version>1.0.0</version>
    <type>pom</type>
</dependency>

gradle

dependencies {
    // other dependencies here
    implementation 'com.yuvraj.livesmashbar:smashbar:1.0.0'
}

Get Started

Basic

Shows a simple LiveSmashBar with description & duration.

LiveSmashBar.Builder(this)
            .description(getString(R.string.description))
            .descriptionColor(ContextCompat.getColor(this, R.color.white))
            .gravity(GravityView.BOTTOM)
            .duration(3000)
            .show();

Also you can show both title & description along with duration in milliseconds. Duration is set to indefinite which means it won't dismiss until & unless specified for.Also you can use predefined parameters i.e DURATION_SHORT = 1000, DURATION_LONG = 2500 for specifying duration for LiveSmashBar.

LiveSmashBar.Builder(this)
            .title(getString(R.string.title))
            .titleColor(ContextCompat.getColor(this, R.color.white))
            .description(getString(R.string.description))
            .descriptionColor(ContextCompat.getColor(this, R.color.white))
            .gravity(GravityView.BOTTOM)
            .duration(DURATION_SHORT)
            .show();

Gravity

You can show LiveSmashBar at both Bottom ae well as Top of the screen by specifying GravityView.BOTTOM / GravityView.TOP.

GravityView.BOTTOM :

LiveSmashBar.Builder(this)
            .title(getString(R.string.title))
            .description(getString(R.string.description))
            .gravity(GravityView.BOTTOM)
            .duration(DURATION_SHORT)
            .show();

GravityView.TOP :

LiveSmashBar.Builder(this)
            .title(getString(R.string.title))
            .description(getString(R.string.description))
            .gravity(GravityView.TOP)
            .duration(DURATION_SHORT)
            .show();

LiveData Support

LiveSmashBar allows support for LiveData , which can be used for showing similar group of messages with single initialization thereby avoiding code redundancy. This can be achieved by simply creating a LiveSmashBar instance & passing the livedata object as parameter. So when ever you post anything to livedata, your LiveSmashBar will receive that call back and will display the same to the end user. Following is a sample demostrating the use of livedata,

val liveData: MutableLiveData<Unit> = MutableLiveData()

LiveSmashBar.Builder(this)
            .showIcon()
            .icon(R.mipmap.ic_launcher)
            .title(getString(R.string.flutter_title)) 
            .description(getString(R.string.flutter_info)) 
            .gravity(GravityView.BOTTOM)
            .liveDataCallback(this, liveData)

Icon

You can add icons to make details displayed on LiveSmashBar more meaningful & intuitive.

LiveSmashBar.Builder(this)
            .icon(R.mipmap.ic_launcher)
            .title(getString(R.string.title))
            .titleColor(ContextCompat.getColor(this, R.color.white))
            .description(getString(R.string.description))
            .descriptionColor(ContextCompat.getColor(this, R.color.white))
            .gravity(GravityView.BOTTOM)
            .duration(DURATION_SHORT)
            .show();

Also you can apply animation to icons, with the following snippet,

LiveSmashBar.Builder(this)
            .icon(R.mipmap.ic_launcher)
            .iconAnimation(AnimIconBuilder(this).pulse())
            .title(getString(R.string.description))
            .titleColor(ContextCompat.getColor(this, R.color.white))
            .gravity(GravityView.TOP)
            .duration(3000)
            .show()

Primary Button

Similar to Snackbar, a message can be accompanied by an action button which can be used to perform some functionality. Below example listens for action button click to dismiss LiveSmashBar displayed to user.

LiveSmashBar.Builder(this)
            .icon(R.mipmap.ic_launcher)
            .title(getString(R.string.title)) 
            .description(getString(R.string.description)) 
            .primaryActionText("DONE") 
            .primaryActionEventListener(object : OnEventTapListener {
                      override fun onActionTapped(bar: LiveSmashBar) {
                                bar.dismiss()
                       }
             })
            .show();

Dialog Style

LiveSmashBar can also be used to display a dialog view with a message & action buttons. By defalut the view type set is BarStyle.DEFAULT_MESSAGE which shows basic message with action button. For displaying dialog style LiveSmashBar use the following snippet,

LiveSmashBar.Builder(this)
            .icon(R.mipmap.ic_launcher)
            .title(getString(R.string.title)) 
            .description(getString(R.string.description)) 
            .backgroundColor(ContextCompat.getColor(this, R.color.orange))
            .setBarStyle(BarStyle.DIALOG)
            .positiveActionText("DONE")
            .positiveActionTextColor(ContextCompat.getColor(this, R.color.white))
            .positiveActionEventListener(object : OnEventTapListener {
                     override fun onActionTapped(bar: LiveSmashBar) {
                             bar.dismiss()
                     }
            })
            .negativeActionText("CLOSE")
            .negativeActionTextColor(ContextCompat.getColor(this, R.color.white))
            .negativeActionEventListener(object : OnEventTapListener {
                     override fun onActionTapped(bar: LiveSmashBar) {
                             bar.dismiss()
                     }
            })
            .show();

Overlay

LiveSmashBar allows to show modal overlay messages that dims the background & highlights the message to user. It blocks the UI if function overlayBlockable() is called thereby blocking user taps on the underlying content. You can dismiss the overlay by calling function dismissOnTapOutside() for dismissing the overlay.

LiveSmashBar.Builder(this)
            .showIcon()
            .icon(R.mipmap.ic_launcher)
            .title(getString(R.string.flutter_title))
            .description(getString(R.string.flutter_info))
            .gravity(GravityView.TOP)
            .dismissOnTapOutside()
            .showOverlay()
            .overlayBlockable()
            .backgroundColor(ContextCompat.getColor(this, R.color.white))
            .show();            

Event Listeners

You can subscribe to events like when the LiveSmashBar is showing, or dismissing. You can also subscribe to when the LiveSmashBar is being shown or dismissed to perform animations on other views if needed.

You can also subscribe to tap events inside or outside the bar.

Show Event

You can subscribe to events on OnEventShowListener as follows,

LiveSmashBar.Builder(this) 
        .title("Hello World!")
        .description("You can listen to events when the LiveSmashBar is shown")
        .barShowListener(object : LiveSmashBar.OnEventShowListener {
            override fun onShowing(bar: LiveSmashBar) {
                Log.d(TAG, "LiveSmashBar is showing")
            }

            override fun onShown(bar: LiveSmashBar) {
                Log.d(TAG, "LiveSmashBar is shown")
            }
        })
        .show()

Dismiss

You can listen to events on OnEventDismissListener for dismissing events. You can also specifically get to know the reason behind the bar dismiss action - TIMEOUT, MANUAL, TAP_OUTSIDE and SWIPE.

LiveSmashBar.Builder(this) 
        .title("Hello World!") 
        .description("You can listen to events when the LiveSmashBar is dismissed")
        .barDismissListener(object : LiveSmashBar.OnEventDismissListener {
            override fun onDismissing(bar: LiveSmashBar, isSwiped: Boolean) {
                Log.d(TAG, "LiveSmashBar is dismissing with $isSwiped")
            }

            override fun onDismissed(bar: LiveSmashBar, event: LiveSmashBar.DismissEvent) {
                Log.d(TAG, "LiveSmashBar is dismissed with event $event")
            }
        }) 
        .show()

Taps

You can listen to tap events inside or outside of the LiveSmashBar.

LiveSmashBar.Builder(this) 
        .title("Hello World!")
        .description("You can listen to tap events inside or outside the LiveSmashBar.")
        .listenBarTaps(object : LiveSmashBar.OnEventListener {
            override fun onTap(bar: LiveSmashBar) {
                Log.d(TAG, "Bar tapped")
            }
        })
        .listenOutsideTaps(object : LiveSmashBar.OnTapListener {
            override fun onTap(bar: LiveSmashBar) {
                Log.d(TAG, "Outside tapped")
            }
        })
        .show()

About Me

Yuvraj Pandey

I am a passionate Mobility Engineer which likes to push himself on various fronts of technologies.

For more exciting updates follow me,