Android中實(shí)現(xiàn)圓角圖片的幾種方法
Android中實(shí)現(xiàn)圓角圖片有多種姿勢,不知你解鎖了幾種?
方法一:setXfermode法
此種方式就是再new一個(gè)相同尺寸的bitmap,然后使用paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));先畫圓角矩形,再畫原始bitmap,然后就得到了一個(gè)圓角的bitmap了。
public static Bitmap getRoundedCornerBitmap(Bitmap bitmap, float roundPx) { Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Config.ARGB_8888); Canvas canvas = new Canvas(output); final int color = 0xff424242; final Paint paint = new Paint(); final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight()); final RectF rectF = new RectF(rect); paint.setAntiAlias(true); canvas.drawARGB(0, 0, 0, 0); paint.setColor(color); canvas.drawRoundRect(rectF, roundPx, roundPx, paint); paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN)); canvas.drawBitmap(bitmap, rect, rect, paint); return output; }
點(diǎn)評:
早期用得較多,占用bitmap雙倍內(nèi)存。
方法二:使用BitmapShader
此種方式是先將bitmap生成BitmapShader,然后將其繪制到canvas中, 部分關(guān)鍵代碼如下,完整代碼請參考QuickAF中的RoundImageView
bitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP); paint.setShader(bitmapShader); @Override public void draw(Canvas canvas) { Rect bounds = getBounds(); canvas.drawRoundRect(fillRect, radius, radius, paint); if (mBorderWidth > 0) { if (mIsCircle) { canvas.drawCircle(bounds.width() / 2, bounds.height() / 2, radius, strokePaint); } else { canvas.drawRoundRect(fillRect, radius, radius, strokePaint); } } }
點(diǎn)評:
占用內(nèi)存較大,實(shí)現(xiàn)有點(diǎn)小復(fù)雜。
方法三:圖片加載庫
目前github上有許多流行的圖片加載庫,基于上都附帶圓角圖片功能,只需要稍微配置一下,即可輕松的實(shí)現(xiàn)想要的效果。其實(shí)在底層,無非也是使用上面的兩種方式。比如Android-Universal-Image-Loader 早期的RoundedBitmapDisplayer使用setXfermode來實(shí)現(xiàn),后來使用BitmapShader實(shí)現(xiàn)。
DisplayImageOptions options = new DisplayImageOptions.Builder() .displayer(new RoundedBitmapDisplayer()) // display rounded bitmap .build();
再以比較另類的fresco為例,雖然底層是以C實(shí)現(xiàn),不過在圓角處理上,仍然還是在Java層實(shí)現(xiàn),用的方式還是BitmapShader。不過對于非bitmap的圓角實(shí)現(xiàn),fresco是用Paint直接畫的。附上fresco配置。
<com.facebook.drawee.view.SimpleDraweeView android:id="@+id/my_image_view" android:layout_width="20dp" android:layout_height="20dp" fresco:fadeDuration="300" fresco:actualImageScaleType="focusCrop" fresco:placeholderImage="@color/wait_color" fresco:placeholderImageScaleType="fitCenter" fresco:failureImage="@drawable/error" fresco:failureImageScaleType="centerInside" fresco:retryImage="@drawable/retrying" fresco:retryImageScaleType="centerCrop" fresco:progressBarImage="@drawable/progress_bar" fresco:progressBarImageScaleType="centerInside" fresco:progressBarAutoRotateInterval="1000" fresco:backgroundImage="@color/blue" fresco:overlayImage="@drawable/watermark" fresco:pressedStateOverlayImage="@color/red" fresco:roundAsCircle="false" fresco:roundedCornerRadius="1dp" fresco:roundTopLeft="true" fresco:roundTopRight="false" fresco:roundBottomLeft="false" fresco:roundBottomRight="true" fresco:roundWithOverlayColor="@color/corner_color" fresco:roundingBorderWidth="2dp" fresco:roundingBorderColor="@color/border_color" />
點(diǎn)評:
由框架實(shí)現(xiàn),使用簡單,穩(wěn)定。
方法四:遮罩
此種方式還是使用setXfermode,不過與方法一不同的是:不對圖片作任何更改,只在圓角之外再畫一層與背景顏色相同的四個(gè)角來遮擋,在視覺上造成圓角圖片的效果。關(guān)鍵代碼如下:
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if (src != null && dst != null) { int w = getMeasuredWidth(), h = getMeasuredHeight(); int sc = canvas.saveLayer(0, 0, w, h, null, Canvas.MATRIX_SAVE_FLAG | Canvas.CLIP_SAVE_FLAG | Canvas.HAS_ALPHA_LAYER_SAVE_FLAG | Canvas.FULL_COLOR_LAYER_SAVE_FLAG | Canvas.CLIP_TO_LAYER_SAVE_FLAG); canvas.drawBitmap(dst, 0, 0, paint); // 圓角矩形 paint.setXfermode(mode); // new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT); canvas.drawBitmap(src, 0, 0, paint); // 長方形 paint.setXfermode(null); canvas.restoreToCount(sc); } }
詳細(xì)代碼請參考QuickAF中的RoundMaskView
使用這種方式,圓角化的對象不限于ImageView,還可以是任意的layout哦,比如下面的示例
<FrameLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <ImageView android:layout_width="match_parent" android:layout_height="150dp" android:src="@color/colorAccent"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:background="@color/black_alpha_50" android:padding="12dp" android:text="I am text"/> </LinearLayout> <cn.ieclipse.af.view.RoundMaskView android:layout_width="match_parent" android:layout_height="match_parent" android:radius="10dp" app:af_borderColor="@color/white" app:af_borderWidth="1dp"/> </FrameLayout>
配合FrameLayout,將LinearLayout實(shí)現(xiàn)了圓角,在視覺效果上,ImageView左上和右上圓角,TextView左下和右下圓角。
點(diǎn)評:
具有一定的局限性,不過不限于圖片,所有的Layout都可以在視覺上實(shí)現(xiàn)圓角。
關(guān)于
QuickAF是一個(gè)Android平臺上的app快速開發(fā)框架。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- android 實(shí)現(xiàn)圓角圖片解決方案
- Android關(guān)于Glide的使用(高斯模糊、加載監(jiān)聽、圓角圖片)
- Android圖片特效:黑白特效、圓角效果、高斯模糊
- Android中Glide加載圓形圖片和圓角圖片實(shí)例代碼
- android 設(shè)置圓角圖片實(shí)現(xiàn)代碼
- Android將Glide動(dòng)態(tài)加載不同大小的圖片切圓角與圓形的方法
- android自定義imageview實(shí)現(xiàn)圓角圖片
- Android設(shè)置圖片圓角的方法
- Android生成帶圓角的Bitmap圖片
- Android實(shí)現(xiàn)圖片設(shè)置圓角形式
相關(guān)文章
Android Studio使用教程(六):Gradle多渠道打包
這篇文章主要介紹了Android Studio使用教程(六):Gradle多渠道打包,本文講解了友盟多渠道打包、assemble結(jié)合Build Variants來創(chuàng)建task、完整的gradle腳本等內(nèi)容,需要的朋友可以參考下2015-05-05Android應(yīng)用中炫酷的橫向和環(huán)形進(jìn)度條的實(shí)例分享
這篇文章主要介紹了Android應(yīng)用中炫酷的橫向和圓形進(jìn)度條的實(shí)例分享,文中利用了一些GitHub上的插件進(jìn)行改寫,也是一片很好的二次開發(fā)教學(xué),需要的朋友可以參考下2016-04-04Android編程實(shí)現(xiàn)獲取當(dāng)前系統(tǒng)語言及地區(qū)并更改語言的方法
這篇文章主要介紹了Android編程實(shí)現(xiàn)獲取當(dāng)前系統(tǒng)語言及地區(qū)并更改語言的方法,涉及Android針對系統(tǒng)語言及地區(qū)的獲取與設(shè)置相關(guān)操作技巧,需要的朋友可以參考下2017-10-10Android拍照保存在系統(tǒng)相冊不顯示的問題解決方法
我們保存相冊到Android手機(jī)的時(shí)候,然后去打開系統(tǒng)圖庫找不到我們想要的那張圖片,那是因?yàn)槲覀儾迦氲膱D片還沒有更新的緣故,下面與大家分享下此問題的解決方法2013-06-06Android基于Xposed修改微信運(yùn)動(dòng)步數(shù)實(shí)例
這篇文章主要介紹了Android基于Xposed修改微信運(yùn)動(dòng)步數(shù)實(shí)例,需要的朋友可以參考下2017-06-06Android編程出現(xiàn)Button點(diǎn)擊事件無效的解決方法示例
這篇文章主要介紹了Android編程出現(xiàn)Button點(diǎn)擊事件無效的解決方法,結(jié)合實(shí)例形式分析了Android編程中出現(xiàn)Button點(diǎn)擊事件無效的原因及相關(guān)的解決方法,需要的朋友可以參考下2018-02-02android studio按鈕監(jiān)聽的5種方法實(shí)例詳解
這篇文章主要介紹了android studio按鈕監(jiān)聽的5種方法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03