Android Implementation of Hovering at the Top when Swiping

Let's first take a look at the effect diagram to be implemented:

After consulting the information, I found that most of the methods on the Internet are implemented in this way:

Write an additional layout that is exactly the same as the part you need to float, and first set the visibility of the floating area to gone. When the floating area slides to the top, set the visibility of the floating area B to VISIBLE. This will make it look like it is floating stationary at the top.

Here is another way to introduce:

Using controls from the design package

<android.support.design.widget.CoordinatorLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:fitsSystemWindows="true"
 tools:context="com.peipei.app.MainActivity">
 <android.support.design.widget.AppBarLayout
 android:layout_width="match_parent"
 android:layout_height="250dp">
 <android.support.design.widget.CollapsingToolbarLayout
  app:layout_scrollFlags="scroll"
  app:contentScrim="#000000"
  android:layout_width="match_parent"
  android:layout_height="220dp">
  <TextView
  android:text="banner区域"
  android:gravity="center"
  android:textColor="#ffffff"
  android:background="#987545"
  android:layout_width="match_parent"
  android:layout_height="220dp"/>
 </android.support.design.widget.CollapsingToolbarLayout>
 <TextView
  android:gravity="center"
  android:layout_width="match_parent"
  android:layout_height="30dp"
  android:text="悬浮的部分"/>
 </android.support.design.widget.AppBarLayout
 <android.support.v4.widget.NestedScrollView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  app:layout_behavior="@string/appbar_scrolling_view_behavior">
  <TextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_margin="@dimen/text_margin"
  android:text="@string/large_text"/>
 </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Implementation steps:

1Place the layout that needs to float outside of CollapsingToolbarLayout and inside AppBarLayout

2Set the app:layout_scrollFlags of CollapsingToolbarLayout to scroll

3Set the scrolling NestedScrollView

　　　　　 app:layout_behavior="@String/appbar_scrolling_view_behavior"

It's all done (remember that the root layout should be CoordinatorLayout)

Final effect:

Summary

This is the full content about the Android sliding to the top hover effect, have everyone learned it? I hope this article can bring some help to everyone's learning or work, if you have any questions, you can leave a message for communication.