用Creator实现一个擀面的效果

先上几张效果图

image.png image.png image.png

怎么实现的呢?

image.png

节点介绍

1是背景图,可以忽略;2 是准备好的面团;3 是擀好的面饼先隐藏;4 是需要绘制的节点;5 是擀面杖。

制作开始

image.png

  1. 首先在view上挂一个mask,并且设置为模板模式,sprite frame 就设置成那张擀好的面饼。这样的设置可以使Mask按照擀好面饼的形状遮罩内容。 image.png
  2. 在walpaper-layer 节点上挂在了一个我写好的有关于绘制图形的脚本文件,并设置好相关参数。这个脚本主要做的就是使用Graphics绘制图形。 image.png
  3. 在graphics节点上挂上Graphics组件提供给我的脚本使用。
  4. 使用擀面杖监听触摸事件,通过移动擀面杖并使用擀面杖的坐标(并不是触摸点的坐标)绘制圆形,设置绘制圆形的半径为80或者更大些,以便达到擀面饼的感觉。 image.png image.png
  5. 怎么判断面饼擀好了呢? 记录面饼九个点的坐标 image.png 判断擀面杖的坐标走过的点,走过一个移除一个,都走过之后就可以设置为完成了。 image.png
  6. 最后隐藏掉绘制的图案,面团,显示出来之前设置好的面饼,这个效果就算制作完成了。

长按下方二维码,关注《微笑游戏》公众号,获取更多精彩内容。

image

欢迎扫码关注公众号《微笑游戏》,浏览更多内容。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值