效果圖:

效果圖

參考:你不知道的Android著色器/渲染器

原理

首先說一下原理,這是一張圖片A,然后通過拷貝成圖片B,再把B翻轉(zhuǎn),翻轉(zhuǎn)后再設(shè)置B+一個漸變色的混合,實(shí)現(xiàn)漸變桐腌。

代碼

布局文件

<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"
    tools:context="com.example.customview.ReflectActivity" >

    <com.example.customview.ReflectView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />

</RelativeLayout>

編碼

package com.example.customview;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.LinearGradient;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Shader.TileMode;
import android.util.AttributeSet;
import android.view.View;

public class ReflectView extends View {
    
    private Bitmap  mBitmap;
    private Bitmap  mRefBitmap;
                    
    public ReflectView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    
    public ReflectView(Context context) {
        super(context, null);
    }
    
    public ReflectView(Context context, AttributeSet attrs) {
        super(context, attrs, 0);
        mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.jpg);
        /**
         * 這是上面的那張圖片A
         */
        
        Matrix matrix = new Matrix();
        matrix.setScale(1f, -1f);
        /**
         * 使圖片上下翻轉(zhuǎn)的矩陣運(yùn)算
         */
        
        mRefBitmap = Bitmap.createBitmap(mBitmap, 0, 0, mBitmap.getWidth(), mBitmap.getHeight(), matrix, true);
        /**
         * 拷貝圖片A并翻轉(zhuǎn)
         */
        
        Paint paint = new Paint();
        LinearGradient linearGradient = new LinearGradient(0, 0, 0, mBitmap.getHeight() / 4, 0X00000000, 0XFF000000,
                TileMode.CLAMP);
        paint.setShader(linearGradient);
        /**
         * 這是使圖片B漸變的渲染器 讓顏色從透明-->黑色
         */
        
        Canvas canvas = new Canvas(mRefBitmap);
        canvas.drawRect(0, 0, mBitmap.getWidth(), mBitmap.getHeight() / 4, paint);
        /**
         * 然后開始在mRefBitmap上畫出漸變效果
         */
    }
    
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.clipRect(0, 0, mBitmap.getWidth(), mBitmap.getHeight() + mBitmap.getHeight() / 4);
        /**
         * 只在有效區(qū)域(寬度為圖片寬度,高度為圖片高度+倒影的高度)內(nèi)作畫,其他超出有效區(qū)域的裁剪掉
         */
        
        /**
         * 最后把兩張圖片拼接
         */
        canvas.drawBitmap(mBitmap, 0, 0, null);
        canvas.drawBitmap(mRefBitmap, 0, mBitmap.getHeight(), null);
    }
}