個(gè)人公眾號(hào)：代碼潔癖患者

?因?yàn)槟阋鹣埽覑?ài)上了這個(gè)世界<br><br>??帆書(shū)（原樊登讀書(shū)）·個(gè)人成長(zhǎng)導(dǎo)師<br>??簡(jiǎn)書(shū)簽約作者|心理咨詢｜婚戀情感咨詢<br>??付費(fèi)咨詢｜親密關(guān)系修復(fù)｜個(gè)人成長(zhǎng)｜告別焦慮

記錄是改命的過(guò)程稀火，是累積和成長(zhǎng)的過(guò)程，它是每天的正向監(jiān)督和反饋赌朋，是對(duì)時(shí)間的感知凰狞，它是習(xí)慣能養(yǎng)成最重要的原因，跟著我沛慢，寫(xiě)自己的人生記錄赡若，從生到死，跟著記錄去夢(mèng)想成真团甲。

69年7月的一天出生于湖南張家界桑植的一小山村躺苦。綿綿群山為吾生長(zhǎng)之境身腻，曲曲澧水乃余精神寄托之域。89年出桑外出求學(xué)匹厘，92年回桑以育桑梓子弟為業(yè)嘀趟，勤勤勉勉已近三十載∮希看吾鄉(xiāng)日變去件，見(jiàn)人情冷暖，常常激動(dòng)于懷扰路，幾欲以筆訴之尤溜，卻往往難盡己意！且老驥伏櫪汗唱，尚有壯心宫莱，故時(shí)時(shí)鞭策，不忘初心哩罪，姑記吾心之簡(jiǎn)歷矣授霸。

擁有愛(ài)自己、認(rèn)為自己值得被人所愛(ài)的人，才會(huì)擁有與自己好好相處的能力斗搞。<br><br>

喜食好色的一枚無(wú)業(yè)游民

怕終有一天會(huì)失憶，記錄走過(guò)的山河萬(wàn)里……

哈嘍，大家好狞山，我是縱馬江湖道驶鹉，一覽眾山小的我逍遙樂(lè)天笑。買(mǎi)簡(jiǎn)書(shū)會(huì)員鏈接:<a href="http://www.reibang.com/mobile/club?ref=f8297fc9" target="_blank">http://www.reibang.com/mobile/club?ref=f8297fc9</a>

在讀書(shū)行走間認(rèn)識(shí)自己～<br>公眾號(hào)：暖年時(shí)光

