小程序-涂鸦画笔

Posted YAZI

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序-涂鸦画笔相关的知识,希望对你有一定的参考价值。

不同的项目总是要求不同的需求

wxml:

<canvas  canvas-id="myCanvas"  class="myCanvas"

      disable-scroll="false"

      bindtouchstart="touchStart"

      bindtouchmove="touchMove"

      bindtouchend="touchEnd">

</canvas>

 

js:

var canvasC ;   //声明一个全局变量,用于橡皮檫

 startX : 0;   //保存X坐标轴变量

 startY : 0;   //保存Y坐标轴变量 

//手指触摸动作开始

touchStart:function(e){

      //得到触摸点的坐标

    this.startX = e.changedTouches[0].x

    this.startY = e.changedTouches[0].y

    this.context = wx.createCanvasContext("myCanvas")

    canvasC = this.context;    //将画布保存进全局变量

    (未完待续。。。)

}

 

以上是关于小程序-涂鸦画笔的主要内容,如果未能解决你的问题,请参考以下文章

Android关于创建涂鸦板过程中出现的小问题

自定义view实现涂鸦(画板)功能

自定义view实现涂鸦(画板)功能

自定义view实现涂鸦(画板)功能

微信小程序项目实例——我有一支画笔(画画)

微信小程序画布与涂鸦案例