先看效果圖
今天使用surfaceview進行了一個畫板功能的實現,還是比較簡單的,說說思路:建立一個surfaceview控件,然後增加callback回調,響應觸摸事件,調用畫布,畫筆等工具,最後完成。
下面是佈局代碼:
<app.drawdemo.MyView android:layout_width="match_parent"
android:id="@+id/surfaceView"
android:layout_height="0dp"
android:layout_weight="1"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/button"
android:text="清除畫板"/>
自定義了一個MyView繼承surfaceView,然後在xml文件中調用它。
MyView代碼:
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
/**
* Created by 不告訴你 on 15/7/31.
*/
//注意Callback函數要調用(android.view.SurfaceHolder)的
public class MyView extends SurfaceView implements SurfaceHolder.Callback,View.OnTouchListener {
private Paint paint=new Paint();
private Path path=new Path();
public MyView(Context context) {
super(context);
//初始化
initSurfaceView(context);
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
initSurfaceView(context);
}
public MyView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initSurfaceView(context);
}
void initSurfaceView(Context context){
getHolder().addCallback(this);
//初始化畫筆
paint.setColor(Color.BLUE);
//畫筆大小
paint.setTextSize(20);
paint.setStyle(Paint.Style.STROKE);
//設置監聽
setOnTouchListener(this);
}
//繪製方法
public void draw(){
//鎖定畫布
Canvas canvas=getHolder().lockCanvas();
canvas.drawColor(Color.WHITE);
canvas.drawPath(path,paint);
//解鎖畫布
getHolder().unlockCanvasAndPost(canvas);
}
@Override
public void surfaceCreated(SurfaceHolder holder) {
//在surfaceview初始化時調用
draw();
}
@Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
}
@Override
public void surfaceDestroyed(SurfaceHolder holder) {
}
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()){
//按下事件,開始繪製
case MotionEvent.ACTION_DOWN:
//獲取按下點的x,y座標
path.moveTo(event.getX(),event.getY());
//繪製
draw();
break;
case MotionEvent.ACTION_MOVE:
//移動使用lineto()
path.lineTo(event.getX(),event.getY());
draw();
break;
}
//返回true,否則只能響應down事件
return true;
}
//清理畫布
public void clear(){
//路徑重置
path.reset();
//重新鎖定,否則不能再次繪畫
draw();
}
}
代碼解釋很清楚,就不在講述了
接下來是主activity
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
public class MainActivity extends AppCompatActivity {
private Button button;
private MyView myView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button= (Button) findViewById(R.id.button);
myView= (MyView) findViewById(R.id.surfaceView);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//調用清除路徑重置方法
myView.clear();
}
});
}
}