安卓滚动标题置顶

效果就是这样,原理很简单

如图,其实页面上有两个相同布局的标题,吸顶标题默认隐藏,然后监听ScrollView滚动的高度Y,当滚动的高度Y大于内容1的高度,吸顶标题显示,反之,隐藏吸顶标题。这样从视觉效果上看,标题具有吸顶效果。

<?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));
                }
             }
        });
}


 

猜你喜欢

转载自blog.csdn.net/guodashen007/article/details/112684008