我们如何定义动态(抛物线曲线)ViewObject的路径(Bitmap)

Question

我目前正致力于One 2D Android游戏,

在这个游戏中,一个ViewObject(位图)在抛物线路径上移动屏幕就像在这个图像中一样,但是这个路径是静态的,静态路径在画布上绘制了Fingure,

与签名图相同.

位图移动代码在此静态路径上

//animation step
private static int iMaxAnimationStep = 900;
private int iCurStep = 0;
private Path ptCurve = new Path(); //curve
private PathMeasure pm;            //curve measure
private float fSegmentLen;         //curve segment length


 //init smooth curve
    PointF point = aPoints.get(0);
    ptCurve.moveTo(point.x, point.y);

    for(int i = 0; i < aPoints.size() - 1; i++){
        point = aPoints.get(i);
        PointF next = aPoints.get(i+1);
  ptCurve.quadTo(point.x, point.y, (next.x + point.x) / 2, (point.y + next.y) / 2);
    }

    pm = new PathMeasure(ptCurve, false);
    fSegmentLen = pm.getLength() / iMaxAnimationStep;//20 animation steps

    //animate the Bitmap
    Matrix  mxTransform = new Matrix();
    if (iCurStep <= iMaxAnimationStep) 
    {          

        pm.getMatrix(fSegmentLen * iCurStep, mxTransform,
                PathMeasure.POSITION_MATRIX_FLAG);
        mxTransform.preTranslate(-Bitmap.getWidth(), -Bitmap.getHeight());


       canvas.drawBitmap(Bitmap, mxTransform, null);

        iCurStep++; //advance to the next step
        mPauseViewHandler.post(mPauseViewRunnable);
    } else {
        iCurStep = 0;

    } 

但我的问题是我想移动此ViewObject(位图)在动态路径(抛物线曲线) 和动态弯曲路径将在任何设备中工作.

我搜索了很多,但我找不到解决方案如何获得动态路径(抛物线曲线).

救命!如果你有任何解决方案,建议,想法,关于这篇文章的教程是最受欢迎的.

Answer 1

aPoints根据您的屏幕尺寸填充数组非常简单,并根据这些点获得抛物线路径.我删除了所有的位图/动画代码,下面的代码将计算路径并在屏幕上绘制它.

我们需要一个新变量来设置屏幕中我们想要的曲线数量.如果您愿意,可以轻松更改数学并定义曲线的大小.

private int numberOfCurves = 5;

有了它,每个抛物线计算3个点很简单:

public void calculatePoints(){
        float w = v.getWidth(); //Screen width
        float h = v.getHeight(); //Screen height
        float curveSize = w/numberOfCurves; // Curve size
        float curveHeight = (h/100) * 20; //80% of the screen size
        Log.d(TAG,"h:"+h +" - w:" + w); 
        float lastX = 0; //last used X coordinate
        for (int i=0;i<numberOfCurves;i++){  //for each curve we'll need 3 points
            float newX = lastX + curveSize; 
            PointF p = new PointF(lastX, h); //first point is the last point                
            PointF p1 = new PointF((lastX + newX)/2, curveHeight); //the middle point is halfway between the last and the new point
            PointF p2 = new PointF(newX,h); // the new point is last point + the size of our curve
            aPoints.add(p);  //fill in the array 
            aPoints.add(p1);
            aPoints.add(p2);
            lastX = newX; //update last point
        }

            //log our points
        for (PointF p : aPoints){
            Log.d(TAG,p.x +"-"+p.y);                
        }
    }

现在我们有一组定义每个抛物线的点,我们需要绘制它.而不是使用quadTo,使用cubicTo.它需要3个点并绘制连接它们的曲线.把它放在画上,然后在屏幕上绘制抛物线.

private Path ptCurve = new Path(); //curve
        @Override
        public void onDraw(Canvas canvas) {
            calculatePoints();

            Log.d(TAG,"DRAWING");
            PointF point = aPoints.get(0);
            ptCurve.moveTo(point.x, point.y);
            for(int i = 0; i < aPoints.size() - 1; i+=3){
                point = aPoints.get(i);
                PointF middle = aPoints.get(i+1);
                PointF next = aPoints.get(i+2);
                ptCurve.cubicTo(point.x, point.y, middle.x,middle.y, next.x , next.y);
            }

                canvas.drawPath(ptCurve, paint);            
        }

因此,您的ptCurve变量现在填充了抛物线路径,具有您之前定义的尽可能多的曲线,并且它将适用于任何屏幕尺寸.