一、簡介
這是畫板系列的第一篇,一步步開始,從簡單的畫板,到功能稍微齊全一點的畫板,例如基本畫筆、橡皮擦、背景、文字、撤銷、反撤銷、保存等
這篇帶大家實現(xiàn)一個最簡單的畫板,前提是需要對自定義View有一定的了解。
用的是kotlin語言
二、實現(xiàn)
分析如何實現(xiàn): 定義了畫筆和Path,然后在觸摸屏幕的時候,手指一邊移動一邊進行path的滑動,繪制。這就完成了一個最簡單的畫筆功能。
下面幾十行代碼完成這個
class TPView(context: Context,attr:AttributeSet ) : View(context,attr) { private var preX: Float = 0.0f //上一次的觸摸點x坐標 private var preY: Float = 0.0f //上一次觸摸點y坐標 var mPath = Path() //path路徑 //畫筆 private var mPaint = Paint(Paint.ANTI_ALIAS_FLAG or Paint.DITHER_FLAG) init { //畫筆為實心 mPaint.style = Paint.Style.STROKE //顏色 mPaint.color = Color.RED //筆觸為圓形 mPaint.strokeCap = Paint.Cap.ROUND //畫筆大小 mPaint.strokeWidth = 10f //View的背景顏色 setBackgroundColor(Color.WHITE) } override fun onDraw(canvas: Canvas) { super.onDraw(canvas) //畫線 canvas.drawPath(mPath,mPaint) } override fun onTouchEvent(event: MotionEvent): Boolean { when(event.action){ MotionEvent.ACTION_DOWN -> { //手指按下的時候 //將起始點移動到當前坐標 mPath.moveTo(event.x,event.y) //記錄上次觸摸的坐標,注意ACTION_DOWN方法只會執(zhí)行一次 preX = event.x preY = event.y } MotionEvent.ACTION_MOVE -> { //手指移動的時候 //繪制圓滑曲線,即貝塞爾曲線,貝塞爾曲線這個知識自行了解 mPath.quadTo(preX,preY,event.x,event.y) preX = event.x preY = event.y } } //重新繪制,會調(diào)用onDraw方法 invalidate() return true }}
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
新聞熱點
疑難解答