Android进阶之路

默默的对自己说声抱歉，现在才学习了这些知识，不知不觉写了挺多，感觉在此博文复制全部代码的话，会给大家带来阅读疲劳，所以代码之后会上传在github，同时会提供下载地址，当然我会把遇到的问题与解决方案，以及相关使用到的知识链接在此博文写出！

Effect toolbar :

Effect CollapsingToolbarLayout+ToolBar :

Effect CollapsingToolbarLayout+ToolBar+TabLayout :

Github下载地址：
https://github.com/275726281/CollapsingToolbarLayout

Github上传如何上传项目：
https://jingyan.baidu.com/article/f7ff0bfc7181492e27bb1360.html

想直接查看的话，请点这里下载去看把

每一个效果对应的Activity都是独立存在的，所以下面我会分批简单进行介绍。

全局性 build ：

compile 'com.android.support:design:24.2.1'

全局性 提醒：
（最外层布局添加，作用于调用自定义属性，好比折叠的效果就是使用的app属性）

 xmlns:app="http://schemas.android.com/apk/res-auto"

效果一，主要使用的了ToolBar，使用的时候外部需要被AppBarLayout包裹。

如 Xml 中：

   <android.support.design.widget.AppBarLayout        android:id="@+id/appbar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">        <android.support.v7.widget.Toolbar            android:id="@+id/toolbar"            android:layout_width="match_parent"            android:layout_height="?attr/actionBarSize"            android:background="#00000000"            app:layout_scrollFlags="scroll|enterAlways"            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">        </android.support.v7.widget.Toolbar>    </android.support.design.widget.AppBarLayout>

同时代码中我们需要动态设置ToolBar属性：

toolBar.setTitle("初次使用，多多指教！");        toolBar.setBackgroundColor(Color.parseColor("#21aae3"));

注意：
最外层的布局可以使用LinearLayout也可以使用符合当前布局的CoordinatorLayout布局

ToolBarActivity ：

package com.yl.bar.barlayout.activity;import android.graphics.Color;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import android.support.v7.widget.Toolbar;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.yl.bar.barlayout.R;import java.util.ArrayList;import java.util.List;public class ToolBarActivity extends AppCompatActivity {    private List lists;    private Toolbar toolBar;    private RecyclerView mRv;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_toolbar);        toolBar = (Toolbar) findViewById(R.id.toolbar);        mRv = (RecyclerView) findViewById(R.id.recyclerView);        initData();    }    private void initData() {        lists = new ArrayList();        for (int i = 0; i < 50; i++) {            lists.add("Please go " + i);        }        toolBar.setTitle("初次使用，多多指教！");        toolBar.setBackgroundColor(Color.parseColor("#21aae3"));        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);        mRv.setLayoutManager(linearLayoutManager);        mRv.setAdapter(new LayoutAdapter());    }    class LayoutAdapter extends RecyclerView.Adapter<LayoutAdapter.myViewholder> {        @Override        public LayoutAdapter.myViewholder onCreateViewHolder(ViewGroup parent, int viewType) {            myViewholder myViewholder = new myViewholder(LayoutInflater.from(ToolBarActivity.this).inflate(R.layout.item_layout, parent, false));            return myViewholder;        }        @Override        public void onBindViewHolder(LayoutAdapter.myViewholder holder, final int position) {            holder.mItemData.setText(lists.get(position) + "");        }        @Override        public int getItemCount() {            return lists == null ? 0 : lists.size();        }        class myViewholder extends RecyclerView.ViewHolder {            public TextView mItemData;            public myViewholder(View itemView) {                super(itemView);                mItemData = (TextView) itemView.findViewById(R.id.;            }        }    }}

ToolBarActivity Xml ：

