Fragment遮挡住TabLayout,怎么办？

我想做一个顶部tab的ViewPager搭配FragmentPagerAdapter,但是写出来的效果很奇怪，Fragment的界面会整个挡住TabLayout。
如图：

我的代码如下：
其中一个Fragment

 public class FragmentA extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.frag_a,container,false);
        TextView textView = (TextView) view.findViewById(R.id.tvA);
        textView.setText("这个就是踌躇满志");
        return view;
    }
}

它所对应的XML

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1">
    <TextView
        android:id="@+id/tvA"
        android:textSize="30sp"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

这是MainActivity:
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;                            //定义TabLayout
private ViewPager viewPager;                             //定义viewPager
private ViewPagerAdapter pagerAdapter;                               //定义adapter

private List<Fragment> fragments;                                //定义要装fragment的列表
private String[] titles = new String[]{"踌躇满志","混吃等死","吾日三省"};                                     //tab名称数组


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
    fab.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                    .setAction("Action", null).show();
        }
    });
    initView();
}

private void initView() {
    viewPager = (ViewPager) findViewById(R.id.vp);
    tabLayout = (TabLayout) findViewById(R.id.tl);
    fragments = new ArrayList<>();
    Fragment fragmentA = new FragmentA();
    Fragment fragmentW = new FragmentW();
    Fragment fragmentR = new FragmentR();
    fragments.add(fragmentA);
    fragments.add(fragmentW);
    fragments.add(fragmentR);
    pagerAdapter = new ViewPagerAdapter(getSupportFragmentManager(),fragments,titles);
    tabLayout.setTabMode(TabLayout.MODE_FIXED);
    viewPager.setAdapter(pagerAdapter);
    tabLayout.setupWithViewPager(viewPager);
}
........

这是主布局：

<LinearLayout 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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.izp.tablayout.MainActivity"
    tools:showIn="@layout/activity_main">

    <android.support.design.widget.TabLayout
        android:id="@+id/tl"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/tabBlue"
        app:tabIndicatorColor="@color/indicatorWhite"
        app:tabSelectedTextColor="@color/indicatorGray"
        app:tabTextColor="@color/indicatorWhite"/>
    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

同样的Fragment及其布局使用同样的代码，TabLayout替换成第三方的indicator则不会有此问题。
下面是布局和Fragment都没有改，替换indicator之后的截图：

求大神给小白解惑，我是更喜欢用TabLayout的毕竟设置样式不用到style里面去改，很方便。有大神遇到过这个问题么？

---

你把app:layout_behavior="@string/appbar_scrolling_view_behavior"去掉试试

---

你的最外层是linearlayout，不需要behavior

---

自问自答，当时我是通过把TabLayout设置在AppBarLayout里面来解决这个问题的。