學(xué)習(xí)啦 > 學(xué)習(xí)電腦 > 電腦技巧 > android ImageView圓形的圖片自定義教程

android ImageView圓形的圖片自定義教程

時(shí)間: 本達(dá)868 分享

android ImageView圓形的圖片自定義教程

  ImageView 是android提供的一個(gè)圖片展示控件,常見的形狀是都是矩形的,我們在應(yīng)用中往往看到都是圓形的圖片,那么如何實(shí)現(xiàn)呢?下面學(xué)習(xí)啦小編告訴你!

  android ImageView圓形的圖片自定義教程

  首先,新建一個(gè)android項(xiàng)目,名稱為CircleImageView,其余參數(shù)可以自己設(shè)置,點(diǎn)擊完成生成項(xiàng)目信息。這個(gè)例子中,CircleImageViewShow不用做任何改變

  定義一個(gè)CircleImageEx 繼承ImageView,主要功能是改寫onDraw函數(shù)完成,圖片信息的改寫。onDraw函數(shù)的實(shí)現(xiàn):

  @Override

  protected void onDraw(Canvas canvas) {

  // TODO Auto-generated method stub

  Drawable drawable = getDrawable();

  if (drawable == null) {

  return;

  }

  if (getWidth() == 0 || getHeight() == 0) {

  return;

  }

  //獲取圖片,轉(zhuǎn)化為Bitmap

  Bitmap b = ((BitmapDrawable)drawable).getBitmap();

  if(null == b)

  {

  return;

  }

  //將圖片轉(zhuǎn)為32位ARGB位圖,保證圖片質(zhì)量

  Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);

  // //獲取圖片的寬 高

  int w = getWidth(), h = getHeight();

  //通過getCroppedBitmap函數(shù),返回一個(gè)圓形圖片

  Bitmap roundBitmap = getCroppedBitmap(bitmap, w);

  //在自定義的CircleImageEx上展現(xiàn)

  canvas.drawBitmap(roundBitmap, 0,0, null);

  }

  針對getCroppedBitmap函數(shù),如何畫出圓形的圖片呢?

  public static Bitmap getCroppedBitmap(Bitmap bmp, int radius) {

  Bitmap p;

  //判斷圖片的大小與傳入radius是否相等,如果不相等,那么

  //將圖片設(shè)置成長 寬都是radius的圖片

  if(bmp.getWidth() != radius || bmp.getHeight() != radius)

  p = Bitmap.createScaledBitmap(bmp, radius, radius, false);

  else

  p = bmp;

  //最后輸出的圖片信息

  Bitmap output = Bitmap.createBitmap(p.getWidth(),

  p.getHeight(), Config.ARGB_8888);

  Canvas canvas = new Canvas(output);

  final int color = 0xffa19774;

  final Paint paint = new Paint();

  final Rect rect = new Rect(0, 0, p.getWidth(), p.getHeight());

  //畫筆加上 抗鋸齒標(biāo)志,圖像更加平滑

  paint.setAntiAlias(true);

  //如果該項(xiàng)設(shè)置為true,則圖像在動(dòng)畫進(jìn)行中會(huì)濾掉對Bitmap圖像的優(yōu)化操作,加快顯示

  paint.setFilterBitmap(true);

  //防抖動(dòng)

  paint.setDither(true);

  // 透明色

  canvas.drawARGB(0, 0, 0, 0);

  //畫筆的顏色

  paint.setColor(Color.parseColor("#BAB399"));

  //畫出一個(gè)圓形

  canvas.drawCircle(p.getWidth() / 2+0.7f, p.getHeight() / 2+0.7f,

  p.getWidth() / 2+0.1f, paint);

  //設(shè)置兩張圖片相交時(shí)的模式 ,就是在畫布上遮上圓形的圖片信息

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

  canvas.drawBitmap(p, rect, rect, paint);

  return output;

  }

  其中 paint.setXfermode(new PorterDuffXfermode(android.graphics.PorterDuff.Mode.SRC_IN));

  設(shè)置兩張圖片相交時(shí)的模式 我們知道 在正常的情況下,在已有的圖像上繪圖將會(huì)在其上面添加一層新的形狀。 如果新的Paint是完全不透明的,那么它將完全遮擋住下面的Paint; 而setXfermode就可以來解決這個(gè)問題 ,具體的遮擋的效果可以參見下圖

  在main.xml中調(diào)用自定義的控件CircleImageEx,

  <.cn.CircleImageEx

  android:id="@+id/imageView"

  android:layout_width="200dip" //定義圖片的寬度

  android:layout_height="200dip" //這個(gè)就是定義圖片的高度

  android:scaleType="centerInside"

  android:src="@drawable/seven" /> //圖片來源

  我們運(yùn)行程序,觀察下結(jié)果,我們先看下原圖片

  END

看了“android ImageView圓形的圖片自定義教程”的人還看了

1.android基礎(chǔ)教程視頻:ImageView實(shí)現(xiàn)圖片旋轉(zhuǎn)和縮放

2.android基礎(chǔ)教程視頻:ImageView實(shí)現(xiàn)適屏和裁剪圖片

3.android工程師個(gè)人簡歷模板

4.android開發(fā)工程師簡歷模板

2076927