Android中绘制圆角矩形图片及任意形状图片

        圆角矩形图片在苹果的产品中很流行,相比于普通的矩形,很多人都喜欢圆角矩形的图片,因为它避开了直角的生硬,带来更好的用户体验,下面是几个设计的例子:




下面在Android中实现将普通的矩形图片绘制成圆角矩形。首先看最终效果:



代码清单:
package com.example.phototest;

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuffXfermode;
import android.graphics.PorterDuff;
import android.graphics.RectF;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.view.Menu;
import android.widget.ImageView;

public class MainActivity extends Activity {

	private ImageView myImageView;
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		myImageView=(ImageView)findViewById(R.id.imageView1);
		Bitmap photo = BitmapFactory.decodeResource(getResources(), R.drawable.photo1);
		myImageView.setImageBitmap(createFramedPhoto(500,400,photo,20));
		//myImageView.setImageBitmap(createStarPhoto(500,400,photo));
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.activity_main, menu);
		return true;
	}
	private Bitmap createFramedPhoto(int x, int y, Bitmap image, float outerRadiusRat) {
		//根据源文件新建一个darwable对象
		Drawable imageDrawable = new BitmapDrawable(image);

		// 新建一个新的输出图片
		Bitmap output = Bitmap.createBitmap(x, y, Bitmap.Config.ARGB_8888);
		Canvas canvas = new Canvas(output);

		// 新建一个矩形
		RectF outerRect = new RectF(0, 0, x, y);

		// 产生一个红色的圆角矩形
		Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
		paint.setColor(Color.RED);
		canvas.drawRoundRect(outerRect, outerRadiusRat, outerRadiusRat, paint);


		// 将源图片绘制到这个圆角矩形上
		//详解见http://lipeng88213.iteye.com/blog/1189452
		paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
		imageDrawable.setBounds(0, 0, x, y);
		canvas.saveLayer(outerRect, paint, Canvas.ALL_SAVE_FLAG);
		imageDrawable.draw(canvas);
		canvas.restore();

		return output;
	}
}

实现原理:通过在一个Canvas中绘制一个最终的输出形状,然后通过类似于遮罩的方式将图形显示出来,最终的图片形状就是先前绘制的图形的形状。具体起作用的函数是这个:
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
用来设置叠加模式的。
通过这个原理,我能就能够绘制各种各样形状的图片,比如:



代码:

private Bitmap createStarPhoto(int x, int y, Bitmap image)
	{
		//根据源文件新建一个darwable对象
		Drawable imageDrawable = new BitmapDrawable(image);

		// 新建一个新的输出图片
		Bitmap output = Bitmap.createBitmap(x, y, Bitmap.Config.ARGB_8888);
		Canvas canvas = new Canvas(output);

		// 新建一个矩形
		RectF outerRect = new RectF(0, 0, x, y);

		Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
		paint.setColor(Color.RED);
  
		Path path = new Path();  
		 
		//绘制三角形
		//path.moveTo(0, 0);
        //path.lineTo(320, 250);  
        //path.lineTo(400, 0);   
        
        //绘制正无边形
        long tmpX,tmpY;
		path.moveTo(200, 200);// 此点为多边形的起点 
        for(int i=0;i<=5;i++)
        {
         tmpX =(long)(200+200*Math.sin((i*72+36)*2*Math.PI/360));
         tmpY =(long)(200+200*Math.cos((i*72+36)*2*Math.PI/360));
         path.lineTo(tmpX, tmpY);
        }
		path.close(); // 使这些点构成封闭的多边形  
		canvas.drawPath(path, paint);  
		//canvas.drawCircle(100, 100, 100, paint);

		// 将源图片绘制到这个圆角矩形上
		// 产生一个红色的圆角矩形

		paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
		imageDrawable.setBounds(0, 0, x, y);
		canvas.saveLayer(outerRect, paint, Canvas.ALL_SAVE_FLAG);
		imageDrawable.draw(canvas);
		canvas.restore();
		return output;
	}



  • 1
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值