Scratch源码及相关介绍

Scratch Scratch 评论
  • 国内图形化编程的应用，大部分都是基于scratch源码来实现的二次开发，主要介绍scratch的源码和模块

关于Scratch

  • Scratch是麻省理工学院的“终身幼儿园团队”（Lifelong Kindergarten Group）开发的图形化编程工具，主要面对青少年开放。
  • 目前已有原始版本（1.4版本）、2.0版本（增加克隆积木，Lego和Makey makey拓展积木）、3.0版本（增加音乐、画笔、视频侦测、文字朗读、翻译等选择性下载扩展积木，并增加micro：bit和Lego mindstorms EV3拓展积木）所有人可以在任意版本中创作自己的程序

Scratch相关源码

  • 全项目分组: https://github.com/LLK

  • Scratch-www : https://github.com/LLK/scratch-www Scratch-www是Scratch社区的独立Web客户端，使用React和Redux构建。

  • ScratchJr: ScratchJr是一种入门编程语言，可让幼儿（5-7岁）创建自己的互动故事和游戏。

    1
    https://github.com/LLK/scratchjr

  • scratch-gui: 用于创建和运行Scratch 3.0项目的图形用户界面。

  • Scratch Blocks: Scratch Blocks是下一代图形编程模块的新开发项目，基于Google与麻省理工学院Scratch团队的合作 - 以Google的Blockly技术为基础，并以Scratch团队为年轻人开发创意学习工具的专业知识为基础。 Scratch Blocks将提供一个框架，用于构建垂直（基于文本）和水平（基于图标）格式的编程块。

  • scratch-render: 用于Scratch 3.0的基于WebGL的渲染引擎。

环境搭建

Scratch-gui项目搭建：

  • 目前基于Scratch 3 ，通过H5的方式来来实现的，所以编程拖拽部分的模块是通过H5来实现的，目前scratch包括了PC,和移动端相关的实现，移动端上通过ScratchJr的作为平台，国内头部的这块也用jr来实现了自己相关的APP

  • 先搭建PC端的scratch-gui项目：

    1
    https://github.com/LLK/scratch-gui.git

  • 到项目目录下进行 npm install （前提相关的node环境已经安装）

  • （若文中图片无法显示，请科学上网查看：推荐工具）

  • 运行项目：npm start

  • 可以看到运行起来项目：

scratchjr项目编译：

  • 下载scratchjr 源代码
  • 项目架构介绍
  • 需要相关的环境依赖：需要安装出来SVG相关依赖库和图片合成编辑的命令行工具
1
2
3
4
5
Ensure you have node and npm installed.
Run sudo easy_install pysvg to install python svg libraries
Run brew install librsvg to install commandline rsvg-convert
Run brew install imagemagick to install commandline magick
In the top level of the scratchjr repo directory, install npm dependencies for bundling the JavaScript: npm install
  • 环境依赖安装成功后，就可以进行源码进行相关编译项目，这过程可能会有相关环境安装失败情况出现（自行查找解决）
  • 根据边的架构可以看到相关代码模块的构成部分，可能运行不起来，需要把google相关的google-services进行移除下。

ios方式打开

  • 打开的方式和依赖于Android相同，需要相关的依赖环境与Android依赖相同，之后通过xcode打开ios/ScratchJr.xcworkspace即可

zhulgDeveloper & Technical Manager

lg.json@gmail.com