{"id":1592,"date":"2016-05-31T17:47:53","date_gmt":"2016-05-31T09:47:53","guid":{"rendered":"https:\/\/ai.zhousir.top\/?p=1592"},"modified":"2020-04-15T22:26:00","modified_gmt":"2020-04-15T14:26:00","slug":"%e8%af%a6%e8%a7%a3-material-design-%e5%85%bc%e5%ae%b9%e5%ba%93%e7%9a%84%e4%bd%bf%e7%94%a8","status":"publish","type":"post","link":"https:\/\/ai.zhousir.top\/?p=1592","title":{"rendered":"\u8be6\u89e3 Material Design \u517c\u5bb9\u5e93\u7684\u4f7f\u7528"},"content":{"rendered":"<p>\u4f17\u6240\u5468\u77e5Material Design\uff08\u6750\u8d28\u8bbe\u8ba1\uff09\u662fGoogle\u57282014\u5e74I\/O\u5927\u4f1a\u4e0a\u53d1\u5e03\u7684\u4e00\u79cd\u65b0\u7684\u8bbe\u8ba1\u89c4\u8303\u3002\u4e00\u7ecf\u63a8\u51fa\u5c31\u597d\u8bc4\u5982\u6f6e\uff0c\u4e2a\u4eba\u662f\u975e\u5e38\u559c\u6b22\u8fd9\u79cd\u98ce\u683c\u7684\uff0c\u7531\u4e8e\u4ed6\u53ea\u652f\u63015.0\u53ca\u5176\u4ee5\u4e0a\u7684\u8bbe\u5907\uff0c\u5f00\u53d1\u8005\u4e5f\u53ea\u662f\u53bb\u5c1d\u5c1d\u9c9c\uff0c\u5e76\u6ca1\u7528\u5728\u771f\u5b9e\u7684\u9879\u76ee\u4e2d\u53bb\uff0c\u4f7f\u5f97\u5176\u5728\u56fd\u5185\u7684\u5e02\u573a\u5e76\u4e0d\u662f\u592a\u597d\u3002<!--more-->\u968f\u540e\u4e0d\u4e45Google\u5c31\u9000\u51fa\u4e86\u5176\u517c\u5bb9\u5e93Android Design Support Library\uff0c\u517c\u5bb9\u81f32.1\uff01\u8fd9\u7edd\u5bf9\u662f\u4e1a\u754c\u826f\u5fc3\uff0c\u6781\u5927\u7684\u4fbf\u5229\u4e86\u6211\u4eec\u8fd9\u4e9b\u5f00\u53d1\u8005\u3002\u8fd9\u4e00\u517c\u5bb9\u5e93\u53ef\u4ee5\u8ba9\u6211\u4eec\u53ef\u4ee5\u5728\u81ea\u5df1\u7684\u9879\u76ee\u771f\u5b9e\u7684\u53bb\u4f53\u9a8c\u4e00\u628a\u3002\u767e\u5ea6\u8c37\u6b4c\u4e00\u4e0b\uff0c\u5176\u5b9e\u73b0\u5728\u5df2\u7ecf\u6709\u4e2a\u5f88\u591a\u4ecb\u7ecd\u8fd9\u4e2a\u652f\u6301\u5e93\u7684\u6587\u7ae0\uff0c\u4f46\u662f\u5f88\u591a\u90fd\u5e76\u4e0d\u592a\u8be6\u7ec6\uff0c\u5927\u90e8\u5206\u8ba9\u4eba\u770b\u4e86\u90fd\u4f3c\u61c2\u975e\u61c2\uff0c\u6211\u4e4b\u524d\u4e5f\u5b66\u4e60\u8fc7\u8fd9\u4e2a\u5e93\u7684\u7528\u6cd5\uff0c\u5f88\u4e45\u6ca1\u770b\u57fa\u672c\u53c8\u5fd8\u4e86\uff0c\u6700\u8fd1\u6211\u53c8\u91cd\u65b0\u5f00\u59cb\u5b66\u4e60\u4e86\u8fd9\u4e2a\u5e93\uff0c\u6240\u4ee5\u672c\u6587\u4e5f\u4e3b\u8981\u662f\u5bf9\u8fd9\u6b21\u5b66\u4e60\u7684\u4e00\u4e2a\u603b\u7ed3\uff0c\u5f53\u7136\u4e5f\u53c2\u8003\u4e86\u5176\u4ed6\u5f88\u591a\u7684\u6587\u7ae0\uff0c\u7b97\u662f\u7ad9\u5728\u5de8\u4eba\u7684\u80a9\u8180\u4e0a\u5427\uff0c\u5f53\u7136\u8fd9\u7bc7\u6587\u7ae0\u4e5f\u4e3a\u540e\u6765\u7684\u5b66\u4e60\u8005\u6709\u66f4\u591a\u7684\u53c2\u8003\u8d44\u6599\u3002<\/p>\n<hr \/>\n<p>\u5148\u6765\u51e0\u5f20\u6548\u679c\u56fe\u5427\uff1a<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-6faff3933cbdc60b.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"556\" height=\"353\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-6faff3933cbdc60b.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><a href=\"https:\/\/ai.zhousir.top\/wp-content\/uploads\/2020\/04\/201407311445259040063.jpg\" rel=\"fancybox\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-2826\" src=\"https:\/\/ai.zhousir.top\/wp-content\/uploads\/2020\/04\/201407311445259040063.jpg\" alt=\"20140731144525904006\" width=\"383\" height=\"268\" \/><\/a><\/p>\n<div class=\"image-caption\">\u56fe1<\/div>\n<\/div>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a41e2b7a17ece6fb.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"756\" height=\"315\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a41e2b7a17ece6fb.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">\u56fe2<\/div>\n<\/div>\n<p>\u611f\u5174\u8da3\u7684\u4e5f\u53ef\u4ee5\u5148\u770b\u770b\uff0c\u6700\u540e\u80fd\u505a\u4e00\u4e2a\u4ec0\u4e48\u6837\u7684App\uff1a<a href=\"http:\/\/pan.baidu.com\/s\/1pLzj2uJ\" target=\"_blank\">MDDemo.apk<\/a><\/p>\n<hr \/>\n<p>\u8bf4\u5230\u8fd9\u4e2a\u517c\u5bb9\u5e93\uff0c\u5176\u5b9e\u5f88\u591a\u90fd\u662f\u53ef\u4ee5\u5728Github\u53bb\u627e\u5230\u5bf9\u5e94\u7684\u6548\u679c\u7684\uff0c\u5176\u5b9e\u6211\u4eec\u4e5f\u662f\u53ef\u4ee5\u53bb\u7528Github\u4e0a\u7684\u90a3\u4e9b\u5f00\u6e90\u9879\u76ee\uff0c\u90a3\u4e48\u591a\u7684\u5e93\u90fd\u8981\u4e00\u4e2a\u4e00\u4e2a\u53bb\u5f15\u7528\uff0c\u8fd8\u662f\u975e\u5e38\u7684\u9ebb\u70e6\uff0c\u6211\u731c\u53ef\u80fdGoogle\u4e5f\u662f\u770b\u5230\u8fd9\u4e9b\u4e1c\u897f\u7ecf\u5e38\u88ab\u5f00\u53d1\u8005\u7528\u5728\u4e86\u9879\u76ee\u4e2d\uff0c\u7d22\u6027\u81ea\u5df1\u5c06\u5176\u5c01\u88c5\u6210\u4e86\u4e00\u4e2a\u5e93\uff0c\u4ee5\u65b9\u4fbf\u5f00\u53d1\u8005\u7684\u4f7f\u7528\u3002\u8fd9\u4e2a\u5e93\u6211\u4eec\u5e94\u8be5\u600e\u6837\u53bb\u4f7f\u7528\u5462\uff1f\u8fd9\u662f\u672c\u6587\u8bb2\u89e3\u7684\u91cd\u70b9\u3002\u9996\u5148\u6211\u4eec\u770b\u770b\u8fd9\u4e2a\u5e93\u600e\u4e48\u53bb\u5f15\u7528\u5230\u6211\u4eec\u7684\u9879\u76ee\u4e2d\uff1a<\/p>\n<blockquote><p>compile &#8216;com.android.support:design:23.1.1&#8217;<\/p><\/blockquote>\n<p>\u6211\u4eec\u53ea\u9700\u5c06\u5176\u6dfb\u52a0\u5230\u9879\u76ee\u7684\u4f9d\u8d56\u4e2d\u53bb\uff0c\u7136\u540e\u540c\u6b65\u4e00\u4e0b\u5c31OK\u4e86\u3002<br \/>\n\u6dfb\u52a0\u4e86\u4f9d\u8d56\u4e4b\u540e\u6211\u4eec\u518d\u6765\u770b\u770b\u8fd9\u4e2a\u5e93\u91cc\u9762\u90fd\u6709\u54ea\u4e9b\u63a7\u4ef6\u5427\uff0c\u5982\u4e0b\u56fe\uff0c\u7ea2\u8272\u8fb9\u6846\u77e9\u5f62\u6846\u51fa\u6765\u7684\u5c31\u662f\u8fd9\u4e2a\u5e93\u91cc\u9762\u5305\u542b\u7684\u63a7\u4ef6\uff0c\u6211\u4eec\u53ef\u4ee5\u770b\u5230\u6709<strong>AppBarLayout\u3001CollapsingToolbarLayout\u3001CoordinatorLayout\uff0cFloatingActionButton\u3001NavigationView\u3001Snackbar\u3001TabLayout\u3001TextInputLayout<\/strong>\u8fd9\u516b\u79cd\uff0c\u540e\u9762\u6211\u4f1a\u4e00\u4e2a\u4e00\u4e2a\u4ecb\u7ecd\u7528\u6cd5\uff0c\u5982\u679c\u8fd8\u6ca1\u5b66\u8fc7\u8fd9\u4e9b\u63a7\u4ef6\u4f7f\u7528\u7684\u672c\u6587\u53ef\u4ee5\u624b\u628a\u624b\u6559\u4f60\u5b66\u4f1a\u600e\u4e48\u53bb\u4f7f\u7528\uff0c\u5982\u679c\u4e4b\u524d\u6709\u4e86\u89e3\u8fc7\u7684\u6216\u8005\u5bf9\u8fd9\u4e2a\u8fd8\u6bd4\u8f83\u719f\u6089\u7684\uff0c\u4e5f\u53ef\u4ee5\u7ee7\u7eed\u770b\u4e0b\u53bb\uff0c\u5c31\u5f53\u505a\u6e29\u4e60\u4e00\u4e0b\uff0c\u987a\u4fbf\u8fd8\u53ef\u4ee5\u5e2e\u6211\u627e\u51fa\u6709\u8868\u8fbe\u4e0d\u6b63\u786e\u7684\u5730\u65b9\u3002<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-7ba69eee1de7d116.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"324\" height=\"618\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-7ba69eee1de7d116.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">\u5e93\u4e2d\u5305\u542b\u7684\u63a7\u4ef6.png<\/div>\n<\/div>\n<h2>1.Snackbar<\/h2>\n<p>SnackBar\u901a\u8fc7\u5728\u5c4f\u5e55\u5e95\u90e8\u5c55\u793a\u7b80\u6d01\u7684\u4fe1\u606f\uff0c\u4e3a\u4e00\u4e2a\u64cd\u4f5c\u63d0\u4f9b\u4e86\u4e00\u4e2a\u8f7b\u91cf\u7ea7\u7684\u53cd\u9988\uff0c\u5e76\u4e14\u5728Snackbar\u4e2d\u8fd8\u53ef\u4ee5\u5305\u542b\u4e00\u4e2a\u64cd\u4f5c\uff0c\u5728\u540c\u4e00\u65f6\u95f4\u5185\uff0c\u4ec5\u4e14\u53ea\u80fd\u663e\u793a\u4e00\u4e2a Snackbar\uff0c\u5b83\u7684\u663e\u793a\u4f9d\u8d56\u4e8eUI\uff0c\u4e0d\u50cfToast\u90a3\u6837\u53ef\u4ee5\u8131\u79bb\u5e94\u7528\u663e\u793a\u3002\u5b83\u7684\u7528\u6cd5\u548cToast\u5f88\u76f8\u4f3c\uff0c\u552f\u4e00\u4e0d\u540c\u7684\u5c31\u662f\u5b83\u7684\u7b2c\u4e00\u4e2a\u53c2\u6570\u4e0d\u662f\u4f20\u5165Context\u800c\u662f\u4f20\u5165\u5b83\u6240\u4f9d\u9644\u7684\u7236\u89c6\u56fe\uff0c\u4f46\u662f\u4ed6\u6bd4Toast\u66f4\u5f3a\u5927\u3002<br \/>\n\u6211\u4eec\u6765\u770b\u770b\u5b83\u7684\u57fa\u672c\u4f7f\u7528<\/p>\n<pre>Snackbar.make(mDrawerLayout, \"SnackbarClicked\", Snackbar.LENGTH_SHORT).show();<\/pre>\n<p>\u662f\u4e0d\u662f\u548cToast\u5f88\u76f8\u4f3c\u3002\u6211\u4eec\u6765\u770b\u770b\u5b83\u7684\u6548\u679c\u56fe\uff1a<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-0a98a4b33d51e064.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"311\" height=\"504\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-0a98a4b33d51e064.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">SnackWithoutAction<\/div>\n<\/div>\n<p>\u662f\u4e0d\u662f\u770b\u7740\u6bd4Toast\u8212\u670d\u591a\u4e86<\/p>\n<p>\u597d\u4e86\uff0c\u6211\u4eec\u518d\u6765\u770b\u770b\u4e00\u4e2a\u5305\u542bAction\u7684Snackbar\u600e\u4e48\u4f7f\u7528<\/p>\n<pre>  Snackbar.make(mDrawerLayout, \"SnackbarClicked\", Snackbar.LENGTH_SHORT).setAction(\"Action\", new View.OnClickListener() {\r\n                            @Override\r\n                            public void onClick(View v) {\r\n                                Toast.makeText(MainActivity.this, \"I'm a Toast\", Toast.LENGTH_SHORT).show();\r\n                            }\r\n                        }).setActionTextColor(Color.RED).show();<\/pre>\n<p>\u8fd9\u91cc\u6211\u7ed9Snackbar\u8bbe\u7f6e\u4e86\u4e00\u4e2aAction\uff0c\u8bbe\u7f6e\u5176\u6587\u5b57\u989c\u8272\u4e3a\u7ea2\u8272\uff0c\u5e76\u5e26\u6709\u4e86\u4e00\u4e2a\u70b9\u51fb\u4e8b\u4ef6\uff0c\u5728\u5355\u51fb\u8fd9\u4e2aAction\u540e\u5c31\u5f39\u51fa\u4e00\u4e2aToast\uff0c\u6548\u679c\u56fe\u5982\u4e0b<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-e8c6578336716039.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"674\" height=\"405\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-e8c6578336716039.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">SnackbarWithAction<\/div>\n<\/div>\n<h2>2.TextInputLayout<\/h2>\n<p>\u4f7f\u7528\u8fc7EditText\u7684\u540c\u5b66\u80af\u5b9a\u77e5\u9053\uff0c\u6709\u4e00\u4e2a\u53ebhint\u7684\u5c5e\u6027\uff0c\u5b83\u53ef\u4ee5\u63d0\u793a\u7528\u6237\u6b64\u5904\u5e94\u8be5\u8f93\u5165\u4ec0\u4e48\u5185\u5bb9\uff0c\u7136\u800c\u5f53\u7528\u6237\u8f93\u5165\u771f\u5b9e\u5185\u5bb9\u4e4b\u540e\uff0chint\u7684\u63d0\u793a\u5185\u5bb9\u5c31\u6d88\u5931\u4e86\uff0c\u7528\u6237\u7684\u4f53\u9a8c\u6548\u679c\u662f\u5341\u5206\u4e0d\u597d\u7684\uff0cTextInputLayout\u7684\u51fa\u73b0\u89e3\u51b3\u4e86\u8fd9\u4e2a\u95ee\u9898\u3002<\/p>\n<p>\u6211\u4eec\u6765\u770b\u770b\u8fd9\u4e2a\u63a7\u4ef6\u7684\u662f\u600e\u4e48\u4f7f\u7528\u7684<\/p>\n<pre>&lt;LinearLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:orientation=\"vertical\"\r\n    android:padding=\"10dp\"\r\n    tools:context=\"burgess.com.materialdesignstudy.MDTextViewActivity\"&gt;\r\n    &lt;!--TextInputLayout\u7684\u989c\u8272\u6765\u81eastyle\u4e2d\u7684colorAccent\u7684\u989c\u8272--&gt;\r\n    &lt;android.support.design.widget.TextInputLayout\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"wrap_content\"&gt;\r\n        &lt;EditText\r\n            android:id=\"@+id\/edit_username\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"wrap_content\"\r\n            android:hint=\"\u7528\u6237\u540d\/\u624b\u673a\u53f7\"\r\n            android:inputType=\"textEmailAddress\" \/&gt;\r\n    &lt;\/android.support.design.widget.TextInputLayout&gt;\r\n    &lt;android.support.design.widget.TextInputLayout\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"wrap_content\"&gt;\r\n        &lt;EditText\r\n            android:id=\"@+id\/edit_pwd\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"wrap_content\"\r\n            android:hint=\"\u5bc6\u7801\"\r\n            android:inputType=\"textPassword\" \/&gt;\r\n    &lt;\/android.support.design.widget.TextInputLayout&gt;\r\n&lt;\/LinearLayout&gt;<\/pre>\n<p>\u5176\u5b9e\u8fd9\u4e2a\u63a7\u4ef6\u7684\u4f7f\u7528\u975e\u5e38\u7b80\u5355\uff0c\u6211\u4eec\u53ea\u9700\u5728EditText\u5916\u9762\u518d\u5d4c\u5957\u4e00\u4e2aTextInputLayout\u5c31\u884c\u4e86\u3002\u6211\u4eec\u6765\u770b\u770b\u6548\u679c<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-d029007f302ecdaa.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"289\" height=\"425\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-d029007f302ecdaa.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">TextInputLayout<\/div>\n<\/div>\n<p>\u8fd8\u662f\u5f88\u4e0d\u9519\u7684\uff0c\u5f53\u7528\u6237\u5728\u8f93\u5165\u7684\u65f6\u5019hint\u7684\u5185\u5bb9\u5c31\u4f1a\u8dd1\u5230\u8f93\u5165\u5185\u5bb9\u7684\u4e0a\u8fb9\u53bb\uff0c\u5176\u4e2dTextInputLayout\u4e2d\u5b57\u4f53\u7684\u989c\u8272\u662fstyle\u6587\u4ef6\u4e2d\u7684colorAccent\uff08\u5173\u4e8ecolorAccent\u662f\u4ec0\u4e48\uff0c\u6587\u672b\u6709\u4e00\u5f20\u56fe\u770b\u4e86\u5c31\u6e05\u695a\u4e86\uff09\u7684\u989c\u8272\u3002<\/p>\n<h2>3.FloatingActionButton<\/h2>\n<p>FloatingActionButton\u4ece\u540d\u5b57\u53ef\u4ee5\u770b\u51fa\u5b83\u662f\u4e00\u4e2a\u6d6e\u52a8\u7684\u6309\u94ae\uff0c\u5b83\u662f\u4e00\u4e2a\u5e26\u6709\u9634\u5f71\u7684\u5706\u5f62\u6309\u94ae\uff0c\u53ef\u4ee5\u901a\u8fc7fabSize\u6765\u6539\u53d8\u5176\u5927\u5c0f\uff0c\u4e3b\u8981\u8d1f\u8d23\u754c\u9762\u7684\u57fa\u672c\u64cd\u4f5c\uff0c\u8fd9\u4e2a\u6309\u94ae\u603b\u4f53\u6765\u8bf4\u8fd8\u662f\u6bd4\u8f83\u7b80\u5355\u7684\u3002<br \/>\n\u6211\u4eec\u6765\u770b\u770b\u5b83\u7684\u4e00\u4e9b\u5c5e\u6027\uff1a<\/p>\n<ul>\n<li>\u9ed8\u8ba4FloatingActionButton \u7684\u80cc\u666f\u8272\u662f\u5e94\u7528\u4e3b\u9898\u7684 colorAccent\uff08\u5176\u5b9eMD\u4e2d\u7684\u63a7\u4ef6\u4e3b\u9898\u9ed8\u8ba4\u57fa\u672c\u90fd\u662f\u5e94\u7528\u7684\u8fd9\u4e2a\u4e3b\u9898\uff09\uff0c\u53ef\u4ee5\u901a\u8fc7<strong>app:backgroundTint <\/strong>\u5c5e\u6027\u6216\u8005<strong>setBackgroundTintList (ColorStateList tint)<\/strong>\u65b9\u6cd5\u53bb\u6539\u53d8\u80cc\u666f\u989c\u8272\u3002<\/li>\n<li>\u4e0a\u9762\u63d0\u5230 Floating action button \u7684\u5927\u5c0f\u5c3a\u5bf8\uff0c\u53ef\u4ee5\u7528\u8fc7<strong>app:fabSize <\/strong>\u5c5e\u6027\u8bbe\u7f6e\uff08normal or mini\uff09<\/li>\n<li><strong> android:src<\/strong> \u5c5e\u6027\u6539\u53d8 drawable<\/li>\n<li><strong>app:rippleColor<\/strong>\u8bbe\u7f6e\u70b9\u51fb button \u65f6\u5019\u7684\u989c\u8272\uff08\u6c34\u6ce2\u7eb9\u6548\u679c\uff09<\/li>\n<li><strong>app:borderWidth<\/strong>\u8bbe\u7f6e button \u7684\u8fb9\u6846\u5bbd\u5ea6<\/li>\n<li><strong>app:elevation<\/strong>\u8bbe\u7f6e\u666e\u901a\u72b6\u6001\u9634\u5f71\u7684\u6df1\u5ea6\uff08\u9ed8\u8ba4\u662f 6dp\uff09<\/li>\n<li><strong>app:pressedTranslationZ<\/strong>\u8bbe\u7f6e\u70b9\u51fb\u72b6\u6001\u7684\u9634\u5f71\u6df1\u5ea6\uff08\u9ed8\u8ba4\u662f 12dp\uff09<\/li>\n<\/ul>\n<p>\u600e\u4e48\u53bb\u4f7f\u7528\uff1a<\/p>\n<pre>&lt;android.support.design.widget.FloatingActionButton\r\n        android:id=\"@+id\/fab_search\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_gravity=\"bottom|end\"\r\n        android:layout_margin=\"16dp\"\r\n        android:src=\"@android:drawable\/ic_dialog_email\"\r\n        app:borderWidth=\"2dp\"\r\n        app:fabSize=\"normal\"\r\n        app:rippleColor=\"#ff0000\" \/&gt;<\/pre>\n<p>\u5176\u6548\u679c\u56fe\u5982\u4e0b\uff1a<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-8110e395f1693062.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"278\" height=\"426\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-8110e395f1693062.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">FloatingActionButton<\/div>\n<\/div>\n<p>##<strong>4.CoordinatorLayout<\/strong><br \/>\n\u6211\u4eec\u6765\u770b\u770b\u5b98\u65b9\u5bf9\u4ed6\u7684\u63cf\u8ff0\uff1a<br \/>\n&#8211; CoordinatorLayout is a super-poweredFrameLayout.<br \/>\n&#8211; CoordinatorLayout is intended for two primary use cases:<br \/>\n1.As a top-level application decor or chrome layout<br \/>\n2.As a container for a specific interaction with one or more child views<br \/>\n\u4ece\u8fd9\u91cc\u6211\u4eec\u53ef\u4ee5\u77e5\u9053\u5b83\u662f\u4e00\u4e2a\u589e\u5f3a\u7248\u7684FrameLayout\uff0c\u4ed6\u53ef\u4ee5\u534f\u8c03\u5176\u5b50View\u7684\u4ea4\u4e92\uff0c\u63a7\u5236\u624b\u52bf\u673a\u6eda\u52a8\u6280\u5de7\u3002\u8fd9\u4e2a\u63a7\u4ef6\u5341\u5206\u7684\u5f3a\u5927\uff0c\u7528\u5904\u4e5f\u5341\u5206\u7684\u5e7f\u6cdb\u3002\u5c31\u6bd4\u5982\u521a\u624d\u8bf4\u7684FloatingActionButton\u5982\u679c\u7528CoordinatorLayout \u4f5c\u4e3aFloatingActionButton\u7684\u7236\u5e03\u5c40\uff0c\u5b83\u5c06\u5f88\u597d\u7684\u534f\u8c03Snackbar\u7684\u663e\u793a\u4e0eFloatingActionButton\u3002<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-eefc577f31d4d2c6.gif?imageMogr2\/auto-orient\/strip\" alt=\"\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-eefc577f31d4d2c6.gif?imageMogr2\/auto-orient\/strip\" \/><\/p>\n<div class=\"image-caption\">\u6ca1\u6709\u4f7f\u7528CoordinatorLayout \u4f5c\u4e3a\u7236\u5e03\u5c40\u7684FloatingActionButton\u663e\u793aSnackbar<\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-4bb65d3ec110ce37.gif?imageMogr2\/auto-orient\/strip\" alt=\"\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-4bb65d3ec110ce37.gif?imageMogr2\/auto-orient\/strip\" \/><\/p>\n<div class=\"image-caption\">\u4f7f\u7528\u4e86CoordinatorLayout \u4f5c\u4e3a\u7236\u5e03\u5c40\u7684FloatingActionButton\u663e\u793aSnackbar<\/div>\n<\/div>\n<p>\u8fd9\u4e24\u4e2a\u52a8\u6001\u56fe\u6765\u6e90\u4e8e\u7f51\u4e0a\uff0c\u6548\u679c\u662f\u663e\u800c\u6613\u89c1\u7684\uff0c\u539f\u8c05\u6211\u7528\u7684\u624b\u673a\u6d4b\u8bd5\uff0c\u6240\u4ee5\u6ca1\u6cd5\u5f55\u5236\u52a8\u6001\u56fe\uff08\u5982\u679c\u6709\u4eba\u77e5\u9053\u600e\u4e48\u53bb\u5f55\u5236\u7684\u8bf7\u544a\u77e5\uff09\u3002<br \/>\n\u8fd8\u6709\u5b83\u7684\u53e6\u5916\u4e00\u4e2a\u6bd4\u8f83\u91cd\u8981\u7684\u7528\u5904\u662f\u63a7\u5236\u534f\u8c03\u5185\u5bb9\u533a\u548cAppBarLayout\u7684\u6eda\u52a8\uff0c\u8fd9\u4e2a\u540e\u9762\u4f1a\u8bb2\u5230\u3002\u8fd9\u4e2a\u63a7\u4ef6\u8fd8\u662f\u6bd4\u8f83\u590d\u6742\u7684\uff0c\u7528\u591a\u4e86\u5c31\u80fd\u6162\u6162\u4f53\u4f1a\u5230\u4ed6\u7684\u5f3a\u5927\u4e4b\u5904\u3002\u6211\u5bf9\u8fd9\u4e2a\u63a7\u4ef6\u7684\u8fd8\u4e0d\u662f\u90a3\u4e48\u7684\u6e05\u695a\uff0c\u6240\u4ee5\u5728\u8fd9\u91cc\u63d0\u4f9b\u4e00\u7bc7\u5173\u4e8eCoordinatorLayout \u7528\u6cd5\u7684\u8bd1\u6587: <a href=\"https:\/\/www.aswifter.com\/2015\/11\/12\/mastering-coordinator\/?hmsr=toutiao.io&amp;utm_medium=toutiao.io&amp;utm_source=toutiao.io\" target=\"_blank\">\u638c\u63e1 Coordinator Layout<\/a><br \/>\n##<strong>5.NavigationView<\/strong><br \/>\n\u62bd\u5c49\u5f0f\u7684\u5bfc\u822a\u63a7\u4ef6\uff0c\u6709\u4e86\u4ed6\u6211\u4eec\u53ef\u4ee5\u4f7f\u5f97\u5bfc\u822a\u66f4\u7b80\u5355\u3002\u6211\u4eec\u53ef\u4ee5\u76f4\u63a5\u901a\u8fc7\u83dc\u5355\u8d44\u6e90\u6587\u4ef6\u751f\u6210\u6240\u9700\u7684\u5143\u7d20\u3002\u4e0b\u56fe\u5de6\u8fb9\u7684\u5373\u662fNavigationView\u3002<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a103ae085323d307.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"378\" height=\"595\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a103ae085323d307.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\">NavigationView<\/div>\n<\/div>\n<p>\u4e0b\u9762\u6211\u4eec\u6765\u770b\u770b\u5b83\u662f\u600e\u4e48\u5b9e\u73b0\u7684\u5427\u3002<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;android.support.v4.widget.DrawerLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n    android:id=\"@+id\/drawer_layout\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:fitsSystemWindows=\"true\"&gt;\r\n    &lt;!--\u5185\u5bb9\u533a--&gt;\r\n    &lt;android.support.design.widget.CoordinatorLayout\r\n        android:id=\"@+id\/main_content\"\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"match_parent\"&gt;\r\n        &lt;include\r\n            android:id=\"@+id\/appbar\"\r\n            layout=\"@layout\/toolbar\" \/&gt;\r\n        &lt;FrameLayout\r\n            android:id=\"@+id\/frame_content\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"match_parent\"\r\n            android:layout_below=\"@+id\/appbar\"\r\n            android:scrollbars=\"none\"\r\n            app:layout_behavior=\"@string\/appbar_scrolling_view_behavior\" \/&gt;\r\n    &lt;\/android.support.design.widget.CoordinatorLayout&gt;\r\n    &lt;!--\u5de6\u4fa7\u5bfc\u822a\u83dc\u5355--&gt;\r\n    &lt;android.support.design.widget.NavigationView\r\n        android:id=\"@+id\/navigation_view\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"match_parent\"\r\n        android:layout_gravity=\"start\"\r\n        app:headerLayout=\"@layout\/navigation_header\"\r\n        app:menu=\"@menu\/drawer\" \/&gt;\r\n&lt;\/android.support.v4.widget.DrawerLayout&gt;<\/pre>\n<p>\u53ef\u4ee5\u770b\u5230\u8fd9\u91cc\u6211\u4eec\u662f\u4ee5DrawerLayout\u4f5c\u4e3a\u5176\u7236\u5e03\u5c40\uff0c\u5bf9\u4e8eDrawLayout\u4ed6\u53ef\u4ee5\u5b9e\u73b0\u4e00\u79cd\u62bd\u5c49\u5f0f\u7684\u4fa7\u6ed1\u6548\u679c\uff0c\u8fd9\u91cc\u4e0d\u591a\u505a\u8bb2\u89e3,\u8fd9\u91cc\u53ea\u7b80\u5355\u8bf4\u4e00\u70b9:DrawLayout\u4e2d\u7684\u7b2c\u4e00\u4e2a\u5e03\u5c40\u662f\u5185\u5bb9\u5e03\u5c40\uff0c\u7b2c\u4e8c\u4e2a\u662f\u83dc\u5355\u5e03\u5c40\u3002\u73b0\u5728\u6211\u4eec\u76f4\u63a5\u5b9a\u4f4d\u5230NavigationView\uff0c\u6211\u4eec\u770b\u5230\u8fd9\u91cc\u6709<strong> app:headerLayout=&#8221;@layout\/navigation_header&#8221;<\/strong>\u3001<strong>app:menu=&#8221;@menu\/drawer&#8221;<\/strong>\u8fd9\u4e24\u884c\u4ee3\u7801\uff0c\u5176\u4e2dheaderLayout\u662f\u8bbe\u7f6e\u5176\u5934\u90e8\u7684\u5e03\u5c40\uff0c\u8fd9\u4e2a\u5e03\u5c40\u6211\u4eec\u53ef\u4ee5\u968f\u4fbf\u5199\uff0c\u5c31\u548c\u5199\u666e\u901a\u7684\u5e03\u5c40\u6587\u4ef6\u4e00\u6837\u7684\u3002\u5bf9\u4e8emenu\u5c31\u662f\u83dc\u5355\u9879\u7684\u914d\u7f6e\u4e86\uff0c\u5176\u914d\u7f6e\u6587\u4ef6\u5982\u4e0b\uff1a<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;menu xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    tools:context=\".MainActivity\"&gt;\r\n    &lt;group android:checkableBehavior=\"single\"&gt;\r\n        &lt;item\r\n            android:id=\"@+id\/navigation_item_home\"\r\n            android:icon=\"@drawable\/iconfont_home\"\r\n            android:title=\"\u9996\u9875\" \/&gt;\r\n        &lt;item\r\n            android:id=\"@+id\/navigation_item_blog\"\r\n            android:icon=\"@drawable\/iconfont_blog\"\r\n            android:title=\"\u6211\u7684\u535a\u5ba2\" \/&gt;\r\n        &lt;item\r\n            android:id=\"@+id\/navigation_item_about\"\r\n            android:icon=\"@drawable\/iconfont_about\"\r\n            android:title=\"\u5173\u4e8e\" \/&gt;\r\n    &lt;\/group&gt;\r\n&lt;\/menu&gt;<\/pre>\n<p>\u5c31\u8fd9\u4e48\u7b80\u5355\uff0c\u6211\u4eec\u8981\u5b9e\u73b0\u4e0a\u8ff0\u7684\u6548\u679c\u5c31\u53ea\u8981\u8fd9\u4e9b\u5c31\u8db3\u591f\u4e86\u3002\u4f46\u662f\u5982\u679c\u6211\u4eec\u60f3\u8981\u5bf9Item\u6dfb\u52a0\u4e00\u4e2a\u70b9\u51fb\u7684\u4e8b\u4ef6\u600e\u4e48\u505a\u5462\uff1f\u8bf7\u770b\u4e0b\u9762\uff1a<\/p>\n<pre> private void setNavigationViewItemClickListener() {\r\n        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {\r\n            @Override\r\n            public boolean onNavigationItemSelected(MenuItem item) {\r\n                switch (item.getItemId()) {\r\n                    case R.id.navigation_item_home:\r\n                        mToolbar.setTitle(\"\u9996\u9875\");\r\n                        switchFragment(\"MainFragment\");\r\n                        break;\r\n                    case R.id.navigation_item_blog:\r\n                        mToolbar.setTitle(\"\u6211\u7684\u535a\u5ba2\");\r\n                        switchFragment(\"BlogFragment\");\r\n                        break;\r\n                    case R.id.navigation_item_about:\r\n                        mToolbar.setTitle(\"\u5173\u4e8e\");\r\n                        switchFragment(\"AboutFragment\");\r\n                        break;\r\n                    default:\r\n                        break;\r\n                }\r\n                item.setChecked(true);\r\n                mDrawerLayout.closeDrawer(Gravity.LEFT);\r\n                return false;\r\n            }\r\n        });\r\n    }<\/pre>\n<p>\u4e0a\u9762\u7684\u4ee3\u7801\u5f88\u6e05\u695a\u4e86\uff0c\u5c31\u662f\u4e3aNavigationView\u6dfb\u52a0\u4e86\u4e00\u4e2aOnNavigationItemSelectedListener\u7684\u76d1\u542c\u4e8b\u4ef6\uff0c\u7136\u540e\u6211\u4eec\u5c31\u53ef\u4ee5\u505a\u6211\u4eec\u60f3\u505a\u7684\u4e8b\u4e86\u3002<br \/>\n##<strong>6. AppBarLayout\u3001CollapsingToolbarLayout\u3001TabLayout<\/strong><br \/>\n\u8fd9\u4e09\u4e2a\u63a7\u4ef6\u6211\u7528\u4e00\u4e2a\u4f8b\u5b50\u4e00\u4e0b\u8bb2\u89e3\u4e86\uff0c\u5728\u5b9e\u9645\u7684\u4f7f\u7528\u4e2d\u8fd9\u4e09\u4e2a\u63a7\u4ef6\u8fd8\u662f\u7ecf\u5e38\u4f1a\u7ec4\u5408\u5728\u4e00\u8d77\u7684\u3002<br \/>\n&#8211; <strong>AppBarLayout<\/strong>\uff1a\u5176\u7ee7\u627f\u4e8eLinearLayout\uff0c\u4f7f\u7528AppBarLayout\u53ef\u4ee5\u8ba9\u5305\u542b\u5728\u5176\u4e2d\u7684\u5b50\u63a7\u4ef6\u80fd\u54cd\u5e94\u88ab\u6807\u8bb0\u4e86ScrollingViewBehavior\u7684\u7684\u6eda\u52a8\u4e8b\u4ef6\uff08\u8981\u4e0eCoordinatorLayout \u4e00\u8d77\u4f7f\u7528\uff09\uff0c\u5229\u7528\u5b83\u6211\u4eec\u53ef\u4ee5\u5f88\u5bb9\u6613\u7684\u53bb\u5b9e\u73b0\u89c6\u5dee\u6eda\u52a8\u6548\u679c\uff0c\u8fd9\u6837\u6240\u4f60\u53ef\u80fd\u8fd8\u662f\u4e0d\u592a\u61c2\uff0c\u5343\u8a00\u4e07\u8bed\u4e0d\u5982\u4e00\u5f20\u56fe\u6765\u7684\u76f4\u63a5\u723d\u5feb\uff08\u8fd9\u6837\u56fe\u8fd8\u662f\u6765\u6e90\u4e8e\u7f51\u4e0a\uff0c\u5176\u84dd\u8272\u7684\u90e8\u5206\u5c31\u662fAppBarLayout\uff0c\u5185\u5bb9\u533a\u5c31\u662f\u88ab\u6807\u8bb0\u4e86ScrollingViewBehavior\u7684\uff0c\u53ef\u4ee5\u770b\u5230\u6548\u679c\u662f\u4e0d\u662f\u633a\u4e0d\u9519\u7684\uff09\u3002<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-703d4b65d11af297.gif?imageMogr2\/auto-orient\/strip\" alt=\"\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-703d4b65d11af297.gif?imageMogr2\/auto-orient\/strip\" \/><\/p>\n<div class=\"image-caption\"><\/div>\n<\/div>\n<p>&#8211; <strong>CollapsingToolbarLayout<\/strong> \uff1a\u8ba9Toolbar\u53ef\u4f38\u7f29\uff0c\u5728\u4f38\u7f29\u7684\u65f6\u5019\u51b3\u5b9aToolBar\u662f\u79fb\u9664\u5c4f\u5e55\u548c\u56fa\u5b9a\u5728\u6700\u4e0a\u9762\u3002\u7531\u4e8eToolbar \u53ea\u80fd\u56fa\u5b9a\u5230\u5c4f\u5e55\u9876\u7aef\u5e76\u4e14\u4e0d\u80fd\u505a\u51fa\u597d\u7684\u52a8\u753b\u6548\u679c\uff0c\u6240\u4ee5\u624d\u6709\u4e86\u8fd9\u4e2aLayout\u7684\u51fa\u73b0\u3002<br \/>\n&#8211; <strong>TabLayout<\/strong>\uff1a\u8fd9\u4e2a\u5176\u5b9e\u548c\u6211\u4eec\u4e4b\u524d\u4f7f\u7528\u7684\u7b2c\u4e09\u65b9\u5e93ViewPagerIndicator\u662f\u5f88\u7c7b\u4f3c\u7684\uff0c\u4e00\u822c\u90fd\u548cViewPager\u4e00\u8d77\u4f7f\u7528\uff0c\u6548\u679c\u5982\u4e0b\u56fe\uff1a<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-1ffee0282ce10e14.gif?imageMogr2\/auto-orient\/strip\" alt=\"\" width=\"349\" height=\"579\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-1ffee0282ce10e14.gif?imageMogr2\/auto-orient\/strip\" \/><\/p>\n<div class=\"image-caption\">\u52a8\u6001\u56fe\u6765\u6e90\u4e8e\u7f51\u4e0a<\/div>\n<\/div>\n<p>\u57fa\u672c\u77e5\u9053\u4ed6\u4eec\u662f\u5e72\u4ec0\u4e48\u7528\u7684\u4e86\uff0c\u4e0b\u9762\u5c31\u8ba9\u6211\u4eec\u52a8\u624b\uff0c\u770b\u770b\u5230\u5e95\u600e\u4e48\u7528\u5427\u3002<br \/>\n\u5148\u6765\u51e0\u5f20\u4e0b\u9762\u6211\u4eec\u8981\u5b9e\u73b0\u7684\u6548\u679c\u3002\u7531\u4e8e\u6211\u662f\u771f\u673a\u6d4b\u8bd5\uff0c\u6ca1\u6cd5\u5f55\u5236\u52a8\u6001\u56fe\uff0c\u8fd9\u91cc\u5c31\u7528\u51e0\u5f20\u9759\u6001\u56fe\u4ee3\u66ff\u4e86\u3002<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" loading=\"lazy\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a7165c9de0802f03.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" width=\"720\" height=\"302\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-a7165c9de0802f03.png?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/p>\n<div class=\"image-caption\"><\/div>\n<\/div>\n<p>\u5e03\u5c40\u6587\u4ef6\uff08\u8fd9\u4e2a\u662f\u5f88\u91cd\u8981\u7684\uff0c\u5f88\u591a\u7684\u6548\u679c\u90fd\u662f\u76f4\u63a5\u5728\u5e03\u5c40\u6587\u4ef6\u4e2d\u914d\u7f6e\u7684\uff09:<\/p>\n<pre>&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;\r\n&lt;android.support.design.widget.CoordinatorLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"&gt;\r\n    &lt;android.support.design.widget.AppBarLayout\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"200dp\"\r\n        android:theme=\"@style\/ThemeOverlay.AppCompat.Dark.ActionBar\"&gt;\r\n        &lt;android.support.design.widget.CollapsingToolbarLayout\r\n            android:id=\"@+id\/collapsing_toolbar_layout\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"match_parent\"\r\n            android:fitsSystemWindows=\"true\"\r\n            app:contentScrim=\"?attr\/colorPrimary\"\r\n            app:expandedTitleMarginEnd=\"64dp\"\r\n            app:expandedTitleMarginStart=\"48dp\"\r\n            app:layout_scrollFlags=\"scroll|exitUntilCollapsed\"&gt;\r\n            &lt;ImageView\r\n                android:id=\"@+id\/iv_book_image\"\r\n                android:layout_width=\"match_parent\"\r\n                android:layout_height=\"match_parent\"\r\n                android:fitsSystemWindows=\"true\"\r\n                android:scaleType=\"centerInside\"\r\n                android:transitionName=\"transition_book_img\"\r\n                app:layout_collapseMode=\"parallax\"\r\n                app:layout_collapseParallaxMultiplier=\"0.7\" \/&gt;\r\n            &lt;android.support.v7.widget.Toolbar\r\n                android:id=\"@+id\/toolbar\"\r\n                android:layout_width=\"match_parent\"\r\n                android:layout_height=\"?attr\/actionBarSize\"\r\n                app:layout_collapseMode=\"pin\"\r\n                app:popupTheme=\"@style\/ThemeOverlay.AppCompat.Light\" \/&gt;\r\n        &lt;\/android.support.design.widget.CollapsingToolbarLayout&gt;\r\n    &lt;\/android.support.design.widget.AppBarLayout&gt;\r\n    &lt;LinearLayout\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"match_parent\"\r\n        android:orientation=\"vertical\"\r\n        app:layout_behavior=\"@string\/appbar_scrolling_view_behavior\"&gt;\r\n        &lt;LinearLayout\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"wrap_content\"\r\n            android:orientation=\"vertical\"\r\n            android:padding=\"10dp\"&gt;\r\n            &lt;LinearLayout\r\n                android:layout_width=\"match_parent\"\r\n                android:layout_height=\"wrap_content\"\r\n                android:orientation=\"horizontal\"&gt;\r\n                &lt;TextView\r\n                    android:id=\"@+id\/tv_title\"\r\n                    android:layout_width=\"wrap_content\"\r\n                    android:layout_height=\"wrap_content\"\r\n                    android:textColor=\"#292929\"\r\n                    android:textSize=\"18sp\" \/&gt;\r\n                &lt;TextView\r\n                    android:id=\"@+id\/tv_rating\"\r\n                    android:layout_width=\"wrap_content\"\r\n                    android:layout_height=\"wrap_content\"\r\n                    android:layout_marginLeft=\"5dp\"\r\n                    android:layout_marginTop=\"2dp\"\r\n                    android:textColor=\"#FF6347\"\r\n                    android:textSize=\"14sp\" \/&gt;\r\n            &lt;\/LinearLayout&gt;\r\n            &lt;TextView\r\n                android:id=\"@+id\/tv_msg\"\r\n                android:layout_width=\"wrap_content\"\r\n                android:layout_height=\"wrap_content\"\r\n                android:layout_marginTop=\"2dp\"\r\n                android:textColor=\"#575757\"\r\n                android:textSize=\"12sp\" \/&gt;\r\n        &lt;\/LinearLayout&gt;\r\n        &lt;android.support.design.widget.TabLayout\r\n            android:id=\"@+id\/sliding_tabs\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"wrap_content\"\r\n            app:tabGravity=\"fill\"\r\n            app:tabMode=\"scrollable\" \/&gt;\r\n        &lt;android.support.v4.view.ViewPager\r\n            android:id=\"@+id\/viewpager\"\r\n            android:layout_width=\"match_parent\"\r\n            android:layout_height=\"match_parent\" \/&gt;\r\n    &lt;\/LinearLayout&gt;\r\n&lt;\/android.support.design.widget.CoordinatorLayout&gt;<\/pre>\n<p>\u6211\u4eec\u6765\u5206\u6790\u4e00\u4e0b\u8fd9\u4e2a\u5e03\u5c40\u6587\u4ef6\uff1a<br \/>\n1.\u6700\u5916\u5c42\u7684\u5e03\u5c40\u7528\u7684\u662fCoordinatorLayout\uff0c\u56e0\u4e3a\u8fd9\u91cc\u9762\u6709\u5f88\u591a\u7684\u52a8\u753b\uff0cCoordinatorLayout\u53ef\u4ee5\u5f88\u597d\u7684\u53bb\u534f\u8c03\u91cc\u9762\u7684\u52a8\u753b\u3002\u5728android.support.design.widget.AppBarLayout\u4e0b\u9762\u7684\u90a3\u4e2aLinearLayout\u88ab\u6807\u8bb0\u4e86appbar_scrolling_view_behavior\uff0c\u8fd9\u6837\u4e00\u6765AppBarLayout\u5c31\u80fd\u54cd\u5e94LinearLayout\u4e2d\u7684\u6eda\u52a8\u4e8b\u4ef6\u3002<br \/>\n2.\u518d\u6765\u770b\u770bCollapsingToolbarLayout\uff0c\u5176\u4e2dcontentScrim\u662f\u8bbe\u7f6e\u5176\u5185\u5bb9\u533a\u7684\u989c\u8272\uff0clayout_scrollFlags\u53d6\u4e86scroll\u548cexitUntilCollapsed\u4e24\u4e2a\u503c\u3002<br \/>\nlayout_scrollFlags\u7684Flag\u5305\u62ec\uff1a<\/p>\n<ul>\n<li><strong>scroll<\/strong>: \u6240\u6709\u60f3\u6eda\u52a8\u51fa\u5c4f\u5e55\u7684view\u90fd\u9700\u8981\u8bbe\u7f6e\u8fd9\u4e2aflag\uff0c\u6ca1\u6709\u8bbe\u7f6e\u8fd9\u4e2aflag\u7684view\u5c06\u88ab\u56fa\u5b9a\u5728\u5c4f\u5e55\u9876\u90e8\u3002<\/li>\n<li><strong>enterAlways<\/strong>: \u8fd9\u4e2aflag\u8ba9\u4efb\u610f\u5411\u4e0b\u7684\u6eda\u52a8\u90fd\u4f1a\u5bfc\u81f4\u8be5view\u53d8\u4e3a\u53ef\u89c1\uff0c\u5f53\u5411\u4e0a\u6ed1\u7684\u65f6\u5019Toolbar\u5c31\u9690\u85cf\uff0c\u4e0b\u6ed1\u7684\u65f6\u5019\u663e\u793a\u3002<\/li>\n<li><strong>enterAlwaysCollapsed<\/strong>: \u987e\u540d\u601d\u4e49\uff0c\u8fd9\u4e2aflag\u5b9a\u4e49\u7684\u662f\u4f55\u65f6\u8fdb\u5165\uff08\u5df2\u7ecf\u6d88\u5931\u4e4b\u540e\u4f55\u65f6\u518d\u6b21\u663e\u793a\uff09\u3002\u5047\u8bbe\u4f60\u5b9a\u4e49\u4e86\u4e00\u4e2a\u6700\u5c0f\u9ad8\u5ea6\uff08minHeight\uff09\u540c\u65f6enterAlways\u4e5f\u5b9a\u4e49\u4e86\uff0c\u90a3\u4e48view\u5c06\u5728\u5230\u8fbe\u8fd9\u4e2a\u6700\u5c0f\u9ad8\u5ea6\u7684\u65f6\u5019\u5f00\u59cb\u663e\u793a\uff0c\u5e76\u4e14\u4ece\u8fd9\u4e2a\u65f6\u5019\u5f00\u59cb\u6162\u6162\u5c55\u5f00\uff0c\u5f53\u6eda\u52a8\u5230\u9876\u90e8\u7684\u65f6\u5019\u5c55\u5f00\u5b8c\u3002<\/li>\n<li><strong>exitUntilCollapsed<\/strong>: \u540c\u6837\u987e\u540d\u601d\u4e49\uff0c\u8fd9\u4e2aflag\u65f6\u5b9a\u4e49\u4f55\u65f6\u9000\u51fa\uff0c\u5f53\u4f60\u5b9a\u4e49\u4e86\u4e00\u4e2aminHeight\uff0c\u8fd9\u4e2aview\u5c06\u5728\u6eda\u52a8\u5230\u8fbe\u8fd9\u4e2a\u6700\u5c0f\u9ad8\u5ea6\u7684\u65f6\u5019\u6d88\u5931\u3002<\/li>\n<\/ul>\n<p>\u53ea\u770b\u6982\u89c8\u53ef\u80fd\u8fd8\u662f\u4e0d\u4f1a\u592a\u6e05\u695a\uff0c\u6ce8\u610f\u4e00\u5b9a\u8981\u591a\u5b9e\u8df5\uff0c\u611f\u5174\u8da3\u7684\u8bfb\u8005\u53ef\u4ee5\u4e00\u4e2a\u4e00\u4e2a\u53bb\u8bd5\u4e00\u8bd5\u6548\u679c\u3002<\/p>\n<p>3.\u5b9a\u4f4d\u5230ImageView\uff0c\u6709\u8fd9\u4e24\u4e2a\u5c5e\u6027\u662f\u6211\u4eec\u5e73\u5e38\u7528\u6ca1\u770b\u5230\u7684\uff0c\u8bf4\u660e\u6211\u5199\u5728\u6ce8\u91ca\u4e0a\u4e86<\/p>\n<pre>app:layout_collapseMode=\"parallax\"\/\/\u8fd9\u4e2a\u662f\u914d\u7f6e\u5f53ImageView\u6d88\u5931\u6216\u8005\u663e\u793a\u65f6\u5019\u6709\u4e00\u79cd\u89c6\u5dee\u6eda\u52a8\u6548\u679c\r\napp:layout_collapseParallaxMultiplier=\"0.7\"\/\/\u89c6\u5dee\u56e0\u5b50\uff0c\u8d8a\u5927\u89c6\u5dee\u7279\u6548\u8d8a\u660e\u663e\uff0c\u6700\u5927\u4e3a1<\/pre>\n<p>4.Toolbar\u4e2d\u6709\u4e00\u4e2aapp:layout_collapseMode=&#8221;pin&#8221; \u8fd9\u4e2a\u786e\u4fddToolbar\u5728AppBarLayout\u6298\u53e0\u7684\u65f6\u5019\u4ecd\u7136\u88ab\u56fa\u5b9a\u5728\u5c4f\u5e55\u7684\u9876\u90e8<br \/>\n\u5e03\u5c40\u6587\u4ef6\u5c31\u5230\u8fd9\uff0c\u6211\u4eec\u6765\u770b\u770bActivity\u4e2d\u7684\u903b\u8f91<\/p>\n<pre>\/<em>*\r\n <\/em> Created by _SOLID\r\n <em> Date:2016\/3\/30\r\n <\/em> Time:20:16\r\n *\/\r\npublic class BookDetailActivity extends BaseActivity {\r\n    private String mUrl;\r\n    private Toolbar mToolbar;\r\n    private CollapsingToolbarLayout mCollapsingToolbarLayout;\r\n    private ImageView mIvBook;\r\n    private BookBean mBookBean;\r\n    private TextView mTvTitle;\r\n    private TextView mTvMsg;\r\n    private TextView mTvRating;\r\n    private ViewPager mViewPager;\r\n    private TabLayout mTabLayout;\r\n    @Override\r\n    protected void initView() {\r\n        \/\/\u8bbe\u7f6eToolbar\r\n        mToolbar = (Toolbar) findViewById(R.id.toolbar);\r\n        setSupportActionBar(mToolbar);\r\n        getSupportActionBar().setHomeButtonEnabled(true);\/\/\u51b3\u5b9a\u5de6\u4e0a\u89d2\u7684\u56fe\u6807\u662f\u5426\u53ef\u4ee5\u70b9\u51fb\r\n        getSupportActionBar().setDisplayHomeAsUpEnabled(true);\/\/\u51b3\u5b9a\u5de6\u4e0a\u89d2\u56fe\u6807\u7684\u53f3\u4fa7\u662f\u5426\u6709\u5411\u5de6\u7684\u5c0f\u7bad\u5934\r\n        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {\r\n            @Override\r\n            public void onClick(View view) {\r\n                onBackPressed();\r\n            }\r\n        });\r\n        mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);\r\n        mIvBook = (ImageView) findViewById(R.id.iv_book_image);\r\n        mTvTitle = (TextView) findViewById(R.id.tv_title);\r\n        mTvMsg = (TextView) findViewById(R.id.tv_msg);\r\n        mTvRating = (TextView) findViewById(R.id.tv_rating);\r\n        mViewPager = (ViewPager) findViewById(R.id.viewpager);\r\n        mTabLayout = (TabLayout) findViewById(R.id.sliding_tabs);\r\n        mTabLayout.addTab(mTabLayout.newTab().setText(\"\u4f5c\u8005\u4fe1\u606f\"));\r\n        mTabLayout.addTab(mTabLayout.newTab().setText(\"\u7ae0\u8282\"));\r\n        mTabLayout.addTab(mTabLayout.newTab().setText(\"\u4e66\u7c4d\u7b80\u4ecb\"));\r\n    }\r\n    @Override\r\n    protected int setLayoutResourseID() {\r\n        return R.layout.activity_book_detail;\r\n    }\r\n    @Override\r\n    protected void init() {\r\n        mUrl = getIntent().getStringExtra(\"url\");\r\n    }\r\n    @Override\r\n    protected void initData() {\r\n        SolidHttpUtils.getInstance().loadString(mUrl, new SolidHttpUtils.HttpCallBack() {\r\n            @Override\r\n            public void onLoading() {\r\n            }\r\n            @Override\r\n            public void onSuccess(String result) {\r\n                Gson gson = new Gson();\r\n                mBookBean = gson.fromJson(result, BookBean.class);\r\n                mCollapsingToolbarLayout.setTitle(mBookBean.getTitle());\r\n                mTvTitle.setText(mBookBean.getTitle());\r\n                mTvMsg.setText(mBookBean.getAuthor() + \"\/\" + mBookBean.getPublisher() + \"\/\" + mBookBean.getPubdate());\r\n                mTvRating.setText(mBookBean.getRating().getAverage() + \"\u5206\");\r\n                SolidHttpUtils.getInstance().loadImage(mBookBean.getImages().getLarge(), mIvBook);\r\n                BookInfoPageAdapter adapter = new BookInfoPageAdapter(BookDetailActivity.this, mBookBean, getSupportFragmentManager());\r\n                mViewPager.setAdapter(adapter);\r\n                mTabLayout.setupWithViewPager(mViewPager);\r\n            }\r\n            @Override\r\n            public void onError(Exception e) {\r\n            }\r\n        });\r\n    }\r\n}<\/pre>\n<p>\u5176\u5b9e\u5e76\u4e0d\u96be\uff0c\u8fd9\u91cc\u53ea\u9700\u6ce8\u610f\u4e00\u70b9\uff0c\u5f53Toolbar\u88abCollapsingToolbarLayout\u5305\u88f9\u7684\u65f6\u5019\uff0c\u8bbe\u7f6e\u6807\u9898\u662f\u8bbe\u7f6eCollapsingToolbarLayout\u7684\uff0c\u800c\u4e0d\u662fToolbar\u3002<\/p>\n<p>\u597d\u4e86\u7ec8\u4e8e\u5199\u5b8c\u4e86\uff0c\u5dee\u4e0d\u591a\u5199\u4e86\u63a5\u8fd14\u4e2a\u5c0f\u65f6\uff0c\u597d\u7d2f\u7684\u8bf4\uff0c\u73b0\u5728\u6574\u4e2a\u4eba\u90fd\u662f\u6655\u6655\u7684\u3002<\/p>\n<p>\u6e90\u7801\u732e\u4e0a:<a href=\"https:\/\/github.com\/burgessjp\/MaterialDesignDemo\" target=\"_blank\">MaterialDesignDemo<\/a><\/p>\n<p>\u53c2\u8003\u94fe\u63a5:<br \/>\n<a href=\"http:\/\/www.jcodecraeer.com\/a\/anzhuokaifa\/developer\/2015\/0531\/2958.html\" target=\"_blank\">Android\u7684\u6750\u6599\u8bbe\u8ba1\u517c\u5bb9\u5e93\uff08Design Support Library\uff09<\/a><br \/>\n<a href=\"https:\/\/www.aswifter.com\/2015\/07\/02\/Material-Design-Example-5\/\" target=\"_blank\">Material Design\u63a7\u4ef6\u4f7f\u7528<\/a><br \/>\n<a href=\"http:\/\/hackeris.me\/2015\/07\/12\/floating_action_button\/\" target=\"_blank\">Floating Action Button\uff08\u7ffb\u8bd1\uff09<\/a><br \/>\n<a href=\"http:\/\/wiki.jikexueyuan.com\/project\/material-design\/\" target=\"_blank\">Material Design \u4e2d\u6587\u7248<\/a><br \/>\n<a href=\"http:\/\/blog.csdn.net\/growth58\/article\/details\/47972467?hmsr=toutiao.io&amp;utm_medium=toutiao.io&amp;utm_source=toutiao.io\" target=\"_blank\"> Android Design Support Library\u6982\u89c8 <\/a><\/p>\n<h3>\u9644(\u4e00\u4e9b\u63a7\u4ef6\u4f7f\u7528\u4f7f\u7528\u5e94\u6ce8\u610f\u7684\u5730\u65b9):<\/h3>\n<p>1.\u5728\u4f7f\u7528CardView\u7684\u65f6\u5019\uff0c\u4e00\u5b9a\u8981\u6ce8\u610f\uff0c\u5f53CardView\u7684\u5bbd\u548c\u9ad8\u586b\u5145\u7236\u5bb9\u5668\u7684\u65f6\u5019\uff0cCardView\u7684margin\u6700\u597d\u8981\u6bd4cardElevation\u5927\uff0c\u4e0d\u7136\u5c31\u770b\u4e0d\u5230\u7acb\u4f53\u7684\u6548\u679c\u3002<\/p>\n<p>2.\u6211\u4eec\u77e5\u9053ListView\u6709\u4e00\u4e2aonItemClick\u7684\u4e8b\u4ef6\uff0c\u4f46\u662fRecyclerView\u5374\u6ca1\u6709\uff0c\u90a3\u4e48\u6211\u4eec\u5e94\u8be5\u600e\u6837\u53bb\u8bbe\u7f6e\u5462\uff1f\u5176\u5b9e\u5f88\u7b80\u5355\uff0c\u5173\u4e8eRecyclerView\u8bbe\u7f6eitem\u7684\u70b9\u51fb\u4e8b\u4ef6\uff0c\u53ea\u9700\u5728\u521b\u5efaViewHolder\u7684\u65f6\u5019\uff0c\u7ed9\u586b\u5145\u7684View\u8bbe\u7f6e\u5355\u51fb\u4e8b\u4ef6\u5373\u53ef\u3002<\/p>\n<p>3.\u5728\u4f7f\u7528android.support.design.widget.AppBarLayout\u7684\u65f6\u5019\u5185\u5bb9\u533a\u6700\u597d\u4f7f\u7528android.support.v4.widget.NestedScrollView\uff0c\u4e4b\u524d\u6211\u7684\u5185\u5bb9\u533a\u7528\u7684\u662fScrollView\uff0c\u5728\u5f80\u4e0a\u62c9\u7684\u65f6\u5019AppBarLayout\u4e00\u76f4\u6ca1\u6709\u52a8\u753b\u6548\u679c\uff0c\u6298\u817e\u4e86\u51e0\u4e2a\u5c0f\u65f6\u90fd\u6ca1\u627e\u5230\u539f\u56e0\u3002\u6700\u540e\u903c\u4e0d\u5f97\u7528Android Studio\u521b\u5efa\u4e86\u4e00\u4e2a\u4ed6\u81ea\u5e26\u7684\u5173\u4e8eAppBarLayout\u7684\u6a21\u677f\u9879\u76ee\uff0c\u770b\u5230\u4ed6\u7528\u7684\u662fNestedScrollView\u4f5c\u4e3a\u5185\u5bb9\u533a\uff0c\u6211\u679c\u65ad\u5c31\u628a\u6211\u7684\u5185\u5bb9\u533a\u6362\u6210\u4e86\u8fd9\u4e2a\uff0c\u7acb\u9a6c\u5c31\u6709\u52a8\u753b\u6548\u679c\u4e86\u3002<\/p>\n<p>NestedScrollView\u5b98\u65b9\u7684\u63cf\u8ff0\uff1a<\/p>\n<blockquote><p>NestedScrollView is just likeScrollView, but it supports acting as both a nested scrolling parent and child on both new and old versions of Android. Nested scrolling is enabled by default.<\/p><\/blockquote>\n<p><strong>\u5982\u679c\u611f\u89c9\u8fd8\u4e0d\u9519\u7684\u5c31\u7ed9\u4e2a\u559c\u6b22\u652f\u6301\u4e00\u4e0b\u5427\uff0c\u6709\u95ee\u9898\u8bf7\u7559\u8a00\uff0c\u8c22\u8c22<\/strong><\/p>\n<p>\u6700\u540e\u9644\u4e00\u5f20MD\u7684\u4e3b\u9898\u8272\u89e3\u6790\u56fe:<\/p>\n<div class=\"image-package imagebubble\"><img decoding=\"async\" class=\"imagebubble-image\" src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-d58e788d279d533d.jpg?imageMogr2\/auto-orient\/strip%7CimageView2\/2\/w\/1240\" alt=\"\" data-original-src=\"http:\/\/upload-images.jianshu.io\/upload_images\/623504-d58e788d279d533d.jpg?imageMogr2\/auto-orient\/strip%7CimageView2\/2\" \/><\/div>\n<p>&nbsp;<\/p>\n<div>\u539f\u6587\u94fe\u63a5\uff1ahttp:\/\/www.jianshu.com\/p\/1e6eed09d48b<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u4f17\u6240\u5468\u77e5Material Design\uff08\u6750\u8d28\u8bbe\u8ba1\uff09\u662fGoogle\u57282014\u5e74I\/O\u5927\u4f1a\u4e0a\u53d1\u5e03\u7684\u4e00\u79cd\u65b0\u7684\u8bbe\u8ba1\u89c4\u8303 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[3],"tags":[82],"_links":{"self":[{"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/posts\/1592"}],"collection":[{"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1592"}],"version-history":[{"count":4,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/posts\/1592\/revisions"}],"predecessor-version":[{"id":2843,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=\/wp\/v2\/posts\/1592\/revisions\/2843"}],"wp:attachment":[{"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1592"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1592"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ai.zhousir.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}