Android 5.x新特性之elevation(阴影),tinting（着色）以及clipping（剪裁）

快过年了，公司也没事作了， 本身也闲了下来，一每天呆着真没意思，闲来没事本身研究研究了Google I/O 2014 发布 Material Design设计，人性化的风格，丰富的色彩，令人机交互更完美。中文学习地址http://wiki.jikexueyuan.com/project/material-design/(这个好像是极客学院翻译的)，固然若是你的引文OK的话，也能够去看官方英文文档http://www.google.com/design/spec/material-design/。

1。阴影以及高度--elevation

 一般状况下，Android 的view设计之考虑到x,y2个方向，可是5.x之后Google又引出了一个z的属性，咱们来看一下官方给的效果图：

你们能够看出来，上面的图片看起来有阴影，好像2个图片不在一个高度同样，而他的侧面图，正好能够解释，怎么能够达到这种效果呢，咱们能够再布局空间里面添加一个elevation的属性，（用起来很简单）

1 <TextView
2         android:layout_width="100dp"
3         android:layout_height="100dp"
4         android:layout_margin="10dp"
5         android:elevation="1dp" 
6         android:background="@mipmap/banner_pingan_default"/>

固然咱们也能够用代码来实现

view.setTranslationZ(100);

2.tinting

在Android 5.X后也引入了一个叫tint的属性，意思叫"着色"，有两种形式：

一、android:backgroundTint=""  二、android:tint=""

咱们先来看一下图片：这个主要是在xml文件里定义tint和tintMode2个属性，其中tintMode有6个。

tintMode主要改变咱们着色的模式！！！！通常状况默认的模式是 src_in;

按顺序第一个是图片原图，其他的把tintMode属性分别设置为：add，multiply,screen,src_atop,src_in,src_over,

咱们能够看出来，主要是给图片上着上一层遮罩颜色。

　　

固然咱们也知道，这是5.x以上的新特性，若是咱们想让他低版本也支持该怎么办呢？Goolge固然想到了，这个时候咱们须要引入support-V7jar包，

咱们须要吧须要的控件定义为：android.support.v7.widget.AppCompat...

咱们以TextView为例子:

 

1 <android.support.v7.widget.AppCompatTextView
2     android:id="@+id/t1"
3     android:layout_width="match_parent"
4     android:layout_height="50dp"
5     android:text="测试" />

可是注意了，这个时候，咱们不能在布局里面定义了咱们须要在代码里面设置

1 ViewCompat.setSupportBackgroundTintList(ColorStateList tint);
2 ViewCompat.setSupportBackgroundTintMode(PorterDuff.Mode tintMode);

 

 

注意：咱们能够看到，第一行须要的参数是ColorStateList类型的，这个时候，咱们可使用getResource().getColorStateList(R.color.色值);来获取

 

 

3.clipping

一半状况下，咱们都把一个view改变一下外形，很常见的好比一个TextView带圆角边框的，咱们通常状况下，都会用shape资源去化一个这样的做为TextView的背景。例以下图

那么咱们要怎么样去实现这样的一个样式，而不是用shape呢，很简单，咱们先看一下xml文件怎么布局

 1     <TextView
 2         android:id="@+id/tv1"
 3         android:layout_width="200dp"
 4         android:layout_height="50dp"
 5         android:elevation="1dp"
 6         android:text="注册"
 7         android:textSize="19sp"
 8         android:gravity="center"
 9         android:textColor="@color/colorPrimaryDark"
10         android:layout_margin="20dp"/>

能够看出来，咱们只是加了一个elevation属性，设置为1dp的阴影，图的主要的是要在代码里面实现，咱们看下怎么去实现

        //获取outLine，咱们须要使用ViewoutLineProvider
        ViewOutlineProvider viewOutlineProvider=new ViewOutlineProvider() {
            @Override
            public void getOutline(View view, Outline outline) {
                //修改outLine的形状，这里是设置分别设置左上右下，以及Radius
                outline.setRoundRect(0,0,view.getWidth(),view.getHeight(),30);
            }
        };
        //将须要控件重写设置形状
        tv1.setOutlineProvider(viewOutlineProvider);

so就这么简单，实际上就是利用阴影给人视觉上的错觉。