Android一些容易被忽略的類-RoundedBitmapDrawable

android 中提供了很多實用高效的類,但往往都會被大部分人忽略,例如今天說的RoundedBitmapDrawable,用來實現圖片的圓角,大多情況多數人是拿一個第三方的直接使用。

最終效果

首先來看下原圖和處理后效果,以及做一些擴展,如添加一個邊框


實現過程

1.創建一個簡單的圓角圖片

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.photo);
RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(getResources(), bitmap);
roundedBitmapDrawable.setCornerRadius(100);

通過RoundedBitmapDrawableFactory 傳遞要轉換bitmap 我就可以很簡單的生成一個如下圖的圓角圖片


2.創建一個正圓形圖片

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.photo);
RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(getResources(), bitmap);
roundedBitmapDrawable.setCircular(true);

可以看到我們僅僅只是改了一個屬性就實現了如下圖正圓形的轉換,但你可能已經發現圖像有一些變形,因為內部在接收到circular == true后先是對圖像進行了轉換為正方形的操作,這個操作是一個伸縮放操作,而不是裁剪,所以圖像發生了變形,所以在使用setCircular時最好能保證你的原圖時一個正方形的,如果不是的話,下面我們也會給出相應解決方案


3.創建一個正圓形帶有邊框的圖片

private Drawable createRoundImageWithBorder(Bitmap bitmap){        
    //原圖寬度
    int bitmapWidth = bitmap.getWidth();
    //原圖高度
    int bitmapHeight = bitmap.getHeight();
    //邊框寬度 pixel
    int borderWidthHalf = 20;

    //轉換為正方形后的寬高
    int bitmapSquareWidth = Math.min(bitmapWidth,bitmapHeight);

    //最終圖像的寬高
    int newBitmapSquareWidth = bitmapSquareWidth+borderWidthHalf;

    Bitmap roundedBitmap = Bitmap.createBitmap(newBitmapSquareWidth,newBitmapSquareWidth,Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(roundedBitmap);
    int x = borderWidthHalf + bitmapSquareWidth - bitmapWidth;
    int y = borderWidthHalf + bitmapSquareWidth - bitmapHeight;

    //裁剪后圖像,注意X,Y要除以2 來進行一個中心裁剪
    canvas.drawBitmap(bitmap, x/2, y/2, null);
    Paint borderPaint = new Paint();
    borderPaint.setStyle(Paint.Style.STROKE);
    borderPaint.setStrokeWidth(borderWidthHalf);
    borderPaint.setColor(Color.WHITE);

    //添加邊框
    canvas.drawCircle(canvas.getWidth()/2, canvas.getWidth()/2, newBitmapSquareWidth/2, borderPaint);

    RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(getResources(),roundedBitmap);
    roundedBitmapDrawable.setGravity(Gravity.CENTER);
    roundedBitmapDrawable.setCircular(true);
    return roundedBitmapDrawable;
}

我們自己進行對bitmap的裁剪來轉換成正方形,就解決了上面提到的拉伸問題,再繪制邊框就實現了一個如下帶邊框的正圓形圖片


其他

RoundedBitmapDrawable 也可以直接設置轉換過程的

  • setAlpha 透明度
  • setAntiAlias 抗鋸齒
  • setDither 防抖動

這些操作,來更好的工作

到這個里我們就可以把項目中的圓角圖片的控件更換一下,平時記得多留意一下系統提供的一些API,可能會幫我們節省不少時間。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 【Android 控件 RoundedBitmapDrawable】 介紹 RoundedBitmapDrawab...
    Rtia閱讀 3,881評論 0 21
  • 一、圖標的定義 一說到圖標,我想您一定會覺得非常熟悉。圖標,也稱為 icon 或 picto,是指有明確含義的圖形...
    開花了閱讀 2,994評論 0 0
  • 這是一篇對新人非常友好的文章,希望大家喜歡:) 歡迎加入UI設計群587751709 圖標的定義 一說到圖標,我想...
    UI設計鯤鵬閱讀 1,934評論 1 7
  • 一、圖標的定義 一說到圖標,我想您一定會覺得非常熟悉。圖標,也稱為 icon 或 picto,是指有明確含義的圖形...
    天井四方方閱讀 2,011評論 0 2
  • 本文簡介 點贊 + 關注 + 收藏 = 學會了 本文的目標是和各位工友一起有序的快速上手 p5.js[https:...
    德育處主任閱讀 1,787評論 0 4