android SurfaceView

任何一个Android应用都必须有一个主启动程序来启动，我们这里把这个启动程序
　　命名为Movment,代码很简单如下：
   public class Movement extends Activity  {
    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(new MovementView(this));
    }


　　注意的是，我们这个启动程序不象其他程序一样，在启动的时候，在setContentView中传
　　入界面布局文件，而是直接将MovementView的实例传递进来，也就是说，直接启动了
　　MovementView这个类，在这个类中，我们将绘画我们的小球。

　　三、介绍SurfaceView
　　在Android中，SurfaceView是一个重要的绘图容器，它可以可以直接从内存或者DMA等硬件接口取得图像数据。通常情况程序的View和用户响应都是在同一个线程中处理的，这也是为什么处理长时间事件(例如访问网络)需要放到另外的线程中去(防止阻塞当前UI线程的操作和绘制)。但是在其他线程中却不能修改UI元素，例如用后台线程更新自定义View(调用View的在自定义View中的onDraw函数)是不允许的。
　　如果需要在另外的线程绘制界面、需要迅速的更新界面或则渲染UI界面需要较长的时间，这种情况就要使用SurfaceView了。SurfaceView中包含一个Surface对象，而Surface是可以在后台线程中绘制的。
　　在本文中，我们将使用它，直接通过代码创建一个小球，并且随着UpdateThread线程的更新，不断改变小球的位置，下面我们开始学习MovementView的编写，先看下如何运用SurfaceView。
　　首先导入SurfaceView及绘图的相关库文件，如下所示：
package example.movement;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.view.SurfaceHolder;
import android.view.SurfaceView;


　　接着，我们要继承SurfaceView并且实现SurfaceHolder.Callback接口，这是一个SurfaceHolder的内部接口，可以实现该接口获得界面改变的信息，代码如下，并且我们声明了一些成员变量：
public class MovementView extends SurfaceView implements SurfaceHolder.Callback {
    privateint xPos;
    privateint yPos;

    privateint xVel;
    privateint yVel;

    privateint width;
    privateint height;

    privateint circleRadius;
    private Paint circlePaint;

    UpdateThread updateThread;
}


　　而在MovementView的构造函数中，我们设置了小球的大小和在X,Y方向上的初始坐标，如下：
　　public MovementView(Context context) {
    super(context);
    getHolder().addCallback(this);

    circleRadius =10;
    circlePaint =new Paint();
    circlePaint.setColor(Color.BLUE);

    xVel = 2;
    yVel = 2;
}


　　接着我们来看下ondraw方法的编写，在这里，我们将绘画小球，并且每次都把画布Canvas的背景色设置为白色，以重新覆盖之前一帧，代码如下：
protected void onDraw(Canvas canvas) {

        canvas.drawColor(Color.WHITE);

        canvas.drawCircle(xPos, yPos, circleRadius, circlePaint);
    }


　　我们再来看下updatePhysics这个方法如何编写。这个方法的作用有两个：一是处理小球的运动，二是更新小球的实时位置，因为小球在屏幕中不断地运动，因此当小球到达比如屏幕绘画区域的顶端后，要被弹回，因此代码如下：
public void updatePhysics() {

//更新当前的x,y坐标
        xPos += xVel;
        yPos += yVel;

        if (yPos- circleRadius< 0 || yPos+ circleRadius> height) {

            
            if (yPos- circleRadius< 0) {

                //如果小球到达画布区域的上顶端，则弹回

                yPos = circleRadius;
            }else{

                //如果小球到达了画布的下端边界，则弹回

                yPos = height- circleRadius;
            }

            // 将Y坐标设置为相反方向
            yVel *=-1;
        }
        if (xPos- circleRadius< 0 || xPos+ circleRadius> width) {

            
            if (xPos- circleRadius< 0) {

                // 如果小球到达左边缘

                xPos = circleRadius;
            } else {

                // 如果小球到达右边缘

                xPos = width- circleRadius;
            }

            // 重新设置x轴坐标
            xVel *=-1;
        }
    }


　　最后我们看下surfaceCreated这个方法的代码，在这个方法中，主要是取得了可用的SurfaceView的区域的高度和宽度，然后设置了小球的起始坐标(将其设置在屏幕的正中央位置)，并且启动了UpdateThread线程，代码如下：
public void surfaceCreated(SurfaceHolder holder) {

        Rect surfaceFrame = holder.getSurfaceFrame();
        width = surfaceFrame.width();
        height = surfaceFrame.height();

        xPos = width/ 2;
        yPos = circleRadius;

        updateThread =new UpdateThread(this);
        updateThread.setRunning(true);
        updateThread.start();
    }


