Scratch 之 3D 画笔程序使用

这篇具有很好参考价值的文章主要介绍了Scratch 之 3D 画笔程序使用。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目录

Part1 摄像头固定的3D效果

Part2 尝试移动摄像头

Part3 边缘裁剪

总结:


Part1 摄像头固定的3D效果

首先,我们知道sc中有xy坐标。
现在让我们在sc中引入一个新坐标——z坐标。z轴垂直于电脑屏幕,从屏幕外指向屏幕里。(如下图)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

z坐标表示纵深,就是这个角色在屏幕内的深度。
z坐标越大,表示角色离屏幕所在平面越远,因为近大远小,z越大,物体看起来会越小;当z为0,物体刚好在屏幕面内;当z为负数表示角色跑到了屏幕外面,看不到。

为了方便你理解z坐标的含义,现在我们来看通过增减z坐标能够实现什么效果↓

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

可以看到,z坐标增加时,小猫远离屏幕,小猫变小;z坐标减小时,小猫靠近屏幕,小猫变大

下面第一个重头戏来了!!
接下来将向你展示实现3D的的代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

是的!你没有看错!代码只有一行!!!

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

使用这个代码可以让角色移动到对应的坐标
其中变量“#3D常数”设为350(也可以是其他的值,不同的值效果不同)
(接下来告诉你为什么是这么写,这一段不重要,听不懂也没关系)
————————————下面这一段可以跳过———————————————
(以下是我个人理解,非常不专业,请不要完全相信)
这个#3D常数(前面的#号是我的变量命名习惯,表示这个变量是常数)是什么?
在初中我们学过凸透镜成像原理,这个常数是像距——成像到凸透镜的距离。
以人眼为例,像距就是视网膜到晶状体的距离,这个距离是个定值,当然,如果像距是固定的,焦距就要随物距改变,所以晶状体会具有伸缩调焦的功能。
已知一个物体的长度和这个物体到凸透镜的距离,我们就能算出这个物体的成像的长度(屏幕上显示的长度)。
根据凸透镜成像原理和相似三角形,有如下关系:
实际长度:显示长度=物距(物体到凸透镜距离):像距(成像到凸透镜长度)
把这个式子变形一下,就是:
显示长度=实际长度*(像距/物距)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

因此在代码中,我们看到:
显示y=实际y*(像距/z)
显示x=实际x*(像距/z)
显示大小=实际大小*(像距/z)
(你发现多了一行调大小的代码?当然,如果只使用画笔,大小可以不用调整;如果要使用角色,角色大小也要调整)

同时,上面的式子也可以解释为什么“近大远小”:
显示大小与z成反比例关系,z越大,显示大小越小,即物体离屏幕越远,物体看起来就越小
————————————接下来继续————————————

那么这个代码具体可以怎么用呢?
首先,如果让你在sc中用画笔绘制一个正方形,边长为100,左下角坐标为(0,0),你应该知道怎么做吧?
就像这样:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

那么现在举一反三,我们来尝试用刚才的代码在三维空间中画一个正方形:边长为100,“放”在“地面”上(“地面”y坐标假设设为-150),正方形左下角坐标(-150,-150,300),你知道怎么画吗?
可以这样写:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

运行效果:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

怎么样?是不是很像某个正方体的底面?
那么现在,我们以这个正方形为底面,绘制出一个完整的正方体...
首先我们来尝试画正方体的左侧面,类似于刚才底面的画法,你应该明白怎么画吧?
像这样:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

其他面的代码同理。接着我们把其他面依次画完...
(Tips:可以直接画边,不用每个面都写一个绘制代码)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

怎么样?是不是有内味了!好了,到这里,你已经掌握了实现3D的基本内容了
怎样,是不是意外的简单?
如果你听懂了,尝试自己画一个正方体。

————————————练习时间———————————————
(接下来是运用刚才的知识可以实现的几个案例练习,如果你听懂了,可以尝试自己做一下)
案例1:让正方体动起来!
预期效果:按wasd可上下左右移动正方体,↑↓键可前后移动正方体
具体过程:我们用三个变量:左下x,左下y,左下z来储存正方体左下角的坐标,然后编写程序,按对应的按键就增减正方体对应的坐标(例如按↑键增加z坐标,↓键减少z坐标)
实现结果↓

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

参考代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

