Hey Geekier,  Every Android developer know about the Google NewsStand App and well aware of their Navigation Toolbar Pattern Animation. And if you want to add that type of animation for your application then this article is for you. If you don’t know about Google NewsStand Animation then don’t worry. Just look out demo of this library below:

Demo of Navigation Toolbar Pattern Project

Here is a quick exploration of a navigation pattern. This idea comes while using the Google Newsstand app. Basically, like my previous article about Trello exploration, it is the ability to pull to navigate between categories more easily. Assuming you are not using the pull to refresh. As usual, looking forward to get your comments!

Lets move on to implementation of Navigation Toolbar Pattern

Navigation toolbar pattern is an animation library with slide-modeled UI navigation controller.

See this too : Comparison : Android O Vs Android N

Requirements

• Android 5.0 Lollipop (API lvl 21) or greater
• Your favorite IDE (Android Studio or IntelliJ)

Download Navigation Toolbar Pattern Library

You’ve to aware about this: Android MVP Pattern Example

Installation

Just download the package from here and add it to your project classpath, or just use the maven repo:

Gradle:

implementation 'com.ramotion.navigationtoolbar:navigation-toolbar:0.1.0'

SBT:

libraryDependencies += "com.ramotion.navigationtoolbar" % "navitagiton-toolbar" % "0.1.0"

Maven:

<dependency>
  <groupId>com.ramotion.navigationtoolbar</groupId>
  <artifactId>navigation-toolbar</artifactId>
  <version>0.1.0</version>
  <type>aar</type>
</dependency>

Add NavigationToolBarLayout  in layout

NavigationToolBarLayout is the successor to CoordinatorLayout. Therefore, NavigationToolBarLayout must be the root element of your layout.

Do you know: Why Kotlin better than Java For Android Development?

Displayed content must be inside NavigationToolBarLayout, as shown below:

<com.ramotion.navigationtoolbar.NavigationToolBarLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include layout="@layout/content_layout"/>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_anchor="@id/com_ramotion_app_bar"
        app:layout_anchorGravity="bottom|end"
        app:srcCompat="@android:drawable/ic_dialog_email" />

</com.ramotion.navigationtoolbar.NavigationToolBarLayout>

Create adapter for NavigationToolBarLayout

Next, you must specify an adapter for NavigationToolBarLayout, from which NavigationToolBarLayout will receive the displayed View.

NavigationToolBarLayout contains android.support.v7.widget.Toolbar and android.support.design.widget.AppBarLayout, access to which can be obtained through the appropriate identifiers:

@id/com_ramotion_toolbar <!-- identifier of Toolbar -->
@id/com_ramotion_app_bar <!-- identifier of AppBarLayout -->

or through the appropriate properties of the NavigationToolBarLayout class:

val toolBar: Toolbar
val appBarLayout: AppBarLayout

Some attributes used in this library

Here are the attributes you can specify through XML or related setters:

• headerOnScreenItemCount – The maximum number of simultaneously displayed cards (items) in vertical orientation.
• headerCollapsingBySelectDuration – Collapsing animation duration of header (HeaderLayout), when you click on the card in vertical orientation.
• headerTopBorderAtSystemBar – Align the top card on the systembar or not.
• headerVerticalItemWidth – Specifies the width of the vertical card. It can be equal to match_parent, then the width of the card will be equal to the width of NavigationToolBarLayout.
• headerVerticalGravity – Specifies the alignment of the vertical card. Can take the values: left, center, or right.

Facebook

Twitter

#Google #Newsstand #Navigation #Toolbar #Pattern #Kotlin #Library
Every Android developer know about the Google NewsStand Navigation Toolbar Pattern Animation. And if you want to add that type of animation for your application then this article is for you.https://t.co/s4wua7SwC5 pic.twitter.com/76y9BxchYD

— Tell Me How (@tellmehowblog) May 30, 2018

That’s it. Hope you enjoy this library and click on to share with your friends.