Android自定义控件今天要讲到的就是望远镜效果,那么什么是望远镜效果,我们不妨看看下方的动图,看完后,相信大家就有一定的认识了。
<强> 1。着色器
对于这种效果来说,其实实现起来挺简单的,但我们将会用到在三维软件中的着色器材质,它是用来给空白图形上色的。用过PS的人,相信大家都知道里面有一个印章工具,印章的样式可以是图像,颜色,渐变色等。在安卓里面,着色器的效果其实与他类似。
公共材质setShader(材质材质)
上面是材质的专用函数,也是画笔颜料中的函数,我们今天要用到的是BitmapShader,也即是图片来填充,它的基本用法如下:
公共BitmapShader(位图的位图,TileMode tileX, TileMode泰利)
tileX用来指定当X轴超出单张图片大小时所使用的重复策略
泰利用来指定当Y轴超出单张图片大小时所使用的重复策略
而这两个值的取值有三种,分别是:
TileMode.CLAMP:用边缘色彩来填充多余空间,夹就是以X轴填充X边缘颜色,以Y轴填充Y轴边缘颜色,而XY非图片相交区域以填充Y轴的颜色继续填充。(这里估计博主故意把猫右边缘填充了黑色,Y边缘填充了红色,框起来的地方是原图)
TileMode.REPEAT:重复原图像来填充多余空间,其实这个模式最好理解,就是复制粘贴,X不够的空白区域填充原图,Y不够的也用原图像填充。
TileMode.MIRROR:重复使用镜像模式的图像来填充多余空间,有可能有的小伙伴不懂镜镜像模式,其实镜像模式就是想镜子一样翻转了图像,如下图所示:
<强> 2。望远镜效果实现
原理已经剖析清楚了,接着,我们就来实现开头的望远镜效果,首先,还是自定义控件,毕竟这一个专栏都是自定义控件,基本每篇都少不了这个步骤,代码如下:
公开课BitmapShaderView扩展视图{
私人油漆涂料;//画笔工具
私人位图bgBitmap,位图;//隐藏图像以及原图像
私人int mX=1=1;//捕获手指的位置坐标
公共BitmapShaderView(上下文语境){
超级(上下文);
}
公共BitmapShaderView(上下文语境,@Nullable AttributeSet attrs) {
超级(上下文,attrs);
这一点。涂=new();//初始化画笔工具
这一点。位图=BitmapFactory.decodeResource (getresource (), R.drawable.background);//获取原图像
}
公共BitmapShaderView(上下文语境,@Nullable AttributeSet attrs, int defStyleAttr) {
超级(上下文、attrs defStyleAttr);
}
}
详细注解,应该可以理解了,这里就不在做过多的赘述,接下来,我们需要捕获手指下按,移动以及离开屏幕的手指所在位置,也就是重写onTouchEvent()函数:
公共布尔>
保护无效onDraw(帆布画布){
super.onDraw(画布);
如果(this.bgBitmap==null) {
this.bgBitmap=Bitmap.createBitmap (getWidth(),获得(),Bitmap.Config.ARGB_8888);//创建一个新空白位图
帆布canvasBg=新画布(this.bgBitmap);//然后对背景图拉升后,画到上面的位图中
canvasBg.drawBitmap(这一点。位图、零、新矩形(0,0,getWidth(),获得()),this.paint);
}
如果(this.mX !=1,,this.mY !=1) {//填充模式为上面讲的第二种,就是复制粘贴的填充模式,但这里不会执行//因为我们上面强制设置了图片的大小为整个屏幕,所以屏幕没有空白区域
this.paint。setShader(新BitmapShader(这一点。bgBitmap、Shader.TileMode.REPEAT Shader.TileMode.REPEAT));
canvas.drawCircle (this.mX this.mY 200, this.paint);
}
}
这里我们首先创建了一个空白位图,然后对原图像进行拉升后画到这张位图中,接着,根据设置画笔的填充模式,这里其实没的用,是因为我们拉升了图像,并没有空白区域,最后,我们根据手指坐标,将望远镜效果绘制到手机界面中,这样望远镜效果的自定义控件完美实现了。