<?xml version="1.0" encoding="utf-8"?><android.support.design.widget.CoordinatorLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent">    <android.support.design.widget.AppBarLayout        android:id="@+id/appbar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">        <android.support.v7.widget.Toolbar            android:id="@+id/toolbar"            android:layout_width="match_parent"            android:layout_height="?attr/actionBarSize"            android:background="#00000000"            app:layout_scrollFlags="scroll|enterAlways"            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">        </android.support.v7.widget.Toolbar>    </android.support.design.widget.AppBarLayout>    <android.support.v7.widget.RecyclerView        android:id="@+id/recyclerView"        android:layout_width="match_parent"        android:layout_height="match_parent"        app:layout_behavior="@string/appbar_scrolling_view_behavior" /></android.support.design.widget.CoordinatorLayout>

公用代码 AppBarStateChangeListener：

package com.yl.bar.barlayout.listener;import android.support.design.widget.AppBarLayout;/** * Created by YongLiu on 2017/7/31. */public abstract class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener {    public enum State {        EXPANDED,        COLLAPSED,        IDLE    }    private State mCurrentState = State.IDLE;    @Override    public final void onOffsetChanged(AppBarLayout appBarLayout, int i) {        if (i == 0) {            if (mCurrentState != State.EXPANDED) {                onStateChanged(appBarLayout, State.EXPANDED);            }            mCurrentState = State.EXPANDED;        } else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) {            if (mCurrentState != State.COLLAPSED) {                onStateChanged(appBarLayout, State.COLLAPSED);            }            mCurrentState = State.COLLAPSED;        } else {            if (mCurrentState != State.IDLE) {                onStateChanged(appBarLayout, State.IDLE);            }            mCurrentState = State.IDLE;        }    }    public abstract void onStateChanged(AppBarLayout appBarLayout, State state);}

Effect 第二种Image折叠效果

TitleImageTextActivity :

package com.yl.bar.barlayout.activity;import android.graphics.Color;import android.os.Bundle;import android.support.design.widget.AppBarLayout;import android.support.design.widget.CollapsingToolbarLayout;import android.support.v7.app.AppCompatActivity;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import android.support.v7.widget.Toolbar;import android.util.Log;import android.view.LayoutInflater;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import android.widget.Toast;import com.yl.bar.barlayout.R;import com.yl.bar.barlayout.listener.AppBarStateChangeListener;import java.util.ArrayList;import java.util.List;public class TitleImageTextActivity extends AppCompatActivity {    private List lists;    private Toolbar mToolBar;    private CollapsingToolbarLayout mCollapsingToolBar;    private AppBarLayout mAppBar;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_image_text);        mCollapsingToolBar = (CollapsingToolbarLayout) findViewById(R.id.style3_collapsing_toolbar_layout);        mToolBar = (Toolbar) findViewById(R.id.style3_toolbar);        mAppBar = (AppBarLayout) findViewById(R.id.style3_appbar);        setSupportActionBar(mToolBar);        getSupportActionBar().setDisplayHomeAsUpEnabled(true);        //ToolBar的返回键        mToolBar.setNavigationOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                onBackPressed();            }        });        //监听我们拖拽的情况        mAppBar.addOnOffsetChangedListener(new AppBarStateChangeListener() {            @Override            public void onStateChanged(AppBarLayout appBarLayout, State state) {                Log.d("STATE", state.name());                if (state == State.EXPANDED) {                    //展开状态                    //展开的时候 - 字体颜色                    mCollapsingToolBar.setExpandedTitleColor(Color.RED);                    mCollapsingToolBar.setTitle("Baby,I love you !");//                     如在展示的时候不想显示任何字体，设置为空格即可//                    mCollapsingToolBar.setTitle(" ");                } else if (state == State.COLLAPSED) {                    //折叠状态                    //收缩的时候 - 字体颜色                    mCollapsingToolBar.setCollapsedTitleTextColor(Color.BLUE);                    //收缩后的ToolBar背景色                    mCollapsingToolBar.setContentScrimColor(Color.WHITE);                    mCollapsingToolBar.setTitle("you can do everything !");                } else {                    //中间状态                    mCollapsingToolBar.setTitle("change - ing !");                }            }        }); //        mCollapsingToolBar.setTitle("If you are happy .");//        //展开的时候 - 字体颜色//        mCollapsingToolBar.setExpandedTitleColor(Color.RED);//        //收缩的时候 - 字体颜色//        mCollapsingToolBar.setCollapsedTitleTextColor(Color.BLUE);//        //收缩后的ToolBar背景色//        mCollapsingToolBar.setContentScrimColor(Color.WHITE);         initData();    }    private void initData() {        lists = new ArrayList();        for (int i = 0; i < 50; i++) {            lists.add("Please go " + i + " !");        }        RecyclerView mRv = (RecyclerView) findViewById(R.id.style3_recyclerView);        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);        mRv.setLayoutManager(linearLayoutManager);        mRv.setAdapter(new LayoutAdapter());    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        getMenuInflater().inflate(R.menu.menu_toolbar, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        switch (item.getItemId()){            case R.id.menu_toolbar_edit:                Toast.makeText(this,"已经触发编辑按钮",Toast.LENGTH_SHORT).show();                break;        }        return super.onOptionsItemSelected(item);    }    class LayoutAdapter extends RecyclerView.Adapter<LayoutAdapter.myViewholder> {        @Override        public LayoutAdapter.myViewholder onCreateViewHolder(ViewGroup parent, int viewType) {            myViewholder myViewholder = new myViewholder(LayoutInflater.from(TitleImageTextActivity.this).inflate(R.layout.item_layout, parent, false));            return myViewholder;        }        @Override        public void onBindViewHolder(LayoutAdapter.myViewholder holder, final int position) {            holder.mItemData.setText(lists.get(position) + "");        }        @Override        public int getItemCount() {            return lists == null ? 0 : lists.size();        }        class myViewholder extends RecyclerView.ViewHolder {            public TextView mItemData;            public myViewholder(View itemView) {                super(itemView);                mItemData = (TextView) itemView.findViewById(R.id.tv_item);            }        }    }}