案例2:画个圆吧!
预期效果:画个铺在“地上”的圆(“地面”y:-150(当然你也可以自己设置)),半径100,圆心(-40,-150,500)
Tips:首先我们先尝试在sc自带的坐标系中尝试画圆(注意,需要用到三角函数!)
(即使在二维平面画出一个圆,代码其实也不简单↓,因此需要各位在阅读此教程之前需要比较扎实的基础)
(其实也可以不用三角函数,用勾股定理也可以)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

我们对上面的代码稍作修改:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

效果↑

(平放在“地上”的圆看起来像个椭圆)

案例3:画个马路!(可以用来做公路跑酷游戏)
代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

效果↑


Part2 尝试移动摄像头

首先什么是摄像头?
摄像头是指当前视野的位置,移动摄像头就是移动视野。用xyz三个坐标储存摄像头的位置。在上面的教程中,其实相当于摄像头的x、y、z的值均为0的视野。
当摄像头向右移动,摄像头的x增加,视野往右移动,反之,往左移动时,摄像头的x减小;
同理,上下移动就是增加和减小摄像头的y坐标;前后移动就是增加和减少摄像头的z坐标。

实现摄像头移动效果的代码其实非常简单:
首先新建三个变量,命名为摄像头x,摄像头y,摄像头z

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

然后对之前的代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

中的“x”,”y”,”z”进行下面的替换

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

改为:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

然后,通过修改“摄像头x”“摄像头y”“摄像头z”就可以实现摄像头(即视野)的移动了。例如增减摄像头的x来向右和向左移动视野。


为什么这么做可以实现摄像头的移动呢?

如果你有制作“大地图”游戏的基础的话,上面的内容会很好理解。

例如,下面的作品的摄像头移动

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程


用的就是类似下面的代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

比如,一个角色在地图上的坐标是(100,100),摄像头的坐标是(60,60),这时,角色实际在屏幕上显示的坐标为(40,40),即用角色的实际地图坐标减去摄像头的坐标,得到角色相对于摄像头的位置。

因此,我们进行下面的替换,得到的就是角色相对摄像头的坐标,即角色显示的坐标。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

现在,我们来写移动摄像头的代码吧!
(其中绘制正方体的代码是之前写过的代码)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

我们来看其中的这段新代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

注意到摄像头的y初始为100,这是因为,游戏中的角色有一定的高度,这里的就是角色的视角到地面的高度。
绘制的立方体的y坐标为0,即把立方体放在地面上。

上面的代码很简单,就像移动一个角色一样,你应该很容易理解。


接下来我们来尝试加个跳跃效果:
如果你知道如何在2D的游戏中实现重力和跳跃效果,下面的代码将会非常好理解。
首先新建一个变量叫yv

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

其中v是速度的意思。yv就是y方向的速度,就是纵向速度。

下面的代码实现了重力和跳跃效果。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

yv是纵向速度,因此在每次循环中,摄像头的y都增加了yv,当yv为正值,角色将向上移动,当yv为负值,角色将向下移动。


因为受到重力的影响,yv每次循环都会减少一定的值。当角色跳起(按下空格),将角色的yv设为10,即设置一个向上的速度,此后角色以该速度上移,并且随着时间的增加,上移的速度减小(yv减小),最终yv减少到0,角色不再上移,达到最高点。之后,yv还在减少,减少到负数,这时,角色开始下落。

下面的代码是角色落地后的代码。因为角色的高度是100,当角色落到地面上时,角色的y是0,但是摄像头固定在“头”上,高度是100。所以当摄像头y<100时,才判断为落地。之后将摄像头y设为100,即移到地面。落到地面后,没有纵向速度,将yv设为0。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

于是,我们实现了移动,以及跳跃的效果。按WASD,摄像头就能前后左右移动;按下空格键,就可以跳跃。


Part3 边缘裁剪

(前排提醒:这一部分略难,我写的也比较凌乱,如果看不懂的话,可以跳过具体写代码的过程,只要知道最后的自定义模块怎么用就行了。)

  不知道你在运行之前的代码,移动正方体时是否遇到这样的问题:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  可以看到,当正方体移动到边缘时,发生了变形。
  这是怎么回事呢?
  我们知道,Scratch的舞台是有范围的,x坐标范围是-240~240,y坐标的范围是-180~180,当scratch角色移动到边缘时,会受到舞台限制。
  例如运行这个代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  得到的结果是:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

因为受到舞台限制,角色没有移动到(1000,1000)而是移到了(290,218)
  (不同角色由于造型的大小不同,可能得到的结果不同。造型大的角色受到的约束会更小;当使用空造型,得到的结果则是240,180)
  
  因此,当我们运行下面这段代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

