簡單復習
這篇也就簡單使用业栅，和前面關系不大
就暫時不復習了
這篇可能有點啰嗦龙填，并且只是使用，沒有難度
熟悉的同學略過前面而昨，或者整篇略過
Toolbar簡介
Toolbar出來至少也有2年多了
主觀任務帆焕，大體也就是material design中用來替代3.x的actionbar
在v7包中惭婿，需要gradle依賴一下
具體可以參考
鴻洋大神的博客
Toolbar簡單前提條件
- 在style中添加，隱藏原來的actionbar
- 一般會寫一個style叶雹，用的時候财饥，繼承它即可
<item name="windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
- 寫一些樣式的顏色（具體含義看鴻洋的博客）
- 簡單的參考 ，一般也會寫一個style浑娜，用的時候佑力，繼承即可
- ```
<!-- 導航欄 #4876FF @color/material_2 -->
<item name="colorPrimary">#4876FF</item>
<!-- 任務欄 #3A5FCD @color/material_3 -->
<item name="colorPrimaryDark">#3A5FCD</item>
<!-- 窗口的背景顏色 @android:color/white @color/material_1 -->
<item name="android:windowBackground">@android:color/white</item>
<item name="colorAccent">@color/material_1</item>
<!-- 導航欄文字顏色 @android:color/black @color/material_1 -->
<item name="android:textColorPrimary">@android:color/black</item>
Toolbar簡單例子
建立一個項目以后式散，寫一個Toolbar
這里只有一個Toolbar
對應的layout筋遭，很簡單吧
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="?attr/colorPrimary"
android:minHeight="45dp">
</android.support.v7.widget.Toolbar>
</LinearLayout>
在Activity中，設置一下
把Toolbar當成ActionBar
（當然可以設置標題暴拄，副標題漓滔，Logo，NavigationIcon等）
（也可以在xml中設置乖篷，這里略）
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
再關聯(lián)對應的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的代碼為：
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="@+id/dodo1"
android:title="dodo1"
app:showAsAction="withText|ifRoom"/>
<item android:id="@+id/dodo2"
android:title="dodo2"
android:orderInCategory="100"
app:showAsAction="withText|ifRoom"/>
</menu>
大體意思，就是
顯示text（如果有圖片撕蔼，文字和圖片都會顯示）
并且豁鲤， 如果放得下就顯示在右上角秽誊，如果放不下，就放在右上角的...中
這里效果大體為：
Toolbar簡單例子2
這里也就給menu添加了圖片
layout添加了可以滑動的TextView
<?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:overScrollMode="always"
android:fitsSystemWindows="true">
<!--<android.support.design.widget.AppBarLayout-->
<!--android:id="@+id/abl"-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="wrap_content"-->
<!--android:theme="@style/AppTheme.AppBarOverlay">-->
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:navigationIcon="@drawable/ic_menu_back"
app:subtitle="Sub Title"
app:layout_scrollFlags="scroll|snap|enterAlways"/>
<!--</android.support.design.widget.AppBarLayout>-->
<!--app:layout_behavior="@string/appbar_scrolling_view_behavior"-->
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
style="@style/TextAppearance.AppCompat.Display3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/holo_blue_bright"
android:text="A\nB\nC\nD\nE\nF\nG\nH\nI\nJ\nK\nL\nM\nN\nO\nP\nQ\nR\nS\nT\nU\nV\nW\nX\nY\nZ\nW\nX\nY\nZ" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
自己就不貼代碼了
可以參考琳骡，文章末尾的代碼地址文件
貼一下圖
這里Toolbar會一直顯示
Toolbar和NestedScrollView聯(lián)動
前面不能聯(lián)動锅论，是因為沒有接收的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
<?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:overScrollMode="always"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/abl"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:navigationIcon="@drawable/ic_menu_back"
app:subtitle="Sub Title"
app:layout_scrollFlags="scroll|snap|enterAlways"/>
</android.support.design.widget.AppBarLayout>
<!--app:layout_behavior="@string/appbar_scrolling_view_behavior"-->
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
style="@style/TextAppearance.AppCompat.Display3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/holo_blue_bright"
android:text="A\nB\nC\nD\nE\nF\nG\nH\nI\nJ\nK\nL\nM\nN\nO\nP\nQ\nR\nS\nT\nU\nV\nW\nX\nY\nZ\nW\nX\nY\nZ" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
這個時候，我們看一下效果
這里app:layout_scrollFlags有一些可以選擇的
具體每種是干什么的楣号？
下面一起來看一看
layout_scrollFlags了解
上面具體的例子最易，對應的滑動效果是由
app:layout_scrollFlags 來設置的
我們查閱一下，發(fā)現(xiàn)有5中可以選擇的（其中snap是后面添加的）
- scroll:
- 代碼中枚舉SCROLL_FLAG_SCROLL
- 所有想滾動出屏幕的view都需要設置這個flag炫狱， 沒有設置這個flag的view將被固定在屏幕頂部藻懒。
- snap:
- 代碼中枚舉SCROLL_FLAG_SNAP
- 在滾動結(jié)束后，如果view只是部分可見视译，它將滑動到最近的邊界嬉荆。
- enterAlways:
- 代碼中枚舉SCROLL_FLAG_ENTER_ALWAYS
- 這個flag讓任意向下的滾動都會導致該view變?yōu)榭梢姡瑔⒂每焖佟胺祷啬Ｊ健薄?/li>
- enterAlwaysCollapsed:
- 代碼中枚舉SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED
- 當你的視圖已經(jīng)設置minHeight屬性又使用此標志時酷含，你的視圖只能已最小高度進入员寇，只有當滾動視圖到達頂部時才擴大到完整高度。
- exitUntilCollapsed:
- 代碼中枚舉SCROLL_FLAG_EXIT_UNTIL_COLLAPSED
- 滾動退出屏幕第美，最后折疊在頂端蝶锋。
這里，我們在代碼中
用boolean值存儲狀態(tài)
再用下面的代碼設置效果
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添加對應的設置什往，動態(tài)設置扳缕，看一下效果
（中間的TextView會顯示當前設置的狀態(tài)，看圖的時候别威，可以觀察設置）
-
scroll相關
- 這里躯舔，如果設置scroll，也就是為true的時候省古，上面的Toolbar就會跟著滑動粥庄，并且會隱藏
- 反之，不設置豺妓，也就是false惜互，就不會隱藏，只會固定不動
-
snap相關（scroll條件下）
- 設置snap必須是scroll為true的情況下琳拭，不然训堆，不能動，也不會有效果
- 設置snap也就是為true的時候白嘁，是判斷后的彈性坑鱼，它將滑動到最近的邊界
- 反之，不設置絮缅，也就是false鲁沥，就不會自動滑動
-
enterAlways相關（scroll條件下）
- 設置enterAlways也就是為true的時候呼股，任意向下的滾動都會讓view（Toolbar）變?yōu)榭梢?/li>
- 反之，不設置画恰，也就是false卖怜，就需要向下拉到底以后，才會顯示view（Toolbar）
-
enterAlwaysCollapsed相關（scroll阐枣，enterAlways條件下）
- 設置enterAlwaysCollapsed必須是scroll為true马靠，enterAlways為true的情況下，不然蔼两，不會有效果
- 設置enterAlwaysCollapsed也就是為true的時候甩鳄，任意向下的滾動都會讓view（Toolbar）變?yōu)閙inHeight的高度可見
- 反之，不設置额划，也就是false妙啃，enterAlways的效果會全部顯示
-
exitUntilCollapsed相關（scroll條件下）
- 設置exitUntilCollapsed也就是為true的時候，任意向上的滾動都會讓view（Toolbar）變?yōu)閙inHeight的高度可見俊戳，而不會全部消失
- 反之揖赴，不設置，也就是false抑胎，會全部消失
中場小節(jié)
CoordinatorLayout中燥滑，
如果NestedScrollView要和Toolbar互動的話（CollapsingToolbarLayout等之后在了解，這里不涉及）
需要注意幾點
- 外面先要添加AppBarLayout來接收Behavior
- 再要注意給NestedScrollView
- 添加app:layout_behavior="@string/appbar_scrolling_view_behavior"
- 還要注意Toolbar的 layout_scrollFlags屬性
其他理解阿逃，上面已經(jīng)描述
下面簡單看一些例子
這里就只是把android studio默認創(chuàng)建的Activity
簡單修改铭拧，得到一些例子
其他簡單修改1（Tabbed Activity）
按照下面步驟可以創(chuàng)建項目
創(chuàng)建完以后，簡單運行后恃锉，為：
這個時候搀菩，我們想做一個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<vp.getAdapter().getCount(); i++){
tabLayout.getTabAt(i).setText(vp.getAdapter().getPageTitle(i));
}
因為是簡單修改州既，就不貼細節(jié)了
我們看看效果
大體就這樣了
代碼見后面的地址
其他簡單修改2（Scrolling Activity）
按照下面步驟可以創(chuàng)建項目
創(chuàng)建完以后，簡單運行后瘟芝，為：
這里和前面還不太一樣易桃，這里是CollapsingToolbarLayout
所以褥琐，我們簡單在CollapsingToolbarLayout中锌俱，添加一個ImageView（自己從小學就比較崇拜的歐拉）
再運行一下，看看結(jié)果
大體就這樣了
代碼見后面的地址
其他簡單修改3（Navigation Drawer Activity）
按照下面步驟可以創(chuàng)建項目
創(chuàng)建完以后敌呈，簡單運行后贸宏，為：
a5.gif
這里也比較簡單造寝，
- Toolbar添加app:layout_scrollFlags="scroll"
- 主體NestedScrollView添加app:layout_behavior="@string/appbar_scrolling_view_behavior"
a5-2.gif
大體就這樣了
代碼見后面的地址
簡單小節(jié)
CoordinatorLayout中，NestedScrollView和Toolbar聯(lián)動
注意Toolbar外面要套AppBarLayout
注意給Toolbar添加app:layout_scrollFlags
注意給NestedScrollView添加
app:layout_behavior="@string/appbar_scrolling_view_behavior"
其他的內(nèi)容吭练，后續(xù)一起學習具體代碼诫龙，可以見
https://github.com/2954722256/use_little_demo
對應 coordinator 的 Module
