Android控件CoordinatorLayout和TabLayout

最终效果

说明

本文主要讲解CoordinatorLayout、AppBarLayout、Toolbar、TabLayout之间协调动画；前面有简单的讲过AppBarLayout设置安卓Activity的导航可以点击查看；
CoordinatorLayout作为顶层布局，协调子布局；
CoordinatorLayout与AppBarLayout，AppBarLayout嵌套TabLayout实现Toolbar的显隐，

添加所需库

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:24.2.0'
    compile 'com.android.support:design:24.2.0'
    compile 'com.android.support:cardview-v7:24.2.0'
}

CoordinatorLayout协调AppBarLayout实现Toolbar显隐关系；
activity_main.xml文件布局

"1.0" encoding="utf-8"?>
.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent">

    .support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:theme="@style/AppTheme.AppBarOverlay">

        .support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

        .support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="#FE0000"
            app:tabMode="scrollable" />
    .support.design.widget.AppBarLayout>

    .support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    .support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:clickable="true"
        android:onClick="onClick"
        android:src="@drawable/ic_start"
        app:layout_anchor="@id/viewpager"
        app:layout_anchorGravity="bottom|right|end"
        app:backgroundTint="#ff87ffeb"
        app:rippleColor="#33728dff"/>

.support.design.widget.CoordinatorLayout>

MainActivity.java文件

public class MainActivity extends AppCompatActivity {

    private Toolbar toolbar;
    private TabLayout tabLayout;
    private ViewPager viewPager;

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

        //设置导航条标题
        toolbar = (Toolbar)findViewById(R.id.toolbar);
        toolbar.setTitle("精彩活动");
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        //设置侧滑标题
        tabLayout = (TabLayout)findViewById(R.id.tabLayout);
        viewPager = (ViewPager)findViewById(R.id.viewpager);

        List list = new ArrayList();
        list.add("要闻");
        list.add("深圳");
        list.add("房产");
        list.add("娱乐");
        list.add("NAB");
        list.add("体育");
        MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager(),list);
        viewPager.setAdapter(adapter);
        viewPager.setOffscreenPageLimit(list.size());
        tabLayout.setupWithViewPager(viewPager);
    }

    public void onClick(View view){
        Snackbar.make(view,"点我", Snackbar.LENGTH_SHORT).show();
    }

    public class MyPagerAdapter extends FragmentPagerAdapter{

        private List titleList;

        public MyPagerAdapter(FragmentManager fm, List list){
            super(fm);
            this.titleList = list;
        }

        @Override
        public int getCount() {
            return titleList.size();
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return titleList.get(position);
        }

        @Override
        public Fragment getItem(int position) {
            return MyTitleFragment.newInstance(titleList.get(position));
        }
    }
}

fragment_my_title.xml文件

<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

android.support.v7.widget.RecyclerView>

MyTitleFragment.java文件

public class MyTitleFragment extends Fragment{

    private RecyclerView recyclerView;

    public static MyTitleFragment newInstance(String id){
        MyTitleFragment fragment = new MyTitleFragment();
        //设置传递给fragment的参数id等
        Bundle bundle = new Bundle();
        bundle.putString("id",id);
        fragment.setArguments(bundle);

        return fragment;
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        recyclerView = (RecyclerView) inflater.inflate(R.layout.fragment_my_title,null);
        return recyclerView;
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        recyclerView.setItemAnimator(new DefaultItemAnimator());
        recyclerView.setLayoutManager(new LinearLayoutManager(recyclerView.getContext()));
        recyclerView.setAdapter(new NewAdapter(getActivity()));
    }
}

item_new_adapter.xml文件

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_margin="5dp"
            android:scaleType="centerCrop"
            android:src="@drawable/sng" />

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

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:padding="5dp"
                android:text="棒冰行动"
                android:textSize="18sp"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:padding="5dp"
                android:text="棒冰行动，公益传播设计夏令营" />
        LinearLayout>
    LinearLayout>
android.support.v7.widget.CardView>

NewAdapter.java文件

public class NewAdapter extends  RecyclerView.Adapter<NewAdapter.ViewHolder>{

    private Context mContext;

    public NewAdapter(Context context){
        this.mContext = context;
    }

    @Override
    public NewAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view =
                LayoutInflater.from(parent.getContext()).inflate(R.layout.item_new_adapter, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(final ViewHolder holder, int position) {
        final View view = holder.mView;
        view.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(mContext,"点我",Toast.LENGTH_SHORT).show();
            }
        });
    }

    @Override
    public int getItemCount() {
        return 10;
    }

    public static class ViewHolder extends RecyclerView.ViewHolder {
        public final View mView;

        public ViewHolder(View view) {
            super(view);
            mView = view;
        }
    }
}

解析：
Toolbar隐藏；通过设置app:layout_scrollFlags标签值；

1. scroll: 所有想滚动出屏幕的view都需要设置这个flag，没有设置这个flag的view将被固定在屏幕顶部。例如，TabLayout 没有设置这个值，将会停留在屏幕顶部。
2. enterAlways: 设置这个flag时，向下的滚动都会导致该view变为可见，启用快速“返回模式”。
3. enterAlwaysCollapsed:当你的视图已经设置minHeight属性又使用此标志时，你的视图只能已最小高度进入，只有当滚动视图到达顶部时才扩大到完整高度。
4. exitUntilCollapsed: 滚动退出屏幕，最后折叠在顶端。

为了使得Toolbar有滑动效果，必须做到如下三点:
1. CoordinatorLayout作为布局的父布局容器。
2. 给需要滑动的组件设置 app:layout_scrollFlags=”scroll|enterAlways” 属性。
3. 给滑动的组件设置app:layout_behavior属性
在此简单的使用已讲完。