十分钟学会Scratch图形化编程
一、概要
Scratch是麻省理工学院开发的供儿童或者初学者学习编程的开发平台。其通过点击并拖拽的方式,完成编程,可以使儿童或者成人编程初学者学习编程基础概念等。Scratch是一款积木式图形编程软件。

使用 Scratch,你可以编写属于你的互动媒体,像是故事、游戏、动画,然后你可以将你的创意分享给全世界。

Scratch 帮助年轻人更具创造力、逻辑力、协作力。
Scratch是MIT媒体实验室终生幼儿园小组开发的一个免费项目。
Scratch 已翻译成60种以上的语言,在超过 150 个国家被使用。
二、开发环境
截止到2021年已有1.4版、2.0版本(增加克隆积木,视频侦测,Lego拓展积木)、3.0版本(增加文字朗读、翻译和Makey makey等选择性下载扩展积木,并增加micro:bit和Lego mindstorms EV3拓展积木)
scratch 1.4、scratch 2.0、Scratch 3.0软件分别是用Smalltalk、flash、html5开发的。
2.1、在线开始
打开官网,点击“开始创作”,也可以直接点击:https://scratch.mit.edu/projects/editor/

初始化完成后就可以在线开发了,界面与离线版类似

2.2、PC开发
该工具支持Windows、Mac OS、Chrome OS操作系统,最新版本对操作系统的要求如下:
- Windows 10+
- macOS 10.13+
- ChromeOS
- Android 6.0+
测试发现Windows 7下也可以安装3.0版本(Scratch 3.20.1 Setup.exe)

最新版下载地址:https://scratch.mit.edu/download
网盘下载地址:https://pan.baidu.com/s/1Lu4TCueEFsxn6_0ZGepa-w
提取码:0e54

3.3、平板开发
目前的 Scratch Android 版本只支持平板电脑,不可以在手机中开发。
应用商店地址:https://play.google.com/store/apps/details?id=org.scratch


三、Scratch基础
安装好软件后就可以直接运行了

点击“控制”中选择“重复执行”,拖到“脚本”窗口

根据积木的颜色拼出如下的脚本

点击“全屏”预览效果

效果如下:

积木、脚本与角色是Scratch的主要组成。


每个角色拥有自己的脚本、造型、声音,舞台拥有脚本、背景、声音

四、发布项目
https://sheeptester.github.io/words-go-here/scratch3-htmlifier/ 网站Upload project上传本地sb3文件,或者先把本地sb3文件上传到mit scratch社区上,得到一个项目号Project ID。选择HTMLify without minification(recommended)如下图所示,完成后会下载得到文件ball.html。
信息填写好后可以下载html文件到本地

- https://nwjs.io/ 下载稳定版压缩包, 目前版本nwjs-v0.39.3-win-x64.zip. 解压后,把之前下载的ball.html移动到这个解压后的目录。并在该目录下建立一个icon.png图标文件,以及配置文件package.json文件,其json内容示例:项目名字,主程序文件,图标。
{
"name": "ball",
"main": "ball.html",
"icons": { "128": "cake.ico"}
}双击运行nw.exe,就可以打开sb3转换成的exe可执行文件了

- http://revocue.cz/en/make-sfx/index.php 下载makesfx.exe,可以把nw.exe所在目录所有的文件制作成一个exe文件,可以定制文件名和图标。

五、开发小游戏
这个游戏就是我们移动挡板,使小球来回弹动不落地。
下图就是我们的游戏界面。

第一步:背景

怎样才能检测小球落地呢,我们在舞台底部做个标记,画一道其他颜色的矩形区域,使用
这块积木侦测颜色,然后判定是否落地。
第一步:挡板与小球

首先把小猫角色删除掉。
挡板--绘制一个新角色,在中心位置绘制一个图上类似的矩形就可以,一定要在中心位置,也可以试一下不再中心位置绘制是什么样。可以填充你自己喜欢的颜色。

挡板的积木,首先移动到中心靠下的位置,重复执行为随鼠标的X坐标移动。
小球--从角色库中选一个球类的角色。

首先,移动到中心顶部的位置,设定一个大致的方向(还可以设置其他方向吗?自己试一下)。

然后按照方向移动,要加上“碰到边缘就反弹”,不然跑走回不来了。

在加上判定,碰到挡板,随机方向(可以设置其他数值吗?)反弹;落地,停止脚本。



加上声音效果是不是更好呢。

