Egret社区
本帖最后由 gamedaybyday 于 2017-5-24 11:13 编辑

教程目录
一 演示效果
二 画布实现
三 画笔实现
四 橡皮擦实现
五 Demo

一 演示效果

这是一个很简单的画布,就是提供个思路。比如阴阳师画符

6.jpg

jdfw.gif

测试地址
PC:http://120.24.188.118/egret/canvasexample/
手机:
7.jpg

二 画布实现
画布是一个白色底的sprite,利用sprite的Graphics实现画笔和橡皮擦效果。


三 画笔实现
利用moveTol***To实现画笔。

当画笔再画布上触摸时,将画线的起始点moveTo移动到触摸点。
1.jpg

当画笔在画布上移动时,使用l***To画出线条
2.jpg

每一次移动都调用一次l***To,这样画布上画出了一条连续的线条
3.jpg


四 橡皮擦实现
因为画布Sprite是白色的底。橡皮擦就是白色的画笔画出白色的线条,这样看上去就像画布被擦干净了一样。

黑色的橡皮擦,看上去是这样。
    4.jpg

换成白色,那么画布就被“”擦干净“”了,其实是白色线条盖住了原来黑色的黑条。
      5.jpg


五 Demo


游客,如果您要查看本帖隐藏内容请回复




分享到 :
4 人收藏

26 个回复

倒序浏览
yung  初窥堂奥 | 2017-5-24 11:11:17
哈哈
不错,你的教程系列又+1
Lair  圆转纯熟 | 2017-5-24 11:16:12
looklook
Lair  圆转纯熟 | 2017-5-24 11:16:22
looklook
112169333  登堂入室 | 2017-6-16 15:57:31
秀秀呢  登堂入室 | 2017-6-19 14:49:51
666
Niteip  略有小成 | 2017-6-19 17:07:28
666
这个有意思
23king  圆转纯熟 | 2017-6-19 17:43:05
这个好玩.
wangqin5436  初学乍练 | 2017-6-19 17:43:35
6666
SvenBallet  登堂入室 | 2017-6-19 23:57:21
看看
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|京网文[2014]0791-191号|京ICP证150115号|Egret社区 ( 京ICP备14025619号

Powered by Discuz! X3.2 © 2001-2016 Comsenz Inc.

返回顶部