scratch二次开发,blockly积木块的多语言效果实现

大家好,我是小黄。

今天给大家分享的是如何实现blockly的国际化效果(多语言的实现)。类似下面的效果:

一.实现过程

1.1自定义一个积木块

复制代码
Blockly.Blocks['motion_test_language'] = {
  /**
   * 国际化测试.
   * @this Blockly.Block
   */
  init: function() {
    this.jsonInit({
      "message0": "国际化测试 %1",
      "args0": [
        {
          "type": "input_value",
          "name": "STEPS"
        }
      ],
      "category": Blockly.Categories.motion,
      "extensions": ["colours_motion", "shape_statement"]
    });
  }
};

1.2在toolbox中注册

复制代码
    '<block type="motion_test_language" id="motion_test_language">' +
    '<value name="STEPS">' +
      '<shadow type="math_number">' +
        '<field name="NUM">10</field>' +
      '</shadow>' +
    '</value>' +
  '</block>' +

保存后编译查看效果,我们看到这样一个积木块。

1.3修改为国际化模式

在scratch-msgs下面重新设置两个字段,我们这次就演示英文和中文模式。

Blockly.ScratchMsgs.locales["zh-cn"]这个是简体中文模式的定义

Blockly.ScratchMsgs.locales["en"]这个是英文模式的定义

修改定义的块变为动态的导入

保存编译后查看效果

这样我们就实现了多语言的积木块效果了!

创作不易,各位帅气漂亮的小伙伴点个关注再走呗!!

相关推荐
曲幽7 小时前
FastAPI + PostgreSQL 实战:从入门到不踩坑,一次讲透
python·sql·postgresql·fastapi·web·postgres·db·asyncpg
用户83562907805112 小时前
使用 C# 在 Excel 中创建数据透视表
后端·python
码路飞15 小时前
FastMCP 实战:一个 .py 文件,给 Claude Code 装上 3 个超实用工具
python·ai编程·mcp
dev派17 小时前
AI Agent 系统中的常用 Workflow 模式(2) Evaluator-Optimizer模式
python·langchain
前端付豪19 小时前
AI 数学辅导老师项目构想和初始化
前端·后端·python
用户03321266636719 小时前
将 PDF 文档转换为图片【Python 教程】
python
悟空爬虫20 小时前
UV实战教程,我啥要从Anaconda切换到uv来管理包?
python
dev派21 小时前
AI Agent 系统中的常用 Workflow 模式(1)
python·langchain
明月_清风1 天前
从“能用”到“专业”:构建生产级装饰器与三层逻辑拆解
后端·python
曲幽1 天前
数据库实战:FastAPI + SQLAlchemy 2.0 + Alembic 从零搭建,踩坑实录
python·fastapi·web·sqlalchemy·db·asyncio·alembic