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

标签：android   blog   http   ar   io   color   os   sp   for   

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

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

代码清单：

1. package com.example.phototest; 
2.  
3. import android.os.Bundle; 
4. import android.app.Activity; 
5. import android.graphics.Bitmap; 
6. import android.graphics.BitmapFactory; 
7. import android.graphics.Canvas; 
8. import android.graphics.Color; 
9. import android.graphics.Paint; 
10. import android.graphics.Path; 
11. import android.graphics.PorterDuffXfermode; 
12. import android.graphics.PorterDuff; 
13. import android.graphics.RectF; 
14. import android.graphics.drawable.BitmapDrawable; 
15. import android.graphics.drawable.Drawable; 
16. import android.view.Menu; 
17. import android.widget.ImageView; 
18.  
19. public class MainActivity extends Activity { 
20.  
21.     private ImageView myImageView; 
22.     @Override 
23.     public void onCreate(Bundle savedInstanceState) { 
24.         super.onCreate(savedInstanceState); 
25.         setContentView(R.layout.activity_main); 
26.         myImageView=(ImageView)findViewById(R.id.imageView1); 
27.         Bitmap photo = BitmapFactory.decodeResource(getResources(), R.drawable.photo1); 
28.         myImageView.setImageBitmap(createFramedPhoto(500,400,photo,20)); 
29.         //myImageView.setImageBitmap(createStarPhoto(500,400,photo));  
30.     } 
31.  
32.     @Override 
33.     public boolean onCreateOptionsMenu(Menu menu) { 
34.         getMenuInflater().inflate(R.menu.activity_main, menu); 
35.         return true; 
36.     } 
37.     private Bitmap createFramedPhoto(int x, int y, Bitmap image, float outerRadiusRat) { 
38.         //根据源文件新建一个darwable对象  
39.         Drawable imageDrawable = new BitmapDrawable(image); 
40.  
41.         // 新建一个新的输出图片  
42.         Bitmap output = Bitmap.createBitmap(x, y, Bitmap.Config.ARGB_8888); 
43.         Canvas canvas = new Canvas(output); 
44.  
45.         // 新建一个矩形  
46.         RectF outerRect = new RectF(0, 0, x, y); 
47.  
48.         // 产生一个红色的圆角矩形  
49.         Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
50.         paint.setColor(Color.RED); 
51.         canvas.drawRoundRect(outerRect, outerRadiusRat, outerRadiusRat, paint); 
52.  
53.  
54.         // 将源图片绘制到这个圆角矩形上  
55.         //详解见http://lipeng88213.iteye.com/blog/1189452  
56.         paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 
57.         imageDrawable.setBounds(0, 0, x, y); 
58.         canvas.saveLayer(outerRect, paint, Canvas.ALL_SAVE_FLAG); 
59.         imageDrawable.draw(canvas); 
60.         canvas.restore(); 
61.  
62.         return output; 
63.     } 
64. } 

实现原理：通过在一个Canvas中绘制一个最终的输出形状，然后通过类似于遮罩的方式将图形显示出来，最终的图片形状就是先前绘制的图形的形状。具体起作用的函数是这个：

paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 

用来设置叠加模式的。

通过这个原理，我能就能够绘制各种各样形状的图片，比如：

代码：

1. private Bitmap createStarPhoto(int x, int y, Bitmap image) 
2.     { 
3.         //根据源文件新建一个darwable对象  
4.         Drawable imageDrawable = new BitmapDrawable(image); 
5.  
6.         // 新建一个新的输出图片  
7.         Bitmap output = Bitmap.createBitmap(x, y, Bitmap.Config.ARGB_8888); 
8.         Canvas canvas = new Canvas(output); 
9.  
10.         // 新建一个矩形  
11.         RectF outerRect = new RectF(0, 0, x, y); 
12.  
13.         Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
14.         paint.setColor(Color.RED); 
15.    
16.         Path path = new Path();   
17.            
18.         //绘制三角形  
19.         //path.moveTo(0, 0);  
20.         //path.lineTo(320, 250);   
21.         //path.lineTo(400, 0);     
22.          
23.         //绘制正无边形  
24.         long tmpX,tmpY; 
25.         path.moveTo(200, 200);// 此点为多边形的起点   
26.         for(int i=0;i<=5;i++) 
27.         { 
28.          tmpX =(long)(200+200*Math.sin((i*72+36)*2*Math.PI/360)); 
29.          tmpY =(long)(200+200*Math.cos((i*72+36)*2*Math.PI/360)); 
30.          path.lineTo(tmpX, tmpY); 
31.         } 
32.         path.close(); // 使这些点构成封闭的多边形   
33.         canvas.drawPath(path, paint);   
34.         //canvas.drawCircle(100, 100, 100, paint);  
35.  
36.         // 将源图片绘制到这个圆角矩形上  
37.         // 产生一个红色的圆角矩形  
38.  
39.         paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 
40.         imageDrawable.setBounds(0, 0, x, y); 
41.         canvas.saveLayer(outerRect, paint, Canvas.ALL_SAVE_FLAG); 
42.         imageDrawable.draw(canvas); 
43.         canvas.restore(); 
44.         return output; 
45.     } 

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

标签：android   blog   http   ar   io   color   os   sp   for   

原文地址：http://www.cnblogs.com/Free-Thinker/p/4169385.html