Android利用Xfermode剪裁圓角
通常的圖片圓角一般是對單獨的圖片進行切圓角操作,但是像下圖的效果就沒那么合適了,雖然對單張圖片切圓角也能實現(xiàn),但更為繁瑣、不簡潔,因為數(shù)據(jù)內容是動態(tài)的,要根據(jù)數(shù)據(jù)源分很多種情況判斷哪張圖片該切哪個角。
所以,我在想能不能就在外層容器的四個角切圓角而不用管內部圖片的圓角情況呢?答案顯然是能!主要思路就是自定義一個layout,在dispatchDraw的時候將數(shù)據(jù)圖片的canvas與圓角bitmap混合,設置Xfermode為PorterDuff.Mode.DST_IN使交集部分展示即可達到圖示的效果
關鍵代碼(根據(jù)后臺數(shù)據(jù)生成里面的每個item相關代碼沒有貼,根據(jù)業(yè)務場景改變即可):
public class HotCityView extends LinearLayout { ? ? private LinearLayout ll_item_container1, ll_item_container2; ? ? private int itemH, itemSpace; ? ? private int padding; ? ? private Paint clipPaint; ? ? private RectF clipRect; ? ? private Bitmap maskBitmap; ? ? private int cornerSize; ? ? public HotCityView(@NonNull Context context) { ? ? ? ? this(context, null); ? ? } ? ? public HotCityView(@NonNull Context context, @Nullable AttributeSet attrs) { ? ? ? ? this(context, attrs, 0); ? ? } ? ? public HotCityView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyle) { ? ? ? ? super(context, attrs, defStyle); ? ? ? ? setOrientation(VERTICAL); ? ? ? ? inflate(context, R.layout.m_layout_hot_city, this); ? ? ? ? padding = (int) getResources().getDimension(R.dimen.list_lr_margin1); ? ? ? ? setPadding(padding, 0, padding, 0); ? ? ? ? itemH = PixelUtil.dp2px(109); ? ? ? ? itemSpace = (int) getResources().getDimension(R.dimen.hot_item_space); ? ? ? ? cornerSize = PixelUtil.dp2px(8); ? ? ? ? ll_item_container1 = findViewById(R.id.m_hot_city_item_container1); ? ? ? ? ll_item_container2 = findViewById(R.id.m_hot_city_item_container2); ? ? ? ? clipPaint = new Paint(Paint.ANTI_ALIAS_FLAG); ? ? ? ? clipPaint.setStyle(Paint.Style.FILL); ? ? } ? ? @Override ? ? protected void dispatchDraw(Canvas canvas) { ? ? ? ? if (clipRect == null || getMeasuredWidth() == 0) { ? ? ? ? ? ? clipRect = new RectF(padding, 0, getMeasuredWidth() - padding, getMeasuredHeight()); ? ? ? ? ? ? maskBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_4444); ? ? ? ? ? ? Canvas c = new Canvas(maskBitmap); ? ? ? ? ? ? //在蒙版上畫需要覆蓋的圖形 ? ? ? ? ? ? c.drawRoundRect(clipRect, cornerSize, cornerSize, clipPaint); ? ? ? ? } ? ? ? ? //保存還沒有繪制之前的圖層 ? ? ? ? int layerId = canvas.saveLayer(clipRect, clipPaint, Canvas.ALL_SAVE_FLAG); ? ? ? ? //繪制底部圖層 ? ? ? ? super.dispatchDraw(canvas); ? ? ? ? //設置混合模式,實現(xiàn)view的四個圓角 ? ? ? ? clipPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN)); ? ? ? ? canvas.drawBitmap(maskBitmap, 0, 0, clipPaint); ? ? ? ? clipPaint.setXfermode(null); ? ? ? ? //恢復之前的圖層,要不然背景是黑色的 ? ? ? ? canvas.restoreToCount(layerId); ? ? } ? ? //這種方式也可以實現(xiàn)裁剪效果,但是需要5.0以上 ? ? private void clipRoundView() { ? ? ? ? if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) { ? ? ? ? ? ? ViewOutlineProvider viewOutlineProvider = new ViewOutlineProvider() { ? ? ? ? ? ? ? ? @Override ? ? ? ? ? ? ? ? public void getOutline(View view, Outline outline) { ? ? ? ? ? ? ? ? ? ? //修改outline為特定形狀 ? ? ? ? ? ? ? ? ? ? outline.setRoundRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), cornerSize); ? ? ? ? ? ? ? ? } ? ? ? ? ? ? }; ? ? ? ? ? ? //重新設置形狀 ? ? ? ? ? ? setOutlineProvider(viewOutlineProvider); ? ? ? ? ? ? //添加背景或者是ImageView的時候失效,添加如下設置 ? ? ? ? ? ? setClipToOutline(true); ? ? ? ? } ? ? } }
附各種Xfermode的效果(這張圖太經典了,按照命名規(guī)則其實很容易理解,無需記住,到用的時候查閱即可):
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- android 實現(xiàn)圓角圖片解決方案
- Android中TextView顯示圓圈背景或設置圓角的方法
- Android關于Glide的使用(高斯模糊、加載監(jiān)聽、圓角圖片)
- Android圖片特效:黑白特效、圓角效果、高斯模糊
- Android開發(fā)使用自定義View將圓角矩形繪制在Canvas上的方法
- Android中實現(xiàn)EditText圓角的方法
- Android中Glide加載圓形圖片和圓角圖片實例代碼
- android 設置圓角圖片實現(xiàn)代碼
- Android自定義控件之圓形、圓角ImageView
- Android實現(xiàn)圓角矩形和圓形ImageView的方式
相關文章
Android實戰(zhàn)打飛機游戲之子彈生成與碰撞以及爆炸效果(5)
這篇文章主要為大家詳細介紹了Android實戰(zhàn)打飛機游戲之子彈生成與碰撞以及爆炸效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-07-07android Animation監(jiān)聽器AnimationListener的使用方法)
AnimaitonListener的使用方法主要是在Animation上設置一個監(jiān)聽器,下面通過一個實例說明它的使用方法2013-11-11Android來電監(jiān)聽和去電監(jiān)聽實現(xiàn)代碼
本文是關于來點監(jiān)聽和去電監(jiān)聽展開問題,通過實例代碼講解,對android來電監(jiān)聽和去電監(jiān)聽的相關知識感興趣的朋友一起看看吧2017-06-06Android學習筆記(一)環(huán)境安裝及第一個hello world
最近在學習安卓開發(fā),記錄下環(huán)境安裝和第一個hello world的誕生過程,希望對大家有所幫助2014-07-07