CoordinatorLayout使用（四）：和Toolbar的简单使用

简单复习

这篇也就简单使用，和前面关系不大
就暂时不复习了
这篇可能有点啰嗦，并且只是使用，没有难度
熟悉的同学略过前面，或者整篇略过

Toolbar简介

Toolbar出来至少也有2年多了
主观任务，大体也就是material design中用来替代3.x的actionbar
在v7包中，需要gradle依赖一下
具体可以参考
鸿洋大神的博客

Toolbar简单前提条件

在style中添加，隐藏原来的actionbar
- 一般会写一个style，用的时候，继承它即可

false
true

- 写一些样式的颜色（具体含义看鸿洋的博客）
![](http://upload-images.jianshu.io/upload_images/2800913-f1e98e5c1285820a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
  - 简单的参考  ，一般也会写一个style，用的时候，继承即可
  - ```

#4876FF

#3A5FCD

@android:color/white
@color/material_1

@android:color/black

Toolbar简单例子

建立一个项目以后，写一个Toolbar
这里只有一个Toolbar
对应的layout，很简单吧

在Activity中，设置一下
把Toolbar当成ActionBar
（当然可以设置标题，副标题，Logo，NavigationIcon等）
（也可以在xml中设置，这里略）

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

再关联对应的menu，显示在右上角

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_a0, menu);
    return true;
}

再设置点击事件

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.dodo1) {
        Toast.makeText(getApplicationContext(),"dodo1", Toast.LENGTH_SHORT).show();
        return true;
    }

    if (id == R.id.dodo2) {
        Toast.makeText(getApplicationContext(),"dodo2", Toast.LENGTH_SHORT).show();
        return true;
    }

    return super.onOptionsItemSelected(item);
}

整个Activity的代码为：

package com.aohuan.dodo.coordinator.doa0;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

import com.aohuan.dodo.coordinator.R;


/**
 * Created by dodo_lihao on 2016/11/9.
 * qq: 2390183798
 *
 * 简单的ToolBar
 */
public class MainA0Activity extends AppCompatActivity {

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

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_a0, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.dodo1) {
            Toast.makeText(getApplicationContext(),"dodo1", Toast.LENGTH_SHORT).show();
            return true;
        }

        if (id == R.id.dodo2) {
            Toast.makeText(getApplicationContext(),"dodo2", Toast.LENGTH_SHORT).show();
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

menu的代码为：

大体意思，就是
显示text（如果有图片，文字和图片都会显示）
并且，如果放得下就显示在右上角，如果放不下，就放在右上角的...中

这里效果大体为：

CoordinatorLayout使用（四）：和Toolbar的简单使用_第1张图片

Toolbar简单例子2

这里也就给menu添加了图片
layout添加了可以滑动的TextView

自己就不贴代码了
可以参考，文章末尾的代码地址文件
贴一下图

CoordinatorLayout使用（四）：和Toolbar的简单使用_第2张图片

这里Toolbar会一直显示

Toolbar和NestedScrollView联动

前面不能联动，是因为没有接收的behavior
我们在Toolbar外面添加一个
android.support.design.widget.AppBarLayout

再给Toolbar添加一个
app:layout_scrollFlags="scroll|snap|enterAlways"

还有对应的android.support.v4.widget.NestedScrollView添加一个
app:layout_behavior="@string/appbar_scrolling_view_behavior"

对应的layout

这个时候，我们看一下效果

CoordinatorLayout使用（四）：和Toolbar的简单使用_第3张图片

这里app:layout_scrollFlags有一些可以选择的
具体每种是干什么的？
下面一起来看一看

layout_scrollFlags了解

上面具体的例子，对应的滑动效果是由
app:layout_scrollFlags 来设置的
我们查阅一下，发现有5中可以选择的（其中snap是后面添加的）

scroll:
- 代码中枚举SCROLL_FLAG_SCROLL
- 所有想滚动出屏幕的view都需要设置这个flag，没有设置这个flag的view将被固定在屏幕顶部。
snap:
- 代码中枚举SCROLL_FLAG_SNAP
- 在滚动结束后，如果view只是部分可见，它将滑动到最近的边界。
enterAlways:
- 代码中枚举SCROLL_FLAG_ENTER_ALWAYS
- 这个flag让任意向下的滚动都会导致该view变为可见，启用快速“返回模式”。
enterAlwaysCollapsed:
- 代码中枚举SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED
- 当你的视图已经设置minHeight属性又使用此标志时，你的视图只能已最小高度进入，只有当滚动视图到达顶部时才扩大到完整高度。
exitUntilCollapsed:
- 代码中枚举SCROLL_FLAG_EXIT_UNTIL_COLLAPSED
- 滚动退出屏幕，最后折叠在顶端。

这里，我们在代码中
用boolean值存储状态
再用下面的代码设置效果

private void setToolbarLayoutFlag(){
    AppBarLayout.LayoutParams params = (AppBarLayout.LayoutParams) toolbar.getLayoutParams();

    params.setScrollFlags(  (isScroll?AppBarLayout.LayoutParams.SCROLL_FLAG_SCROLL:0)
            | (isSnap?AppBarLayout.LayoutParams.SCROLL_FLAG_SNAP:0)
            | (isEnterAlways?AppBarLayout.LayoutParams.SCROLL_FLAG_ENTER_ALWAYS:0)
            | (isEnterAlwaysCollapsed?AppBarLayout.LayoutParams.SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED:0)
            | (isExitUntilCollapsed?AppBarLayout.LayoutParams.SCROLL_FLAG_EXIT_UNTIL_COLLAPSED:0));
    toolbar.setLayoutParams(params);
}

再给Toolbar添加对应的设置，动态设置，看一下效果
（中间的TextView会显示当前设置的状态，看图的时候，可以观察设置）

scroll相关
- 这里，如果设置scroll，也就是为true的时候，上面的Toolbar就会跟着滑动，并且会隐藏
- 反之，不设置，也就是false，就不会隐藏，只会固定不动
snap相关（scroll条件下）
- 设置snap必须是scroll为true的情况下，不然，不能动，也不会有效果
- 设置snap也就是为true的时候，是判断后的弹性，它将滑动到最近的边界
- 反之，不设置，也就是false，就不会自动滑动
enterAlways相关（scroll条件下）
- 设置enterAlways也就是为true的时候，任意向下的滚动都会让view（Toolbar）变为可见
- 反之，不设置，也就是false，就需要向下拉到底以后，才会显示view（Toolbar）
enterAlwaysCollapsed相关（scroll，enterAlways条件下）
- 设置enterAlwaysCollapsed必须是scroll为true，enterAlways为true的情况下，不然，不会有效果
- 设置enterAlwaysCollapsed也就是为true的时候，任意向下的滚动都会让view（Toolbar）变为minHeight的高度可见
- 反之，不设置，也就是false，enterAlways的效果会全部显示
exitUntilCollapsed相关（scroll条件下）
- 设置exitUntilCollapsed也就是为true的时候，任意向上的滚动都会让view（Toolbar）变为minHeight的高度可见，而不会全部消失
- 反之，不设置，也就是false，会全部消失

中场小节

CoordinatorLayout中，
如果NestedScrollView要和Toolbar互动的话（CollapsingToolbarLayout等之后在了解，这里不涉及）
需要注意几点

外面先要添加AppBarLayout来接收Behavior
再要注意给NestedScrollView
- 添加app:layout_behavior="@string/appbar_scrolling_view_behavior"
还要注意Toolbar的 layout_scrollFlags属性

其他理解，上面已经描述
下面简单看一些例子
这里就只是把android studio默认创建的Activity
简单修改，得到一些例子

其他简单修改1（Tabbed Activity）

按照下面步骤可以创建项目

CoordinatorLayout使用（四）：和Toolbar的简单使用_第9张图片

创建完以后，简单运行后，为：

CoordinatorLayout使用（四）：和Toolbar的简单使用_第10张图片

这个时候，我们想做一个pending的TabLayout
滑动的时候，隐藏上面的Toolbar

于是，

AppBarLayout中，Toolbar下面，添加一个TabLayout
Toolbar添加app:layout_scrollFlags="scroll|enterAlways"
给ViewPager添加
- app:layout_behavior="@string/appbar_scrolling_view_behavior"
再给Fragment中添加一点TextView
在Activity中，绑定对应的TabLayout和ViewPager

tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.setupWithViewPager(vp);
for(int i=0; i

 
 因为是简单修改，就不贴细节了
 我们看看效果 
  
   
    
     
    
   
   
  
 大体就这样了
 代码见后面的地址 
  
 其他简单修改2（Scrolling Activity） 
 按照下面步骤可以创建项目 
 
 
  
   
    
     
    
   
   
  
 
 
 创建完以后，简单运行后，为： 
 
 
  
   
     
    
   
   
  
 
 这里和前面还不太一样，这里是CollapsingToolbarLayout 
 
 所以，我们简单在CollapsingToolbarLayout中，添加一个ImageView（自己从小学就比较崇拜的欧拉） 
 
 
 再运行一下，看看结果 
  
   
     
    
   
   
  
 大体就这样了
 代码见后面的地址 
  
 其他简单修改3（Navigation Drawer Activity） 
 按照下面步骤可以创建项目 
 
 
  
   
    
     
    
   
   
  
 
 
 创建完以后，简单运行后，为： 
  
   
    
     
    
   
  
    a5.gif 
   
  
 
 
 这里也比较简单， 
  
  Toolbar添加app:layout_scrollFlags="scroll" 
  主体NestedScrollView添加app:layout_behavior="@string/appbar_scrolling_view_behavior" 
  
  
   
    
     
    
   
  
    a5-2.gif 
   
  
 大体就这样了
 代码见后面的地址 
  
 简单小节 
 CoordinatorLayout中，NestedScrollView和Toolbar联动 
 注意Toolbar外面要套AppBarLayout
 注意给Toolbar添加app:layout_scrollFlags
 注意给NestedScrollView添加
 app:layout_behavior="@string/appbar_scrolling_view_behavior" 
 其他的内容，后续一起学习具体代码，可以见
 https://github.com/2954722256/use_little_demo
 对应 coordinator 的 Module