Android自定义表面视图在相机表面视图上绘制

Question

I first created a custom Surface View to draw things on; to visually describe, a green background on which I draw some lines and circles. Then, I decided to remove the green background and have a live camera preview as the background instead. This is what I tried, but could not get it working (below). What happens is, both the camera view and my custom surface view are being created, but only the camera view is being shown. I'm sure my custom Surface View is also created because I've a TouchListener in this custom view that prints x,y values when touched (and this happens). But my custom drawing is not being shown over the camera preview, as I want it to be. Please help!!

gameview.xml file:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/mainlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
</FrameLayout>

Camera View:

public class CameraView extends SurfaceView implements SurfaceHolder.Callback{



Camera camera;

public CameraView(Context context, Camera c) {
    super(context);
    camera = c;
    getHolder().addCallback(this);
    getHolder().setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS);
    // TODO Auto-generated constructor stub
}

public void surfaceCreated(SurfaceHolder arg0) {
    // TODO Auto-generated method stub
    try {
        camera.setPreviewDisplay(getHolder());
    } catch (IOException e) {
        // TODO Auto-generated catch block
        e.printStackTrace();
    }
    camera.startPreview();
}
}

Custom Surface View named VirtuaParkView: This is where I draw stuff using onDraw() method being called continuously from a thread. Also implements SurfaceHolder.Callback . Code not written here for brevity.

How it's all put together:

   CameraView cView = new CameraView(getApplicationContext(),Camera.open()); //get Camera View
   VirtuaParkView vParkView = new VirtuaParkView(getApplicationContext()); // get custom surface view
   setContentView(R.layout.gameview); //set the Frame layout
   FrameLayout fl = (FrameLayout)findViewById(R.id.mainlayout); // get the layout root
   fl.addView(cView); //add camera view
   fl.addView(vParkView,new  LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT)); //add custom drawing

Answer 1

I don't know what your VirtualParkView looks like but try using this custom View. It should draw a small green square where you touch it.

public class CameraOverlay extends View {

private static final Integer rectSize = 30;

Paint paint;

private Rect touchRect;

public CameraOverlay(Context context) {
    super(context);
    paint = new Paint();
    touchRect = new Rect(0,1,0,1);
}

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.FILL);
    paint.setColor(Color.WHITE);

    int height = canvas.getHeight();
    int width = canvas.getWidth();

    canvas.drawLine(width/2,0,width/2,height,paint);
    canvas.drawLine(0,height/2,width,height/2,paint);

    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(Color.GREEN);
    canvas.drawRect(touchRect, paint);
}

@Override
public boolean onTouchEvent(MotionEvent event) {

    Log.d(TAG, "CameraOverlay - onTouchEvent()");

    invalidate();

    if (event.getAction() == MotionEvent.ACTION_DOWN) {
        float x = event.getX();
        float y = event.getY();

        touchRect.left = (int) (x - rectSize);
        touchRect.top =(int) (y - rectSize);
        touchRect.right = (int) (x + rectSize);
        touchRect.bottom = (int) (y + rectSize);
    }
    return false;
}
}

Then, instead of your VirtualParkView, add this to your frame -

    if (mCameraOverlay == null)
        mCameraOverlay = new CameraOverlay(this);
    f1.addView(mCameraOverlay);