AppbarLayout+双导航嵌套滑动效果

前言

现在很多的app都带有双导航，然后内层Fragment中有ViewPager+RecyclerView嵌套，关键是还伴有导航栏顶部滑动可见与隐藏功能。那么今天就来详细讲讲它的实现吧。
今天讲解的知识会涉及到AppBarLayout+NestedScrollView+ViewPager+RecyclerView的联合使用。大家若对AppBarLayout及其相关控件感兴趣的话，可以参考我另一篇文章：
CoordinatorLayout,AppBarLayout,CollapsingToolbarLayout使用详解
下面将带领大家一步步实现双导航+头部特效的ui效果。

今天涉及知识点：

1. 实现底部导航栏
2. 实现头部滑动特效及内层顶部导航
3. 内层Fragment中的列表数据实现
4. 实现过程需要注意的点
5. 效果图和项目结构图

先来波效果图：

1.gif

---

更多精彩内容，请关注微信公众号 "Android进击",大家一起来学习进步吧

---

一. 实现底部导航栏

外层的底部导航栏我是用ViewPager+Fragment,然后底部用RedioGroup实现。
这里我准备了三个Fragment：FragmentA，FragmentB和FragmentC。
FragmentB和FragmentC比较简单，都是基本的Fragment,以FragmentB为例，贴下FragmentB代码：

package com.testdemo.other;

import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import com.testdemo.R;

/**
 * Title:
 * description:
 * autor:pei
 * created on 2020/9/2
 */
public class FragmentB extends Fragment {

    private View mLayoutView;
    private Context mContext;
    private TextView mTvTestA;

    @Override
    public void onAttach(Context context) {
        super.onAttach(context);
        this.mContext=context;
    }

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        mLayoutView = inflater.inflate(R.layout.fragment_b, container, false);

        initView();
        initData();
        setListener();

        return mLayoutView;
    }

    private void initView(){
        mTvTestA=mLayoutView.findViewById(R.id.tv_a);
    }

    private void initData(){
        Bundle bundle=getArguments();
        String value="";
        if(bundle!=null) {
            value = bundle.getString("A");
        }
        mTvTestA.setText("故事");
    }

    private void setListener(){}

}

FragmentB对应布局fragment_b代码如下：

然后看下ViewPager+Fragment及底部RedioGroup导航在TempActivity中的实现。TempActivity对应布局activity_temp.xml代码如下:

布局中涉及到两个样式：style="@style/main_tab_item"和android:drawableTop="@drawable/tab_home_bg"。
@style/main_tab_item样式如下：

里面引用的@drawable/main_tab_text样式代码如下：

然后@drawable/tab_home_bg样式代码如下：

ok,activity_temp.xml代码讲解完毕，下面贴出TempActivity代码：