我们希望得到的是下图中绿色的线(一条45°倾斜的线),可是实际运行的结果确实红色的线。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

绿色是我们希望的绘制结果,红色是实际绘制结果

  因此,我们需要对绘制的线段进行裁剪(裁剪的意思就是把跨越屏幕边缘的线段裁剪为只剩下屏幕内的线段):

具体步骤为:
  当线段两端在屏幕内,直接画出;
  当线段两端都在屏幕外,不用画出;
  而当线段两端有一端在屏幕外,一段在屏幕内,就求出这个线段和屏幕边缘的交点,然后最后实际画出的线段就是从屏幕内的端点到交点的线段。(例如上面绘制的线段是(0,0)到(1000,1000),则实际画出的是(0,0),(180,180),即和屏幕上方边缘的交点)。
  如果未经裁剪的绘制线段的写法是这样:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  则经过裁剪的绘制线段的代码是这样:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

看起来有亿点复杂

这段代码看不懂具体的过程没有关系,只要知道如何使用就行了。上面的代码用于绘制一条线段,并且当线段跨过屏幕边缘时,也能正确绘制。

  (上面的代码取自国外一个大佬的3D教程中的代码。我自己也写了一个裁剪,但是写的太复杂了……上面的写法应该是算比较简单的写法了。
  (建议直接使用上面的代码,不要自己写;当然如果你想挑战一下自己,也可以尝试自己写一个裁剪的代码)

  运行下面的代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  可以看到绘制出来的线段是正确的。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

正确的结果

  现在,我们再把之前绘制立方体的代码进行修改:
  首先写一条绘制3D线段的代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  前面我们分析过了,当线段的端点跑到屏幕外时,上面代码的画法是有问题的。因此我们需要用到刚刚写的这个代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

(这个代码绘制的是2D线段)

修改之后:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

补充说明:
  (三维空间中一个点在Scratch舞台上绘制时的二维坐标,称为这个点的投影)
  例如下面的两个黑圈中就是点(x,y,z)对应的投影的(x,y)坐标(在舞台上实际绘制的坐标)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  同样,下面的起点x,起点y是点(x1,y1,z1)对应的投影坐标

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

然后把之前绘制立方体的代码换成依次绘制每条边的代码。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  这样当立方体移动到边缘时,就不会变形了。


  但是!
  现在还有一个问题:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  当立方体靠近屏幕时,也会变形。这是因为,立方体的边和屏幕所在平面产生了交点,正方体有一部分跑到了屏幕外面。
  前面我们进行的是x和y方向的裁剪。接下来,我们还需要进行z方向的裁剪。
  具体步骤:
  如果两端点都在屏幕内(两端点的z都大于摄像头z),则使用我们之前写的画线段的代码直接画出);
  如果两端点都在屏幕后面(两端点的z都小于摄像头z),则不用画;
  如果两端点一端在屏幕内,一端在屏幕外,则这条线段和屏幕产生了交点,实际画出的线段为从屏幕内的端点到交点的线段。

具体的代码:

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

看起来也有亿点多

  接下来要做到,就是求交点的坐标。
  使用下面的代码求线段和平面z的交点
  (其中线段的端点坐标填相对摄像头的坐标,平面的z为相对摄像头)

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

(这里求出的是交点的三维空间的相对摄像头xy坐标,而非投影xy坐标。交点的z为平面的相对摄像头z)

  上面的代码大致的原理是相似三角形,不理解没关系,会用就行了。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

最终代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

一些注释

  完成上面的代码后,现在当正方体和摄像头平面有交点时也不会变形。
  现在,使用下面的这个代码绘制3D线段,无论何种情况,画出的线段都不会变形了。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

  学完以上的内容,你已经掌握了画笔3D的理论知识的一半了!即除了旋转摄像头,你已经掌握了其他关于画笔3D的大部分内容!


总结

Part1:核心代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

Part2:核心代码

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

Part3:核心代码

下面这段代码用于Scratch中绘制线段,并且当线段跨越舞台边缘时,对进行X和Y的裁剪,只绘制舞台内的线段,从而正确绘制。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程

下面这段代码用于绘制3D的线段。并且带有裁剪功能(当线段的一部分在摄像头后面时,进行Z的裁剪,只绘制摄像头前的线段,从而正确绘制)。

scratch3d游戏,Scratch 热门作品专栏,scratch,青少年编程文章来源地址https://www.toymoban.com/news/detail-744797.html

