AppBarLayout is a vertical LinearLayout which implements many of the features of material designs app bar concept, namely scrolling gestures.
Children should provide their desired scrolling behavior through AppBarLayout.LayoutParams.setScrollFlags(int) and the associated layout xml attribute: app:layout_scrollFlags.
This view depends heavily on being used as a direct child within a CoordinatorLayout. If you use AppBarLayout within a different ViewGroup, most of its functionality will not work.
AppBarLayout also requires a separate scrolling sibling in order to know when to scroll. The binding is done through the AppBarLayout.ScrollingViewBehavior behavior class, meaning that you should set your scrolling view’s behavior to be an instance of AppBarLayout.ScrollingViewBehavior. A string resource containing the full class name is available.
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!-- Your scrolling content -->
</androidx.core.widget.NestedScrollView>
<com.google.android.material.appbar.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<androidx.appcompat.widget.Toolbar
...
app:layout_scrollFlags="scroll|enterAlways"/>
<com.google.android.material.tabs.TabLayout
...
app:layout_scrollFlags="scroll|enterAlways"/>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
app:layout_collapseMode
<attr name="layout_collapseMode">
<!-- The view will act as normal with no collapsing behavior. -->
<enum name="none" value="0"/>
<!-- The view will pin in place. -->
<enum name="pin" value="1"/>
<!-- The view will scroll in a parallax fashion. See the
layout_collapseParallaxMultiplier attribute to change the multiplier. -->
<enum name="parallax" value="2"/>
</attr>
<!-- The multiplier used when layout_collapseMode is set to 'parallax'. The value should
be between 0.0 and 1.0. -->
<attr format="float" name="layout_collapseParallaxMultiplier"/>
app:layout_scrollFlags
<attr name="layout_scrollFlags">
<!-- Disable scrolling on the view. This flag should not be combined with any of the other
scroll flags. -->
<flag name="noScroll" value="0x0"/>
<!-- The view will be scroll in direct relation to scroll events. This flag needs to be
set for any of the other flags to take effect. If any sibling views
before this one do not have this flag, then this value has no effect. -->
<flag name="scroll" value="0x1"/>
<!-- When exiting (scrolling off screen) the view will be scrolled until it is
'collapsed'. The collapsed height is defined by the view's minimum height. -->
<flag name="exitUntilCollapsed" value="0x2"/>
<!-- When entering (scrolling on screen) the view will scroll on any downwards
scroll event, regardless of whether the scrolling view is also scrolling. This
is commonly referred to as the 'quick return' pattern. -->
<flag name="enterAlways" value="0x4"/>
<!-- An additional flag for 'enterAlways' which modifies the returning view to
only initially scroll back to it's collapsed height. Once the scrolling view has
reached the end of it's scroll range, the remainder of this view will be scrolled
into view. -->
<flag name="enterAlwaysCollapsed" value="0x8"/>
<!-- Upon a scroll ending, if the view is only partially visible then it will be
snapped and scrolled to it's closest edge. -->
<flag name="snap" value="0x10"/>
<!-- An additional flag to be used with 'snap'. If set, the view will be snapped to its
top and bottom margins, as opposed to the edges of the view itself. -->
<flag name="snapMargins" value="0x20"/>
</attr>
NestedScrollView
app:behavior_overlapTop="30dp"
<!-- The amount that the scrolling view should overlap the bottom of any AppBarLayout -->
<attr format="dimension" name="behavior_overlapTop"/>
var isToolbarShown = false
// scroll change listener begins at Y = 0 when image is fully collapsed
plantDetailScrollview.setOnScrollChangeListener(
NestedScrollView.OnScrollChangeListener { _, _, scrollY, _, _ ->
// User scrolled past image to height of toolbar and the title text is
// underneath the toolbar, so the toolbar should be shown.
val shouldShowToolbar = scrollY > toolbar.height
// The new state of the toolbar differs from the previous state; update
// appbar and toolbar attributes.
if (isToolbarShown != shouldShowToolbar) {
isToolbarShown = shouldShowToolbar
// Use shadow animator to add elevation if toolbar is shown
appbar.isActivated = shouldShowToolbar
// Show the plant name if toolbar is shown
toolbarLayout.isTitleEnabled = shouldShowToolbar
}
}
)
demo
https://github.com/android/sunflower PlantDetailFragment