最近UI提了需求,要做一个圆角弹窗,而且弹窗里要放一个WebView。那么问题来了,怎么让WebView实现圆角。
第一反应是继承一下WebView,用Xformode实现圆角的效果。
核心代码:
int sc = canvas.saveLayer(0, 0, mWidth, mHeight, null, Canvas.ALL_SAVE_FLAG);
super.onDraw(canvas);
mPaint.setXfermode(xfermode);
canvas.drawBitmap(srcBitmap, 0, 0, mPaint);
canvas.restoreToCount(sc);
画完原有内容区域之后,补上一个圆角的矩形srcBitmap,然后混合一下,显示交叉区域,这样WebView的四个角就是透明的了,就相当于有了圆角。
但是!事与愿违,WebView的onDraw方法画的并不是控件区域,而是控件里面所有的内容,而我们想要的圆角是控件本身,而不影响其内部内容的显示。
如图为向上滚动了一点之后的界面,WebView的显示区域为title下面所有的区域,圆角虽然画上去了,但是在WebView滚动之后,圆角跟着一起滚动了,且WebView中与圆角矩形srcBitmap不交叉的区域全部透明了。
好吧
那就只能用方法二了:用CardView嵌套一下,就完事了。。。。。
其实CardView的圆角应该也是用xformode来实现的。
CardView的源码:
当然,如果是普通的控件,像ImageView想做圆角,或者什么其它的效果,都可以用混合模式来实现。WebView这种可以滚动的控件就去改它的父布局吧,改它的本身行不太通。