上一篇大概的讲了下实现吸入吸出Mesh效果的简单例子,经过进一步研究,发现和百度阅读的仍有一定差距。
下面是最新研究的效果:
发现关键点在于滑动的同时,不只是Mesh的点发生变化。轨迹线也在变,所以在改变drawBitmapMesh 中的点时,需要改变线的轨迹。
增加一个改变线的函数:
<span style="font-size:24px;">public void buildPaths(int timeIndex){ float w = mBmpWidth; float h = mBmpHeight; mTimeIndex = timeIndex; mFirstPathMeasure.setPath(mFirstPath, false); mSecondPathMeasure.setPath(mSecondPath, false); float[] pos1 = {0.0f, 0.0f}; float[] pos2 = {0.0f, 0.0f}; float firstLen = mFirstPathMeasure.getLength(); float secondLen = mSecondPathMeasure.getLength(); float len1 = firstLen / mHorizontalSplit; float len2 = secondLen / mHorizontalSplit; float firstPointDist = timeIndex * len1; float secondPointDist = timeIndex * len2; mFirstPathMeasure.getPosTan(firstPointDist, pos1, null); mSecondPathMeasure.getPosTan(secondPointDist, pos2, null); w = mPathendX; Log.i("yunli", "timeIndex = " + timeIndex +", w = " + w); if(timeIndex < 4*mHorizontalSplit/10){ mThirdPath.reset(); mForthPath.reset(); mThirdPath.moveTo(pos1[0], h/2); mForthPath.moveTo(pos2[0], h/2); mThirdPath.cubicTo(pos1[0], pos1[1],w/8+pos1[0],10,3*w/8,10); mForthPath.cubicTo(pos2[0], pos2[1],w/8+pos2[0],h-10, 3*w/8, h-10); mThirdPath.quadTo((5*w ) / 8, 15, w, h/2-4); mForthPath.quadTo((5*w ) / 8,h-15, w, h/2+4); }else if(timeIndex == 4*mHorizontalSplit/10){ mThirdPath.reset(); mForthPath.reset(); mThirdPath.moveTo(pos1[0], h/2); mForthPath.moveTo(pos2[0], h/2); mThirdPath.cubicTo(pos1[0], pos1[1],5*w/8,15,w,h/2-4); mForthPath.cubicTo(pos2[0], pos2[1],5*w/8,h-15, w, h/2+4); }else{ mThirdPath.reset(); mForthPath.reset(); mThirdPath.moveTo(pos1[0], h/2); mForthPath.moveTo(pos2[0], h/2); mThirdPath.quadTo(pos1[0], pos1[1], w, h/2-4); mForthPath.quadTo(pos2[0], pos2[1], w, h/2+4); } }</span>思路是,先画出最原始的轨迹线,随着timeindex的变化,画出不同的线,而只有在画Mesh点的时候,
才将PathMeasure上放置第3和4条临时线,算临时线位置的时候永远取第一和第二条。上面的方法在上一篇文章中都有介绍,
主要是画贝塞尔曲线。
下载链接:
点击打开链接
http://download.csdn.net/detail/ahjxly/8554527