　　此外，我们要补上surfaceChanged这个方法，这个方法意思是界面尺寸改变时才调用，在我们这个应用中并没用到，所以我们保留为空的方法实现：
public void surfaceChanged(SurfaceHolder holder,int format,int width, int height)
    {

    }


　　而surfaceDestroyed方法中，主要实现的是界面被销毁时才调用，这里我们停止了当前的线程所处理的任务，这里使用了线程的join方法：
public void surfaceDestroyed(SurfaceHolder holder) {

        boolean retry= true;

        updateThread.setRunning(false);
        while (retry) {
            try {
                updateThread.join();
                retry =false;
            } catch (InterruptedException e) {

            }
        }
    }


　　归纳下，完整的MovementView代码如下：
　　package example.movement;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.view.SurfaceHolder;
import android.view.SurfaceView;

public class MovementView extends SurfaceView implements SurfaceHolder.Callback {

    privateint xPos;
    privateint yPos;

    privateint xVel;
    privateint yVel;

    privateint width;
    privateint height;

    privateint circleRadius;
    private Paint circlePaint;

    UpdateThread updateThread;

    public MovementView(Context context) {

        super(context);
        getHolder().addCallback(this);

        circleRadius =10;
        circlePaint =new Paint();
        circlePaint.setColor(Color.BLUE);

        xVel =2;
        yVel =2;
    }
    @Override
    protected void onDraw(Canvas canvas) {

        canvas.drawColor(Color.WHITE);
        canvas.drawCircle(xPos, yPos, circleRadius, circlePaint);
    }

    public void updatePhysics() {
        xPos += xVel;
        yPos += yVel;

        if (yPos- circleRadius< 0 || yPos+ circleRadius> height) {
            if (yPos- circleRadius< 0) {
                yPos = circleRadius;
            }else{
                yPos = height- circleRadius;
            }
            yVel *=-1;
        }
        if (xPos- circleRadius< 0 || xPos+ circleRadius> width) {
            if (xPos- circleRadius< 0) {
                xPos = circleRadius;
            } else {
                xPos = width- circleRadius;
            }
            xVel *=-1;
        }
    }

    public void surfaceCreated(SurfaceHolder holder) {

        Rect surfaceFrame = holder.getSurfaceFrame();
        width = surfaceFrame.width();
        height = surfaceFrame.height();

        xPos = width/ 2;
        yPos = circleRadius;

        updateThread =new UpdateThread(this);
        updateThread.setRunning(true);
        updateThread.start();
    }

    public void surfaceChanged(SurfaceHolder holder,int format,int width, int height) {
    }

    public void surfaceDestroyed(SurfaceHolder holder) {

        boolean retry= true;

        updateThread.setRunning(false);
        while (retry) {
            try {
                updateThread.join();
                retry =false;
            } catch (InterruptedException e) {
            }
        }
    }
}



　　四、编写UpdateThread
　　下面，我们开始着手编写UpdateThread线程程序。这个程序主要是启动一个线程去不断更新当前小球的位置。先看声明及构造函数部分：
package licksquid.movement;

import android.graphics.Canvas;
import android.view.SurfaceHolder;

public class UpdateThread extends Thread {
    privatelong time;
    private finalint fps = 20;
    privateboolean toRun= false;
    private MovementView movementView;
    private SurfaceHolder surfaceHolder;

}
public UpdateThread(MovementView rMovementView) {
        movementView = rMovementView;
        surfaceHolder = movementView.getHolder();
    }
　public void setRunning(boolean run) {
        toRun = run;
    }


　　注意这里的setRunning方法中设置了线程是否应该停止的标记，下面来看重要的方法run:
  public void run() {

        Canvas c;
        while (toRun) {

            long cTime= System.currentTimeMillis();

            if ((cTime- time)<= (1000/ fps)) {

                c =null;
                try {
                    c = surfaceHolder.lockCanvas(null);

                    movementView.updatePhysics();
                    movementView.onDraw(c);
                } finally {
                    if (c !=null) {
                        surfaceHolder.unlockCanvasAndPost(c);
                    }
                }
            }
            time= cTime;
        }
    }