六、学习资料
链接:https://pan.baidu.com/s/1u22hgtY1ZZlKHm4S9DHbag
提取码:2670
网盘下载地址:https://pan.baidu.com/s/1Lu4TCueEFsxn6_0ZGepa-w
提取码:0e54
七、视频
十分钟学会Scratch图形化编程的更多相关文章
- 08.十分钟学会JSP传统标签编程
一.认识标签 1,说明:传统标签编程在开发中基本用不到,学习标签编程主要还是为了完善知识体系. 2,标签的主要作用:移除或减少jsp中的java代码 3,标签的主要组成部分及运行原理 4,简单标签示例 ...
- PHP学习过程_Symfony_(3)_整理_十分钟学会Symfony
这篇文章主要介绍了Symfony学习十分钟入门教程,详细介绍了Symfony的安装配置,项目初始化,建立Bundle,设计实体,添加约束,增删改查等基本操作技巧,需要的朋友可以参考下 (此文章已被多人 ...
- java图形化编程
转载 学习Java Swing图形化编程,我们首先要了解三个最基本的概念:顶层容器,控件,布局. 下面就来介绍一下这三个基本概念 1.顶层容器 什么是顶层容器?当我们使用Java进行图形编程的时候,图 ...
- arduino图形化编程——ardublock
下载地址:http://sourceforge.net/projects/ardublock/ 项目主页:https://github.com/taweili/ardublock 运行效果图 ardu ...
- 三十二、Java图形化界面设计——布局管理器之CardLayout(卡片布局)
摘自 http://blog.csdn.net/liujun13579/article/details/7773945 三十二.Java图形化界面设计--布局管理器之CardLayout(卡片布局) ...
- Sikuli:创新的图形化编程技术
Sikuli是一种使用截图进行UI自动化测试的技术.Sikuli包括sikul脚本,基于Jython的API以及sikuli IDE.Sikuli可以实现任何你可以在显示器上看到ui对象的自动化,你可 ...
- ROS(indigo) 用于机器人控制的图形化编程工具--code_it robot_blockly
0 简介: 编程语言有汇编,高级语言,解释语言等,现在图形化编程也越来越流行.图形化编程简单易学.8年前,微软推出了VPL用于机器人程序设计,如Python和JavaScript都可以用图形化框图实现 ...
- Kittenblock画笔基础,移动留下痕迹的蝴蝶,图形化编程经验分享
Kittenblock画笔基础,移动留下痕迹的蝴蝶,图形化编程经验分享 跟很多学生聊过,很多学生不是不努力,只是找不到感觉.有一点不可否认,同样在一个教室上课,同样是一个老师讲授,学习效果迥然不同.关 ...
- 图形化编程娱乐于教,Kittenblock实例,为背景添加音乐
图形化编程娱乐于教,Kittenblock实例,为背景添加音乐 跟很多学生聊过,很多学生不是不努力,只是找不到感觉.有一点不可否认,同样在一个教室上课,同样是一个老师讲授,学习效果迥然不同.关键的问题 ...
随机推荐
- codeforces 2C(非原创)
C. Commentator problem time limit per test 1 second memory limit per test 64 megabytes input standar ...
- POJ3233 构造子矩阵+矩阵快速幂
题意:给你矩阵A,求S=A+A^1+A^2+...+A^n sol:直接把每一项解出来显然是不行的,也没必要. 我们可以YY一个矩阵: 其中1表示单位矩阵 然后容易得到: 可以看出这个分块矩阵的左下角 ...
- React 17 All In One
React 17 All In One v17.0.1 https://reactjs.org/blog/2020/10/20/react-v17.html https://reactjs.org/b ...
- Webpack 4.x 默认支持 ES6 语法
Webpack 4.x 默认支持 ES6 语法 Q: 为什么 webpack4 默认支持 ES6 语法的压缩? A: terser 里面实现了 ES6 语法的 AST解析. webpack 4 里使用 ...
- js 监听ajax请求
function hookSend(hook) { if (!XMLHttpRequest.prototype._oldSend) XMLHttpRequest.prototype._oldSend ...
- Github Packages和Github Actions实践之CI/CD
概述 Github在被微软收购后,不忘初心,且更大力度的造福开发者们,推出了免费私有仓库等大更新.近期又开放了packages和actions两个大招,经笔者试用后感觉这两个功能配合起来简直无敌. G ...
- 物联网网关开发:基于MQTT消息总线的设计过程(上)
道哥的第 021 篇原创 目录 一.前言 二.网关的作用 2.1 指令转发 2.2 外网通信 2.3 协议转换 2.4 设备管理 2.5 边沿计算(自动化控制) 三.网关内部进程之间的通信 3.1 网 ...
- 基于【腾讯云函数】/【GitHub Actions】/【Docker】的每日签到脚本(支持多账号使用)
每日签到集合 基于[腾讯云函数]/[GitHub Actions]/[Docker]的每日签到脚本 支持多账号使用 特别声明: 本仓库发布的脚本及其中涉及的任何解锁和解密分析脚本,仅用于测试和学习研究 ...
- 博客数据库要连接Elasticsearch,使用MySQL还是MongoDB更合理
若进行博客等文本类数据的读写以及专业搜索引擎的连接的解决方案对比,可以肯定的下结论:MongoDB的解决方案中要远远好于MySQL的解决方案. 一.从开发工序角度 MySQL的文章读写方式 方式一:文 ...
- 【DB宝41】监控利器PMM的使用--监控MySQL、PG、MongoDB、ProxySQL等
目录 一.PMM简介 二.安装使用 三.监控MySQL数据库 MySQL慢查询分析 四.监控PG数据库 五.监控MongoDB数据库 六.监控ProxySQL中间件 一.PMM简介 之前发布过一篇Pr ...