Material设计非得靠Android L吗？看过来，自定View仿elevation效果！

Material设计中主要就是纸和z轴的概念，如果根据z值绘制出阴影效果，就基本实现了elevation效果了。

先上个效果图


代码不多，效果却不错，在此抛砖引玉，希望大家开阔思维，做出更多更好效果。

package com.zjg.smart.android.view;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.zjg.smart.android.utils.DimensionUtils;
import com.zjg.test.Common;

public
class ShadowView extends View {
private Context
context = null;
private
float density = 1.0f;
private
int z = 10;
private Paint
paint = new Paint(Paint.ANTI_ALIAS_FLAG);
private
int startShadowColor = 0x00999999;
private
int endShadowColor = 0x66999999;

public ShadowView(Context context) {
this(context,
null);
// TODO自动生成的构造函数存根
}

public ShadowView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
// TODO自动生成的构造函数存根
}

public ShadowView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
// TODO自动生成的构造函数存根
this.context = context;
density = DimensionUtils.getDensity(context);
}

protected
int getInterpolationColor(int c1,
int c2, int ratio) {
ratio = ratio < 0 ? 0 : ratio;
ratio = ratio > 255 ? 255 : ratio;

int r1 = Color.red(c1);
int g1 = Color.green(c1);
int b1 = Color.blue(c1);
int a1 = Color.alpha(c1);

int r2 = Color.red(c2);
int g2 = Color.green(c2);
int b2 = Color.blue(c2);
int a2 = Color.alpha(c2);

int r = (r1 * (255 - ratio) + r2 * ratio) >> 8;
int g = (g1 * (255 - ratio) + g2 * ratio) >> 8;
int b = (b1 * (255 - ratio) + b2 * ratio) >> 8;
int a = (a1 * (255 - ratio) + a2 * ratio) >> 8;

return Color.argb(a, r, g, b);
}

@Override
protected
void onDraw(Canvas canvas) {
super.onDraw(canvas);

int w = getMeasuredWidth();
Log.i(Common.LOG_TAG,
"w = " + w);
int h = getMeasuredHeight() -
z;
Log.i(Common.LOG_TAG,
"h = " + h);
int radius = (w < h ? w : h) >> 1;
Log.i(Common.LOG_TAG,
"radius = " + radius);
float x = radius;
Log.i(Common.LOG_TAG,
"x = " + x);
float y = radius;
Log.i(Common.LOG_TAG,
"y = " + y);
// radius -= z;
Log.i(Common.LOG_TAG,
"radius = " + radius);

// 阴影
int step = 255 /
z;
for (int i =
z; i > 0; i--) {
int shadowColor = getInterpolationColor(startShadowColor,
endShadowColor, step * (z - i));
paint.setColor(shadowColor);
canvas.drawCircle(x, y + i, radius,
paint);
}

// 设定颜色
paint.setColor(0xffba68c8);
canvas.drawCircle(x, y, radius,
paint);
}

@Override
protected
void onMeasure(int widthMeasureSpec,
int heightMeasureSpec) {
// TODO自动生成的方法存根
setMeasuredDimension(measureWidth(widthMeasureSpec),
measureHeight(heightMeasureSpec));
}

private
int measureWidth(int measureSpec) {
int result = 0;
int specMode = MeasureSpec.getMode(measureSpec);
int specSize = MeasureSpec.getSize(measureSpec);

Log.i(Common.LOG_TAG,
"wSpecMode=" +getModeName(specMode));
Log.i(Common.LOG_TAG,
"wSpecSize=" + specSize);

if (specMode == MeasureSpec.EXACTLY) {
// We were toldhow big to be
result = specSize;
} else {
// Measure thetext
result = (int) (56 *
density);
Log.i(Common.LOG_TAG,
"result=" + result);
if (specMode == MeasureSpec.AT_MOST) {
// RespectAT_MOST value if that was what is called for by
// measureSpec
result = result < specSize ? result : specSize;
}
}
return result;
}

private
int measureHeight(int measureSpec) {
int result = 0;
int specMode = MeasureSpec.getMode(measureSpec);
int specSize = MeasureSpec.getSize(measureSpec);

Log.i(Common.LOG_TAG,
"hSpecMode=" +getModeName(specMode));
Log.i(Common.LOG_TAG,
"hSpecSize=" + specSize);

if (specMode == MeasureSpec.EXACTLY) {
// We were toldhow big to be
result = specSize;
} else {
// Measure thetext
result = (int) (56 *
density);
Log.i(Common.LOG_TAG,
"result=" + result);
if (specMode == MeasureSpec.AT_MOST) {
// RespectAT_MOST value if that was what is called for by
// measureSpec
result = result < specSize ? result : specSize;
}
}
return result +
z;
}

private String getModeName(int specMode) {
// TODO自动生成的方法存根
if (specMode == MeasureSpec.UNSPECIFIED) {
return
"UNSPECIFIED";
} else
if (specMode == MeasureSpec.EXACTLY) {
return
"EXACTLY";
} else
if (specMode == MeasureSpec.AT_MOST) {
return
"AT_MOST";
}
return
"";
}

}

<?xml
version="1.0"encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MyActivity"
>

<com.zjg.smart.android.view.ShadowView
android:layout_width="56dp"
android:layout_height="56dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp"/>

</RelativeLayout>

package com.zjg.test;

import android.app.Activity;
import android.os.Bundle;

public
class ShadowViewTest extends Activity {
@Override
public
void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_shadow_test);
}
}