到了这里,关于Scratch 之 3D 画笔程序使用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 消除字母Scratch-第14届蓝桥杯Scratch省赛真题第6题

    编程实现:消除字母。 具体要求: 1). 点击绿旗,角色、背景如图所示(创建1个字母表,并存入26个字母); 2). 等待1秒,阿拉蕾说:\\\"请输入一个字母\\\",舞台下方出现询问框; 3). 当在询问框中输入一个字母表中存在的字母,等待1秒,阿拉蕾将此字母和它的前两项与后两

    2024年02月02日
    浏览(38)
  • scratch飞机大战

    今天scratch作品是飞机大战。 我们做一个基础版的飞机大战,要实现的操作有:我们的飞机可以按左右键进行左右移动,但是不能上下移动,然后飞机一直在发射子弹,如果子弹碰到下落的敌机就可以获得得分,如果被敌机碰到了就算失败,游戏结束。 首先第一步,我们要从

    2024年02月09日
    浏览(64)
  • scratch 鼠标控制角色移动

    scratch 鼠标控制角色 本程序使用鼠标操作“机器人”角色跟随鼠标,距离较小时暂停移动;“小狗”角色连续在随机位置生成、水平移动、碰到边缘反弹、碰到“机器人”角色时删除。 目前scratch程序的制作已经告一段落了,进一步开发需要更多规划。本人整体感受是scratch程

    2024年02月12日
    浏览(32)
  • 【2023/05/09】Scratch

     Hello!大家好,我是霜淮子,2023倒计时第4天。 The mighty desert is burning for the love of a blade of grass who shaks her head and laughs and flies away. 译文: 无垠的沙漠热烈追求一叶绿草的爱,她摇摇头笑着飞开了。 If you shed tears when you miss the sun,you also miss the stars. 译文: 如果你因失去了太阳

    2024年02月03日
    浏览(33)
  • Scratch 画画的技巧

            美术是一种艺术,且不局限于纸张,就像电脑绘图也属于美术。我至今已有三年多的画龄,经验丰富,尤其擅长在scratch造型编辑器上画矢量图。今天给大家分享一些实用的技巧。 用橡皮工具给一个圆擦出“橡皮洞”         橡皮工具,这是我们再熟悉不过的

    2024年02月10日
    浏览(28)
  • scratch源码下载 | 几何冲刺

    程序说明: 《几何冲刺》是一款基于Scratch平台开发的跑酷类游戏程序。在这个游戏中,玩家控制一个黄色的小方块,在快速向前冲刺的过程中躲避各种障碍物。通过按下键盘上的上方向键,玩家可以操作小方块进行跳跃,以避开途中的障碍。游戏的目标是尽可能让黄色小方

    2024年02月19日
    浏览(66)
  • Scratch 之 制作超丝滑 FNF 推条

    这个教程是不用画笔的,所以不用担心推条是最后一层了! 导入素材         你以为真是这样吗?NO,NO,NO,其实是这样的         没错,中间是空的!中间是空的!中间是空的!(重要的话说3遍)         然后,新创一个造型         接着,把这个在分成两

    2024年02月12日
    浏览(35)
  • Decision Trees from scratch using Python

    作者:禅与计算机程序设计艺术 决策树(decision tree)是一种机器学习方法,它可以用来分类或回归问题。它可以用来解决多种复杂的问题,包括预测性分析、分类问题、回归问题等。本文将从零开始实现决策树算法,并使用Python语言实现该决策树。 决策树算法由多颗子树组

    2024年02月07日
    浏览(41)
  • 第11届蓝桥杯Scratch选拔赛真题集锦

    目录 一、编程题 第11届蓝桥杯Scratch选拔赛真题集锦   一、编程题 第 1 题 问答题 马克思的手稿 题目说明 背景信息: 马克思手稿中有一道趣味数学问题: 有30个人,其中有男人、女人和小孩。在一家饭馆吃饭共花了50先令;每个男人花了3先令,每个女人花了2先令,每个小孩花了

    2024年02月05日
    浏览(36)
  • 莲花-第10届蓝桥杯Scratch选拔赛真题精选

    [导读]:超平老师计划推出 Scratch蓝桥杯真题解析100讲 ,这是超平老师解读Scratch蓝桥真题系列的第 99 讲。 蓝桥杯选拔赛每一届都要举行4~5次,和省赛、国赛相比,题目要简单不少,再加上篇幅有限,因此我精挑细选了一部分题目进行解读。 莲花, 本题是第10届蓝桥杯Scratc

    2024年02月04日
    浏览(48)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包