在Blockly的Toolbox中使用IconPark图标

1
class CustomCategory extends Blockly.ToolboxCategory {
2
  // 自定义类别创造函数
3
  /*
4
    categoryDef: 类别定义的信息
5
    toolbox: 表示类别的父级toolbox
6
    opt_parent: 可选参数，表示其父类别
7
    */
8
  constructor(categoryDef, toolbox, opt_parent) {
9
    super(categoryDef, toolbox, opt_parent);
10
  }
11
}

1
Blockly.registry.register(Blockly.registry.Type.TOOLBOX_ITEM, Blockly.ToolboxCategory.registrationName, CustomCategory, true);

1
class CustomCategory extends Blockly.ToolboxCategory {
2
  constructor(categoryDef, toolbox, opt_parent) {
3
    super(categoryDef, toolbox, opt_parent);
4
  }
5

6
  createIconDom_() {
7
    // 这里新建了一个iconpark-icon元素，也可以自己修改为别的元素
8
    const img = document.createElement("iconpark-icon");
9
    // 这里的name属性获取的内容是toolbox定义的中的categorystyle，也可以是别的值/属性
10
    img.name = this.toolboxItemDef_.categorystyle;
11
    // 设置图标大小
12
    img.size = "21";
13
    // 最后返回的应是一个元素
14
    return img;
15
  }
16
}