android 操作栏根据滑动显示或隐藏

先看一下效果

untitled.gif

这样的效果实现起来其实很简单，在scrollview或recyclerview滑动的时候改变操作栏的TranslationY属性即可，在view中有个setTranslationY()方法可以在屏幕Y轴移动view本身

布局代码，这里使用了NestedScrollView，官方已经帮我们定义好了滑动的监听了

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

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

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

            <TextView
                android:text="@string/app_name"
                android:layout_width="match_parent"
                android:layout_height="300dp" />

        </LinearLayout>
    </androidx.core.widget.NestedScrollView>

    <LinearLayout
        android:layout_gravity="bottom"
        android:background="@color/colorPrimary"
        android:id="@+id/my_bar"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="48dp">

        <TextView
            android:text="操作栏"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

</FrameLayout>

Activity里面也很简单，根据NestedScrollView滑动监听回调在屏幕上的坐标来判断上下滑动就行了，这里我用了一个属性动画对操作栏进行了隐藏的效果，这样看起来不会太突兀

public class MainActivity extends AppCompatActivity {

    private NestedScrollView nestedScrollView;

    private LinearLayout bar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        nestedScrollView = findViewById(R.id.main_nested_scroll_view);
        bar = findViewById(R.id.my_bar);

        nestedScrollView.setOnScrollChangeListener(new NestedScrollView.OnScrollChangeListener() {
            @Override
            public void onScrollChange(NestedScrollView v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {
                //Log.v("MainActivity", "scrollY" + scrollY + " oldScrollY:" + oldScrollY);

                if (scrollY > oldScrollY && scrollY - oldScrollY > 50) {
                    if (bar.getTranslationY() > 0) {
                        return;
                    }
                    //向下滑动
                    ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(bar, "TranslationY", 0, dip2px(48));
                    objectAnimator.setDuration(200);
                    objectAnimator.start();
                } else if (scrollY < oldScrollY && oldScrollY - scrollY > 50){
                    //向上滑动
                    bar.setTranslationY(0);
                }
            }
        });
    }

    /**
     * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
     */
    public int dip2px(float dpValue) {
        final float scale = getResources().getDisplayMetrics().density;
        return (int) (dpValue * scale + 0.5f);
    }
}