TabToolBarActivity Xml :

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:fitsSystemWindows="true">    <!--<android.support.design.widget.CoordinatorLayout-->    <!--xmlns:android="http://schemas.android.com/apk/res/android"-->    <!--xmlns:app="http://schemas.android.com/apk/res-auto"-->    <!--android:layout_width="match_parent"-->    <!--android:layout_height="match_parent"-->    <!--android:orientation="vertical">-->    <android.support.design.widget.CoordinatorLayout        android:layout_width="match_parent"        android:layout_height="match_parent">        <android.support.design.widget.AppBarLayout            android:id="@+id/style3_appbar"            android:layout_width="match_parent"            android:layout_height="256dp"            android:fitsSystemWindows="true">            <android.support.design.widget.CollapsingToolbarLayout                android:id="@+id/style3_collapsing_toolbar_layout"                android:layout_width="match_parent"                android:layout_height="match_parent"                app:contentScrim="#30469b"                app:expandedTitleGravity="center"                app:expandedTitleMarginStart="48dp"                app:layout_scrollFlags="scroll|exitUntilCollapsed">                <ImageView                    android:layout_width="match_parent"                    android:layout_height="match_parent"                    android:scaleType="centerCrop"                    android:src="@drawable/background"                    app:layout_collapseMode="parallax"                    app:layout_collapseParallaxMultiplier="0.7" />                <android.support.v7.widget.Toolbar                    android:id="@+id/style3_toolbar"                    android:layout_width="match_parent"                    android:layout_height="?attr/actionBarSize"                    app:expandedTitleGravity="center"                    app:layout_collapseMode="pin">                    <!--<LinearLayout-->                        <!--android:layout_width="wrap_content"-->                        <!--android:layout_height="wrap_content"-->                        <!--android:gravity="right"-->                        <!--android:orientation="horizontal">-->                        <!--<TextView-->                            <!--android:layout_width="20dp"-->                            <!--android:layout_height="20dp"-->                            <!--android:layout_gravity="right"-->                            <!--android:layout_marginRight="10dp"-->                            <!--android:background="@drawable/editer"-->                            <!--android:gravity="right" />-->                    <!--</LinearLayout>-->                </android.support.v7.widget.Toolbar>            </android.support.design.widget.CollapsingToolbarLayout>        </android.support.design.widget.AppBarLayout>        <android.support.v4.widget.NestedScrollView            android:layout_width="match_parent"            android:layout_height="match_parent"            app:layout_behavior="@string/appbar_scrolling_view_behavior">            <android.support.v7.widget.RecyclerView                android:id="@+id/style3_recyclerView"                android:layout_width="match_parent"                android:layout_height="match_parent"                app:layout_behavior="@string/appbar_scrolling_view_behavior" />        </android.support.v4.widget.NestedScrollView>    </android.support.design.widget.CoordinatorLayout></LinearLayout>

