全新设计语言material design详解.pptx

北风网在线培训

实战Android5.0

讲师：厉风行（北风网)

第三章：全新的设计语言——MaterialDesign详解

目录1.Material主题2.Material布局3.Material阴影和轮廓4.新的UI控件

第一节：Material主题

内容1.1使用Material主题应用Material主题很简单，只需要修改res/values/styles.xml文件，使其继承android:Theme.Material。或者在AndroidManifest.xml中直接设置主题。

内容1.2自定义Material主题material主题可以定义为如下形式：@android:style/Theme.Material?@android:style/Theme.Material.Light@android:style/Theme.Material.Light.DarkActionBar

内容1.3自定义颜色基调material可以根据自定的品牌风格，自定义主题的基础色调????item?name=android:colorPrimary@color/primary/item???????item?name=android:colorPrimaryDark@color/primary_dark/item????item?name=android:colorAccent@color/accent/item??

内容1.4自定义状态条和导航条material还允许你轻松的自定义状态条和导航条的颜色。android:statusBarColorWindow.setStatusBarColor

第二节：Material布局

内容2.1PaperCraft 在material的设计中，每一个应用程序所绘制的像素都像驻留在一张纸上。 纸具有平坦的背景颜色，并且可以调整大小，以满足各种用途。一个典型的布局是由多张纸组成。

内容2.2FloatingActions 浮动操作，它主要作用是一个承上启下的浮动按钮，承接了两个布局或者不同功能的转换。

内容2.3Z轴 相对于之前X，Y轴又新增了Z轴的概念，有了Z轴可以做出更加具有立体感的控件。 如下图是一个根据按钮状态来调整Z轴的高度。

内容2.3Z轴 通过对布局中每个视图设置不同的Z轴可以使布局更具立体感，并且可以突出重点。

第三节：Material阴影和轮廓

内容3.1视图高度elevation View的大小位置都是通过x，y确定的，而现在有了z轴的概念，而这个z值就是View的高度（elevation），而高度决定了阴影（shadow）的大小。

内容3.2阴影和轮廓 在Android5.0中设置一个阴影很简单，只需要两点： 1.设置eleavation值 2.添加一个背景或者outline TextView????android:id=@+id/myview????...????android:elevation=2dp????android:background=@drawable/myrect/?shapexmlns:android=???????android:shape=rectangle????solidandroid:color=????cornersandroid:radius=5dp/?/shape?

内容3.3阴影和视图高度的关系 使用不同eleavation值产生的阴影效果

内容3.4着色Tinting 可以轻松的使用android:tint属性去调整色调 ?ImageView????????...????????android:src=@drawable/xamarin_white????????android:background=@drawable/mycircle/????ImageView????????...????????android:src=@drawable/xamarin_white????????android:background=@drawable/mycircle????????android:tint=#2C3E50/????ImageView????????...????????android:src=@drawable/xamarin_white????????android:background=@drawable/mycircle????????android:tint=#B4BCBC/?

内容3.5裁剪视图 可以使用View.setClipToOutline方法去