　　在run方法中，主要实现了如下几个任务：首先检查是否有允许启动该线程(在开始运行后，由于在MovementView中，启动UpdateThread的时候，已经设置了其值为true,即updateThread.setRunning(true))，接下来检查是否在指定的时间内(这里设置的是每秒20帧)，如果是的话，则调用surfaceHolder的lockCanvas方法，锁定当前的画布绘画区域，并且调用movementView的updatePhysics方法及onDraw方法去画小球并判断小球的运动，最后记得要在finally中调用unlockCanvasAndPost方法。
　　五、运行程序

　　最后运行程序，可以看到如下的效果，可以看到小球在做各个方向的弹跳运动。

咱们就先看View这个类：

在View中你只需要重写onDraw这个方法就可以显示界面啦，在View中提供了许多事件方法，足以应付游戏中的事件处理，可以查阅API了解它的具体使用，下面我们通过一个实例来学习View：

新建项目新建Activity步骤这些就不说啦。

详细的说明都在程序注释中。

先看Activity

 

[java] view plaincopy

1. import android.app.Activity;  
2. import android.os.Bundle;  
3. public class ViewActivity extends Activity {  
4.     private MyView myView = null;  
5.     public ViewActivity() {  
6.     }  
7.     protected void onCreate(Bundle savedInstanceState) {  
8.         super.onCreate(savedInstanceState);  
9.         myView = new MyView(this);  
10.         setContentView(myView);  
11.         new Thread(new MyThread()).start();  
12.     }  
13.       
14.     class MyThread implements Runnable {  
15.         @Override  
16.         public void run() {  
17.             while(!Thread.currentThread().isInterrupted()) {  
18.                 try {  
19.                     Thread.sleep(100);  
20.                 } catch (InterruptedException e) {  
21.                     Thread.currentThread().interrupt();  
22.                 }  
23.             //在线程中更新界面  
24.             myView.postInvalidate();  
25.             }  
26.         }  
27.           
28.     }  
29. }  

 

再创建我们自己的View框架：

[java] view plaincopy

1. /* 
2.  * 一个不断闪烁并且不断放大的长方体 ，点击屏幕可以控制 
3.  */  
4. import android.content.Context;  
5. import android.graphics.Canvas;  
6. import android.graphics.Color;  
7. import android.graphics.Paint;  
8. import android.view.View;  
9. public class MyView extends View {  
10.     private int num = 0;  
11.     private float changeX = (float)30.0;  
12.     private float changeY = (float)10.0;  
13.     private float changeNum = (float) (23.0/13.0);  
14.     private boolean change = true;  
15.       
16.     private Paint paint = new Paint();  
17.     private int color = Color.DKGRAY;  
18.       
19.     public MyView(Context context) {  
20.         super(context);  
21.     }  
22.       
23.     //重写onDraw来实现界面的实现  
24.     @Override  
25.     protected void onDraw(Canvas canvas) {  
26.         //根据判断屏幕是否点击  
27.         //确定是否放大长方体和变化颜色  
28.         if(change) {  
29.             if(num<3) {  
30.                 num++;  
31.             }else {  
32.                 num=0;  
33.             }  
34.             //通过不同的num值设置不同的颜色  
35.             switch(num) {  
36.             case 0:  
37.                 color = Color.GREEN;  
38.                 break;  
39.             case 1:  
40.                 color = Color.BLUE;  
41.                 break;  
42.             case 2:  
43.                 color = Color.CYAN;  
44.                 break;  
45.             case 3:  
46.                 color = Color.RED;  
47.                 break;  
48.             }  
49.             changeX++;  
50.             changeY+=changeNum;  
51.         }  
52.         //绘制一个矩形  
53.         paint.setColor(color);  
54.         canvas.drawRect(this.getWidth()/2-changeX, this.getHeight()/2-changeY,   
55.                 this.getWidth()/2+changeX, this.getHeight()/2+changeY, paint);  
56.     }  
57. }  

得到的图像应该是一个不断放大且不断改变颜色长方体.因为是动态的就不放截图啦！

OK，View就简单的介绍到这里，大家还是可以自己写的别的功能增加对它的理解。

接来下是继承自View的SurfaceView框架：

 

在Activity中只要setContentView就OK啦！

 

[java] view plaincopy