Effect 第三种tab效果

Tab代码

TabToolBarActivity ：

package com.yl.bar.barlayout.activity;import android.graphics.Color;import android.support.design.widget.AppBarLayout;import android.support.design.widget.CollapsingToolbarLayout;import android.support.design.widget.TabLayout;import android.support.v4.app.Fragment;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.Toolbar;import android.view.View;import android.widget.ImageView;import com.yl.bar.barlayout.R;import com.yl.bar.barlayout.adapter.pagrFragmentAdapter;import com.yl.bar.barlayout.listener.AppBarStateChangeListener;import com.yl.bar.barlayout.view.FineFragment;import com.yl.bar.barlayout.view.RainyFragment;import com.yl.bar.barlayout.view.SnowyFragment;import java.util.ArrayList;import java.util.List;public class TabToolBarActivity extends AppCompatActivity {    private TabLayout mTab;    private ViewPager mViewPager;    private CollapsingToolbarLayout mCollapsingToolBar;    private ImageView mBackImage;    private AppBarLayout mAppBar;    private Toolbar mToolBar;    List<String> tabLists=new ArrayList<String>();    List<Fragment> fragmentLists=new ArrayList<Fragment>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_tab_tool_bar);        //视图查询        initView();        //ToolBar的操作        init();        //数据存入        initData();    }    private void initData() {        tabLists.add("雨天");        tabLists.add("晴天");        tabLists.add("雪天");        RainyFragment rainyFragment = new RainyFragment();        FineFragment fineFragment = new FineFragment();        SnowyFragment snowyFragment = new SnowyFragment();        fragmentLists.add(rainyFragment);        fragmentLists.add(fineFragment);        fragmentLists.add(snowyFragment);        initFragPager();    }    private void initFragPager() {        //Adapter简单非常封装一下，传入储存tab的list和储存fragment的list就好        mViewPager.setAdapter(new pagrFragmentAdapter(getSupportFragmentManager(), tabLists, fragmentLists));        //俩者的关联方法        mTab.setupWithViewPager(mViewPager);        //tablayout有俩者模式，但是我觉得大多数还是我们现在使用的这一种-相当于权重当前空间        mTab.setTabMode(TabLayout.MODE_FIXED);    }    private void init() {        setSupportActionBar(mToolBar);        getSupportActionBar().setDisplayHomeAsUpEnabled(true);        mToolBar.setNavigationOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                onBackPressed();            }        });        //监听内部的CollapsingToolbarLayout        mAppBar.addOnOffsetChangedListener(new AppBarStateChangeListener() {            @Override            public void onStateChanged(AppBarLayout appBarLayout, State state) {                if (state == State.EXPANDED) {                    //展开状态                    mCollapsingToolBar.setTitle(" ");                } else if (state == State.COLLAPSED) {                    //折叠状态                    //收缩的时候 - 字体颜色                    mCollapsingToolBar.setCollapsedTitleTextColor(Color.BLUE);                    //收缩后的ToolBar背景色//                    mCollapsingToolBar.setContentScrimColor(Color.BLACK);                    mCollapsingToolBar.setContentScrimResource(R.drawable.girl);                    mCollapsingToolBar.setTitle("you need happy !");                } else {                    //中间状态                    mCollapsingToolBar.setTitle(" ");                }            }        });    }    private void initView() {        //这里的资源查询均是按照Xml布局顺序进行查询，从第二层的AppBar        mAppBar = (AppBarLayout) findViewById(R.id.tab_appbar);        mToolBar = (Toolbar) findViewById(R.id.tab_toolbar);        mBackImage = (ImageView) findViewById(R.id.tab_backdrop);        mCollapsingToolBar = (CollapsingToolbarLayout) findViewById(R.id.tab_collapsing);        mTab = (TabLayout) findViewById(R.id.tab_titles);        mViewPager = (ViewPager) findViewById(R.id.tab_viewpager);    }}

