码迷,mamicode.com
首页 > 移动开发 > 详细

Android实现图片的倒影效果

时间:2015-07-31 18:31:36      阅读:169      评论:0      收藏:0      [点我收藏+]

标签:android倒影效果

原理:

原图和倒影图分解成两个Bitmap, 倒影的Bitmap设计为原图的高度一半,宽度一致。然后创建一个可变空的Bitmap, 宽度跟原图保持一致,宽度为原图的1.5倍(宽度包括原图和倒影图的宽度之和),然后用Canvas关联这个可变空的Bitmap,在Canvas上将原图和倒影图依次绘制上去就行,为了打到倒影的效果,需要设计渐变等效果。

主要逻辑如下:

package com.jackie.revertbitmap;

import android.app.Activity;
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.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Shader;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.widget.ImageView;

public class MainActivity extends Activity {
    private ImageView mRevertImageView;
    private Bitmap mSourceBitmap;  //原图
    private Bitmap mRevertBitmap;  //倒立图

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mRevertImageView = (ImageView)findViewById(R.id.im_revert);
        mSourceBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.source);
        mRevertImageView.setBackground(new BitmapDrawable(getResources(), revertBitmap()));
    }

    private Bitmap revertBitmap() {
        //1.倒立图
        Matrix matrix = new Matrix();
        matrix.preScale(1, -1);   //以X轴向下翻转
        int width = mSourceBitmap.getWidth();
        int height = mSourceBitmap.getHeight();

        //生成倒立图,宽度和原图一致,高度为原图的一半
        mRevertBitmap = Bitmap.createBitmap(mSourceBitmap, 0, height / 2, width, height / 2, matrix, false);

        //2.要生成原图加上倒立图,先生成一个可变空的Bitmap, 高度为原图高度的1.5倍(包括原图和倒立图的高度)
        int gap = 10; //间隙空白
        Bitmap bitmap = Bitmap.createBitmap(width, height + height / 2, Bitmap.Config.ARGB_8888);
        Paint paint = new Paint();
        Canvas canvas = new Canvas(bitmap);
        canvas.drawBitmap(mSourceBitmap, 0, 0, paint);  //绘制原图
        canvas.drawBitmap(mRevertBitmap, 0, height + gap, paint);  //绘制倒立图

        //3.画笔使用LinearGradient 线性渐变渲染
        LinearGradient lg = new LinearGradient(0, height + gap, width, bitmap.getHeight(), 0xabff0000, 0x00ffff00, Shader.TileMode.MIRROR);
        paint.setShader(lg);

        //4.指定画笔的Xfermode 即绘制的模式(不同的模式,绘制的区域不同)
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_ATOP));

        //5.在倒立图区,绘制矩形渲染图层
        canvas.drawRect(0, height + gap, width, bitmap.getHeight(), paint);
        paint.setXfermode(null);
        return bitmap;
    }

    //缩放图片
    private Bitmap resizeImage(Bitmap bitmap, int width, int height) {
        int originWidth = bitmap.getWidth();
        int originHeight = bitmap.getHeight();

        float scaleWidth = width / originWidth;
        float scaleHeight = height / originHeight;

        Matrix matrix = new Matrix();
        matrix.postScale(scaleWidth, scaleHeight);
        Bitmap resizeBitmap = Bitmap.createBitmap(bitmap, 0, 0, originWidth, originHeight, matrix, true);
        return resizeBitmap;
    }
}

PorterDuffXfermode 定义的模式如下:
private static final Xfermode[] sModes = {
 new PorterDuffXfermode(PorterDuff.Mode.CLEAR),     //所绘制不会提交到画布上
 new PorterDuffXfermode(PorterDuff.Mode.SRC),       //显示上层绘制图片
 new PorterDuffXfermode(PorterDuff.Mode.DST),      //显示下层绘制图片
 new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER), //正常绘制显示,上下层绘制叠盖
 new PorterDuffXfermode(PorterDuff.Mode.DST_OVER), //上下层都显示。下层居上显示
 new PorterDuffXfermode(PorterDuff.Mode.SRC_IN),   //取两层绘制交集。显示上层
 new PorterDuffXfermode(PorterDuff.Mode.DST_IN),   //取两层绘制交集。显示下层
 new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT),  //取上层绘制非交集部分
 new PorterDuffXfermode(PorterDuff.Mode.DST_OUT),  //取下层绘制非交集部分
 new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP), //取下层非交集部分与上层交集部分
 new PorterDuffXfermode(PorterDuff.Mode.DST_ATOP), //取上层非交集部分与下层交集部分
 new PorterDuffXfermode(PorterDuff.Mode.XOR),      //滤色效果
 new PorterDuffXfermode(PorterDuff.Mode.DARKEN),   //滤色效果
 new PorterDuffXfermode(PorterDuff.Mode.LIGHTEN),  //滤色效果
 new PorterDuffXfermode(PorterDuff.Mode.MULTIPLY), //滤色效果
 new PorterDuffXfermode(PorterDuff.Mode.SCREEN)    //滤色效果
};

效果图如下:

技术分享


版权声明:本文为博主原创文章,未经博主允许不得转载。

Android实现图片的倒影效果

标签:android倒影效果

原文地址:http://blog.csdn.net/shineflowers/article/details/47172253

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!