Android scroll title to the top

The effect is like this, the principle is very simple

As shown in the figure, there are actually two titles with the same layout on the page. The ceiling title is hidden by default, and then monitors the scroll height Y of the ScrollView. When the scroll height Y is greater than the height of content 1, the ceiling title is displayed, otherwise, the ceiling title is hidden . In this way, from the visual effect, the title has a ceiling effect.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/purple_500"
    xmlns:app="http://schemas.android.com/apk/res-auto">



    <androidx.core.widget.NestedScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <ImageView
                android:id="@+id/iv_header"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:adjustViewBounds="true"
                android:contentDescription="@string/app_name"
                android:scaleType="centerCrop"
                android:src="@drawable/banner_1"
                app:layout_collapseMode="parallax" />
            <TextView
                android:id="@+id/magicIndicator"
                android:layout_below="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:gravity="center"
                android:background="@color/white"
                android:text="好货推荐"/>
            <androidx.recyclerview.widget.RecyclerView
                
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>



        </LinearLayout>

    </androidx.core.widget.NestedScrollView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="80dp">
        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="44dp"
            android:id="@+id/toolbar"
            android:background="#FFFFFF"
            android:gravity="center">

            <ImageView
                android:id="@+id/ivBack"
                android:layout_width="20dp"
                android:layout_height="20dp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <TextView
                android:id="@+id/tvTitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
              
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                android:text="标题" />

        </androidx.constraintlayout.widget.ConstraintLayout>

        <TextView
            android:visibility="gone"
            android:id="@+id/magicIndicatorTitle"
            android:layout_below="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:gravity="center"
            android:background="@color/white"
            android:text="好货推荐"/>
    </RelativeLayout>
</FrameLayout>
  toolbar.setBackgroundColor(Color.argb((int) 0, 0,0,0));
        tvTitle.setAlpha(0);
        int high=DensityUtil.dip2px(this,160);
        scrollView.setOnScrollChangeListener(new androidx.core.widget.NestedScrollView.OnScrollChangeListener() {
            int h=toolbar.getHeight();
            @Override
            public void onScrollChange(androidx.core.widget.NestedScrollView v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {

                if (scrollY> high) {
                    magicIndicatorTitle.setVisibility(View.VISIBLE);
                } else {
                    magicIndicatorTitle.setVisibility(View.GONE);
                }
                if (scrollY <= 0) {   //设置标题的背景颜色
                    toolbar.setBackgroundColor(Color.argb((int) 0, 0,0,0));
                    tvTitle.setAlpha(0);
                } else if (scrollY > 0 && scrollY <= high) { //滑动距离小于banner图的高度时,设置背景和字体颜色颜色透明度渐变
                    float scale = (float) scrollY / high;
                    Log.i("TAG", "onScrollChange: "+scale);
                    float alpha = (255 * scale);
                    tvTitle.setAlpha(1f * scrollY / h);
                    toolbar.setBackgroundColor(Color.argb((int) alpha, 255,255,255));
                } else {    //滑动到banner下面设置普通颜色
                    toolbar.setBackgroundColor(Color.argb((int) 255, 255,255,255));
                }
             }
        });
}


 

Guess you like

Origin blog.csdn.net/guodashen007/article/details/112684008