pagrFragmentAdapter

package com.yl.bar.barlayout.adapter;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import java.util.ArrayList;import java.util.List;/** * Created by YongLiu on 2017/8/1. */public class pagrFragmentAdapter extends FragmentPagerAdapter {    List<String> tabLists = new ArrayList<String>();    List<Fragment> pageLists = new ArrayList<Fragment>();    public pagrFragmentAdapter(FragmentManager fm, List tabLists, List pageLists) {        super(fm);        this.tabLists = tabLists;        this.pageLists = pageLists;    }    @Override    public Fragment getItem(int position) {        return pageLists.get(position);    }    @Override    public int getCount() {        return pageLists.size();    }    @Override    public CharSequence getPageTitle(int position) {        return tabLists.get(position % tabLists.size());    }}

TabToolBarActivity Xml：

<?xml version="1.0" encoding="utf-8"?><android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@android:color/background_light"    android:fitsSystemWindows="true">    <android.support.design.widget.AppBarLayout        android:id="@+id/tab_appbar"        android:layout_width="match_parent"        android:layout_height="300dp"        android:fitsSystemWindows="true"        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">        <android.support.design.widget.CollapsingToolbarLayout            android:id="@+id/tab_collapsing"            android:layout_width="match_parent"            android:layout_height="250dp"            android:fitsSystemWindows="true"            app:contentScrim="?attr/colorPrimary"            app:expandedTitleMarginEnd="64dp"            app:expandedTitleMarginStart="48dp"            app:layout_scrollFlags="scroll|exitUntilCollapsed">            <ImageView                android:id="@+id/tab_backdrop"                android:layout_width="match_parent"                android:layout_height="match_parent"                android:fitsSystemWindows="true"                android:scaleType="centerCrop"                android:src="@drawable/girl"                app:layout_collapseMode="parallax" />            <android.support.v7.widget.Toolbar                android:id="@+id/tab_toolbar"                android:layout_width="match_parent"                android:layout_height="?attr/actionBarSize"                app:layout_collapseMode="pin"                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />        </android.support.design.widget.CollapsingToolbarLayout>        <android.support.design.widget.TabLayout            android:id="@+id/tab_titles"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_alignParentBottom="true"            android:background="?attr/colorPrimary"            app:tabIndicatorHeight="4dp"            app:tabTextColor="#159"            app:tabIndicatorColor="#147"            app:tabSelectedTextColor="#111"            />    </android.support.design.widget.AppBarLayout>    <android.support.v4.view.ViewPager        android:id="@+id/tab_viewpager"        android:layout_width="match_parent"        android:layout_height="match_parent"        app:layout_behavior="@string/appbar_scrolling_view_behavior">    </android.support.v4.view.ViewPager></android.support.design.widget.CoordinatorLayout>

查阅的资料：

Android进阶之路 - Tablayout与Viewpager的使用（二）
http://blog.csdn.net/qq_20451879/article/details/63686695

Android5.0之CoordinatorLayout的使用
http://blog.csdn.net/u012702547/article/details/51286288

Material Design之CollapsingToolbarLayout使用
http://blog.csdn.net/u010687392/article/details/46906657

使用CoordinatorLayout打造各种炫酷的效果
http://www.jianshu.com/p/f09723b7e887

AppBar布局的使用方式
http://www.jianshu.com/p/4ce0f3419ca8

如何监听CollapsingToolbarLayout的展开与折叠
http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2016/0619/4362.html

可尝试扩展：

Android进阶之路 - PagerTabStrip与ViewPager的使用（一）
http://blog.csdn.net/qq_20451879/article/details/61520015