1. import android.app.Activity;  
2. import android.os.Bundle;  
3. public class SurfaceViewActivity extends Activity {  
4.     @Override  
5.     protected void onCreate(Bundle savedInstanceState) {  
6.         super.onCreate(savedInstanceState);  
7.         setContentView(new MySurfaceView(this));  
8.     }  
9. }  

 

创建咱自己的SurfaceView：

 

[java] view plaincopy

1. import android.content.Context;  
2. import android.graphics.Canvas;  
3. import android.graphics.Color;  
4. import android.graphics.Paint;  
5. import android.view.MotionEvent;  
6. import android.view.SurfaceHolder;  
7. import android.view.SurfaceView;  
8. /* 
9.  * 一个不断闪烁并且不断放大的圆形，点击屏幕可以控制 
10.  */  
11. //实现SurfaceHolder.Callback接口对SurfaceView类进行创建、改变、销毁等监听  
12. public class MySurfaceView extends SurfaceView implements SurfaceHolder.Callback,Runnable{  
13.     boolean loop = false;  
14.     //SurfaceView没有SurfaceHolder啥都做不了  
15.     //SurfaceHolder接口控制着Surface的一切  
16.     SurfaceHolder surfaceHolder = null;  
17.     int count = 0;  
18.       
19.     private int num = 0;  
20.     //圆形半径每次增加的数值  
21.     private int changeNum = 1;  
22.     private boolean change = true;  
23.     private Paint paint = new Paint();  
24.     private int color = Color.DKGRAY;  
25.       
26.     public MySurfaceView(Context context) {  
27.         super(context);  
28.         surfaceHolder = this.getHolder();  
29.         surfaceHolder.addCallback(this);  
30.         this.setFocusable(true);  
31.         loop = true;  
32.     }  
33.       
34.     //Surface创建时调用该方法  
35.     @Override  
36.     public void surfaceCreated(SurfaceHolder arg0) {  
37.         //启动画图线程  
38.         new Thread(this).start();  
39.     }  
40.     //Surface大小改变时调用该方法  
41.     @Override  
42.     public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2, int arg3) {    
43.     }  
44.     //Surface销毁时调用该方法  
45.     @Override  
46.     public void surfaceDestroyed(SurfaceHolder arg0) {  
47.         //让画图线程停止  
48.         loop = false;  
49.     }  
50.     //画图线程的run方法  
51.     @Override  
52.     public void run() {  
53.         while(loop) {  
54.             draw();  
55.             try {  
56.                 Thread.sleep(200);  
57.             }catch (InterruptedException e) {  
58.                 e.printStackTrace();  
59.             }  
60.         }  
61.     }  
62.     private void draw() {  
63.         //先要对屏幕进行锁定，这是非常重要的！！！  
64.         Canvas canvas = surfaceHolder.lockCanvas();  
65.         //根据判断屏幕是否点击  
66.         //确定是否放大长方体和变化颜色  
67.         if(change) {  
68.             if(num<3) {  
69.                 num++;  
70.             }else {  
71.                 num=0;  
72.             }  
73.             //通过不同的num值设置不同的颜色  
74.             switch(num) {  
75.             case 0:  
76.                 color = Color.GREEN;  
77.                 break;  
78.             case 1:  
79.                 color = Color.BLUE;  
80.                 break;  
81.             case 2:  
82.                 color = Color.CYAN;  
83.                 break;  
84.             case 3:  
85.                 color = Color.RED;  
86.                 break;  
87.             }  
88.             changeNum++;  
89.         }  
90.         paint.setColor(color);  
91.         //绘制一个圆形  
92.         canvas.drawCircle((getWidth()/2), (getHeight()/2), 50+changeNum, paint);  
93.         //对Canvas解锁  
94.         surfaceHolder.unlockCanvasAndPost(canvas);  
95.     }  
96.     //屏幕点击事件绑定  
97.     @Override  
98.     public boolean onTouchEvent(MotionEvent event) {  
99.         //每次点击屏幕都会改变change的值  
100.         if(change) {  
101.             change = false;  
102.         }else {  
103.             change = true;  
104.         }  
105.         return super.onTouchEvent(event);  
106.     }  
107. }  

 

记住如果你先要lockCanvas()来获得Canvas这样你才能有画布来绘制你所要的界面，最后还要调用unlockCanvasAndPost()。这个可是很重要滴