今年(2014) 的 google i/o 發(fā)表令多數(shù)人為之一亮的 material design，而 google 也從「google i/o 2014」 開(kāi)始霍殴，大家也陸陸續(xù)續(xù)地看到其更新的 android app 皆套用了這個(gè)設(shè)計(jì)介面媒惕。當(dāng)然，這個(gè)設(shè)計(jì)介面著實(shí)讓大家感到驚艷外来庭，更讓 android 開(kāi)發(fā)者開(kāi)始擔(dān)心未來(lái) app 的界面處理了妒蔚。 不過(guò)，所幸有著之前 actionbar 的經(jīng)驗(yàn)后月弛，android 也很快地在 support library 里面提供了相對(duì)應(yīng)的 api 給開(kāi)發(fā)者使用肴盏，本篇就為各位介紹 – toolbar，這是用來(lái)取代過(guò)去 actionbar 的控件帽衙，而現(xiàn)在于 material design 中也對(duì)之有一個(gè)統(tǒng)一名稱：app bar菜皂，在未來(lái)的 android app 中，就以 toolbar 這個(gè)元件來(lái)實(shí)作之厉萝。 android：ToolBar詳解（手把手教程） - android神 - 武臘福 1. 概述 Android 3.0 Android 推了 ActionBar 這個(gè)控件恍飘，而到了2013 年 Google 開(kāi)始大力地推動(dòng)所謂的 android style榨崩，想要逐漸改善過(guò)去 android 紛亂的界面設(shè)計(jì)，希望讓終端使用者盡可能在 android 手機(jī)有個(gè)一致的操作體驗(yàn)常侣。ActionBar 過(guò)去最多人使用的兩大套件就是 ActionBarSherlock 以及官方提供在 support library v 7 里的 AppCompat。 既然會(huì)有本篇跟各位介紹的 Toolbar弹渔，也意味著官方在某些程度上認(rèn)為 ActionBar 限制了 android app 的開(kāi)發(fā)與設(shè)計(jì)的彈性胳施，而在 material design 也對(duì)之做了名稱的定義：App bar。接下來(lái)將為各位分成幾個(gè)階段進(jìn)行說(shuō)明肢专，如何在 android app 中用 toolbar 這個(gè)控件來(lái)做出一個(gè)基本的 app bar 嘍舞肆。 本篇所使用到的程序請(qǐng)到 Github 取得。 2. 基礎(chǔ)套用 這個(gè)階段從 toolbar_demo_checkpoint0 開(kāi)始博杖，分成下列三個(gè)部份： 風(fēng)格 (style) 界面 (layout) 程序 (java) 2.1 風(fēng)格(style) 風(fēng)格要調(diào)整的地方有二 一在 res/values/styles.xml中 二在 /res/values-v21/styles.xml中 為了之后設(shè)定方便椿胯，我們先在 res/values/styles.xml 里增加一個(gè)名為 AppTheme.Base 的風(fēng)格 1 2 3 4 <style name="AppTheme.Base" parent="Theme.AppCompat"> <item name="windowActionBar">false</item> <item name="android:windowNoTitle">true</item> </style> 因?yàn)榇朔独皇褂?Toolbar，所以我們要將讓原本的 ActionBar 隱藏起來(lái)剃根，然后將原本 AppTheme 的 parent 屬性 改為上面的AppTheme.Base哩盲，代碼如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <resources> <!-- Base application theme. --> <style name="AppTheme" parent="AppTheme.Base"> </style> <style name="AppTheme.Base" parent="Theme.AppCompat"> <item name="windowActionBar">false</item> <del><item name="android:windowNoTitle">true</item></del> <!-- 使用 API Level 22 編譯的話，要拿掉前綴字 --> <item name="windowNoTitle">true</item> </style> </resources> 再來(lái)調(diào)整Android 5.0的style： /res/values-v21/styles.xml狈醉，也將其 parent 屬性改為 AppTheme.Base： 1 2 3 4 5 <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="AppTheme.Base"> </style> </resources> 2.2 界面(Layout) 在 activity_main.xml 里面添加 Toolbar 控件： 1 2 3 4 5 6 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_height="?attr/actionBarSize" android:layout_width="match_parent" > </android.support.v7.widget.Toolbar> 請(qǐng)記得用 support v7 里的 toolbar廉油，不然然只有 API Level 21 也就是 Android 5.0 以上的版本才能使用。 這里需注意苗傅，要將 RelatvieLayout 里的四個(gè)方向的padding 屬性去掉抒线，并記得將原本的 Hello World 設(shè)為 layout_below="@+id/toolbar" ，否則會(huì)看到像下面這樣的錯(cuò)誤畫(huà)面渣慕。 android：ToolBar詳解（手把手教程） - android神 - 武臘福 2.3 程序 (Java) 在 MainActivity.java 中加入 Toolbar 的聲明： 1 2 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); 聲明后嘶炭，再將之用 setSupportActionBar 設(shè)定，Toolbar即能取代原本的 actionbar 了逊桦，此階段完成畫(huà)面如下： android：ToolBar詳解（手把手教程） - android神 - 武臘福 完整代碼見(jiàn)：toolbar_demo_checkpoint1 3. 自定義顏色(Customization color) 這個(gè)階段將從 toolbar_demo_checkpoint1 接著往下進(jìn)行： android：ToolBar詳解（手把手教程） - android神 - 武臘福 上圖是將本階段要完成的結(jié)果畫(huà)面做了標(biāo)示眨猎，結(jié)合下面的描述希望大家能明白。 colorPrimaryDark（狀態(tài)欄底色）：在風(fēng)格 (styles) 或是主題 (themes) 里進(jìn)行設(shè)定强经。 App bar 底色 這個(gè)設(shè)定分為二宵呛，若你的 android app 仍是使用 actionbar ，則直接在風(fēng)格 (styles) 或是主題 (themes) 里進(jìn)行設(shè)定 colorPrimary 參數(shù)即可夕凝； 可若是采用 toolbar 的話宝穗，則要在界面 (layout) 里面設(shè)定 toolbar 控件的 background 屬性。 navigationBarColor（導(dǎo)航欄底色）： 僅能在 API v21 也就是 Android 5 以后的版本中使用码秉， 因此要將之設(shè)定在 res/values-v21/styles.xml 里面逮矛。 主視窗底色：windowBackground 也因此在這個(gè)階段，我們需要設(shè)定的地方有三转砖，一是 style中(res/values/styles.xml) 1 2 3 4 5 6 7 8 9 10 <style name="AppTheme.Base" parent="Theme.AppCompat"> <item name="windowActionBar">false</item> <item name="android:windowNoTitle">true</item> <!-- Actionbar color --> <item name="colorPrimary">@color/accent_material_dark</item> <!--Status bar color--> <item name="colorPrimaryDark">@color/accent_material_light</item> <!--Window color--> <item name="android:windowBackground">@color/dim_foreground_material_dark</item> </style> 再來(lái)是 v21 的style中 (res/values-v21/styles.xml) 1 2 3 4 <style name="AppTheme" parent="AppTheme.Base"> <!--Navigation bar color--> <item name="android:navigationBarColor">@color/accent_material_light</item> </style> 最后须鼎，就是為了本篇的主角 – Toolbar 的 background 進(jìn)行設(shè)定鲸伴。 1 2 3 4 5 6 7 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_height="?attr/actionBarSize" android:layout_width="match_parent" android:background="?attr/colorPrimary" > </android.support.v7.widget.Toolbar> 在本范例中，toolbar 是設(shè)定來(lái)在 activity_main.xml晋控，對(duì)其設(shè)定 background 屬性： android:background="?attr/colorPrimary" 汞窗，這樣就可以使之延用 Actionbar 的顏色設(shè)定嘍。 最后赡译，再來(lái)看一下結(jié)果畫(huà)面仲吏。 android：ToolBar詳解（手把手教程） - android神 - 武臘福 完整代碼見(jiàn)： toolbar_demo_checkpoint2 4. 控件 (component) 本階段將從 toolbar_demo_checkpoint2 接續(xù)，在還未于 <android.support.v7.widget.Toolbar/> 標(biāo)簽中蝌焚，自行添加元件的 toolbar 有幾個(gè)大家常用的元素可以使用裹唆，請(qǐng)先見(jiàn)下圖： android：ToolBar詳解（手把手教程） - android神 - 武臘福 大抵來(lái)說(shuō)，預(yù)設(shè)常用的幾個(gè)元素就如圖中所示只洒，接著就依序來(lái)說(shuō)明之： setNavigationIcon 即設(shè)定 up button 的圖標(biāo)许帐，因?yàn)?Material 的介面，在 Toolbar這里的 up button樣式也就有別于過(guò)去的 ActionBar 哦毕谴。 setLogo APP 的圖標(biāo)成畦。 setTitle 主標(biāo)題。 setSubtitle 副標(biāo)題涝开。 setOnMenuItemClickListener 設(shè)定菜單各按鈕的動(dòng)作羡鸥。 先來(lái)看看菜單外的代碼，在 MainActivity.java 中： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); // App Logo toolbar.setLogo(R.drawable.ic_launcher); // Title toolbar.setTitle("My Title"); // Sub Title toolbar.setSubtitle("Sub title"); setSupportActionBar(toolbar); // Navigation Icon 要設(shè)定在 setSupoortActionBar 才有作用 // 否則會(huì)出現(xiàn) back button toolbar.setNavigationIcon(R.drawable.ab_android); 這邊要留意的是setNavigationIcon需要放在 setSupportActionBar之后才會(huì)生效忠寻。 菜單部分惧浴，需要先在res/menu/menu_main.xml左定義： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <menu 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" tools:context=".MainActivity"> <item android:id="@+id/action_edit" android:title="@string/action_edit" android:orderInCategory="80" android:icon="@drawable/ab_edit" app:showAsAction="ifRoom" /> <item android:id="@+id/action_share" android:title="@string/action_edit" android:orderInCategory="90" android:icon="@drawable/ab_share" app:showAsAction="ifRoom" /> <item android:id="@+id/action_settings" android:title="@string/action_settings" android:orderInCategory="100" app:showAsAction="never"/> </menu> 再回到MainActivity.java 中加入OnMenuItemClickListener 的監(jiān)聽(tīng)者： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 private Toolbar.OnMenuItemClickListener onMenuItemClick = new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem menuItem) { String msg = ""; switch (menuItem.getItemId()) { case R.id.action_edit: msg += "Click edit"; break; case R.id.action_share: msg += "Click share"; break; case R.id.action_settings: msg += "Click setting"; break; } if(!msg.equals("")) { Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show(); } return true; } }; 將onMenuItemClick監(jiān)聽(tīng)者設(shè)置給toolbar 1 2 3 4 5 6 setSupportActionBar(toolbar); ... // Menu item click 的監(jiān)聽(tīng)事件一樣要設(shè)定在 setSupportActionBar 才有作用 toolbar.setOnMenuItemClickListener(onMenuItemClick); 和 setNavigationIcon 一樣，需要將之設(shè)定在 setSupportActionBar 之后才有作用奕剃。執(zhí)行上面的代碼便會(huì)得到下面的界面衷旅。 android：ToolBar詳解（手把手教程） - android神 - 武臘福 完完整程序見(jiàn)：toolbar_demo_checkpoint3 5. 總結(jié) 在這樣的架構(gòu)設(shè)計(jì)下，ToolBar直接成了Layout中可以控制的東西纵朋，相對(duì)于過(guò)去的actionbar來(lái)說(shuō)柿顶，設(shè)計(jì)與可操控性大幅提升。 本文上面的解釋中用到的完成代碼：toolbar demo check point 0 ~ 4操软，請(qǐng)到Github 取得嘁锯。 最后再附上一個(gè)界面上常用的屬性說(shuō)明圖： android：ToolBar詳解（手把手教程） - android神 - 武臘福 這里按照?qǐng)D中從上到下的順序做個(gè)簡(jiǎn)單的說(shuō)明： colorPrimaryDark 狀態(tài)欄背景色。 在 style 的屬性中設(shè)置聂薪。 textColorPrimary App bar 上的標(biāo)題與更多菜單中的文字顏色家乘。 在 style 的屬性中設(shè)置。 App bar 的背景色 Actionbar 的背景色設(shè)定在 style 中的 colorPrimary藏澳。 Toolbar 的背景色在layout文件中設(shè)置background屬性仁锯。 colorAccent 各控制元件(如：check box、switch 或是 radoi) 被勾選 (checked) 或是選定 (selected) 的顏色翔悠。 在 style 的屬性中設(shè)置业崖。 colorControlNormal 各控制元件的預(yù)設(shè)顏色野芒。 在 style 的屬性中設(shè)置 windowBackground App 的背景色。 在 style 的屬性中設(shè)置 navigationBarColor 導(dǎo)航欄的背景色双炕，但只能用在 API Level 21 (Android 5) 以上的版本 在 style 的屬性中設(shè)置

營(yíng)銷妇斤，攝影摇锋，互聯(lián)網(wǎng)，HUST趟济，微信公眾號(hào)“江流”文章首發(fā)乱投，個(gè)人微信號(hào)1206707531咽笼，附二維碼

就是這么簡(jiǎn)簡(jiǎn)單單