假想在一张图片上有很多网格,如下图。
在这张图上,每个网格上的像素与图片上的像素是一一对应的,也就是网格怎么扭动,图像就会怎么动。比如把网格扭成下面这样,图像就跟着扭曲了。
但是如何把网格扭成这样呢?在Android中很简单,设置网格顶点所在位置就可以了。但是顶点之间的线不是扭曲的么?不需要自己计算弯曲的方式吗?
不需要。
在DrawBitmapMesh中,只需要定义好这个顶点将要扭曲到哪个坐标点上,然后将顶点扭曲后的坐标告诉DrawBitmapMesh,便会自动计算出周边的线条扭曲形式,并根据结果扭曲图像。
总结上面的,需要做的就是三步:
1、根据图片,生成原始的、四四方方的网格
2、根据上面生成的网格,算出将要扭曲的网格
3、将网格传入drawBitmapMesh
而生成网格的方式,就是定义网格中,每个顶点的X,Y坐标。
回到方法定义上来。Canvas的drawBitmapMesh定义如下:
public void drawBitmapMesh(Bitmap bitmap, int meshWidth, int meshHeight, float[] verts, int vertOffset, int[] colors, int colorOffset, Paint paint)
关键参数主要下面四个:
-bitmap: 就是将要扭曲的图像
-meshWidth: 需要的横向网格数目
-meshHeight: 需要的纵向网格数目
-verts: 网格顶点坐标数组。
-vertOffset: verts数组中开始跳过的(x,y)对的数目。
其中,verts是个一维数组,保存所有顶点坐标信息。偶数项保存x坐标,奇数项保存y坐标。比如有有meshWidth*meshHeight个网格,如果vertOffset为0,那么算上两端就有(meshWidth+1)*(meshHeight+1)个顶点,verts数组就应该至少长度为(meshWidth+1)*(meshHeight+1)。
代码不表了,ApiDemo里的其实很简单,只是不懂这个drawBitmapMesh原理的话,实在不好理解。总的来说,这个方法还是挺傻瓜的,基本不需要懂什么图形方面的知识就可以操作。