CODEWITHSUNDEEP
androidandroid-5.0-lollipopmaterial-design
Eric Farraro
Eric Farraro

Reputation: 865

Material Design checklist: hiding app bar on scroll?

Per the new Android Material Design checklist:

http://android-developers.blogspot.com/2014/10/material-design-on-android-checklist.html

Where appropriate, upon scrolling down, the app bar can scroll off the screen, leaving more vertical space for content. Upon scrolling back up, the app bar should be shown again.

I realize there are lots of questions/answers to implement this behavior for the ICS-style app bar, but I'm curious if the new Toolbar widget or Lollipop/AppCompat 21 have introduced a more standard way of achieving this effect.

Upvotes: 11

Views: 11001

Answers (2)

Bolt UIX
Bolt UIX

Reputation: 7032

Ref: https://material.io/develop/android/components/app-bars-bottom

hiding app bar on scroll:

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomAppBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"

    app:hideOnScroll="true"

    app:navigationIcon="@drawable/ic_menu_color_control_normal_24dp"
    app:navigationContentDescription="Navigation icon"
    android:fitsSystemWindows="true"
    />

Kotlin: programmatically

  bottomAppBar.hideOnScroll = true

Upvotes: 0

Eric Farraro
Eric Farraro

Reputation: 865

Per Roman Nurik on Google+ (essentially what @tyczj mentioned)

https://plus.google.com/u/0/+RomanNurik/posts/3G8zYvN5oRC

It's not built in but relatively simple to implement. Just observe scrolling and animate the Y translation. Could also use the "quick return" sample +Nick Butcher​ and I published a few years ago

I believe that example referenced is: https://code.google.com/p/romannurik-code/source/browse/misc/scrolltricks

UPDATE: I also just discovered a great library that does this, along with some other great tricks https://github.com/ksoichiro/Android-ObservableScrollView

Upvotes: 6

Related Questions