Programing > Blockly2017

Blockly1.0꡼줿Τǡ餿ƿĴ٤Ƥߤޤ

blocklyp5.js_s.png

Blockly1.0ϡӥ奢ץߥ󥰥ǥѥ饤֥Ǥ켫ΤϡץǤϤʤȯԸΥġ륭åȤȤդǤ͡

ȤˤȡħƤޤ

  • JavaScript饤֥ꡣ150Kb̤
  • 100󥯥饤ȥɤưС¦ˤϰ¸ޤ
  • ChromeFirefoxSafariOperaIEʤɡפʥ֥饦ưޤ
  • ٤ʥޥȳĥƤޤ

äƤߤ

˥塼

Ȥξ󤬤ޤȤޤäƤƤ狼䤹ǤGoogleˤܸڡ⡢ạ̈狼ޤ

ȯԸ

ǥ

ƱƤɤեΡdemosץեˤޤ

BDTʤɡĤΥǥϡǤǤưޤ󡣡

Blockly Games

¿첽ѤΥ꥽ե뤬ήѤǤ롣

Blocklyδܵǽ򤹤

BlocklyΥ֥åǥϡ֥å(block types)Ǽtoolboxȡ֥å֤뤿ΥڡǹƤޤ

ɥڡʲ֤ˤɤäƤȡBlocklyδܵǽǤޤ

BlocklyΥ

Github饯󤹤뤫եɤޤ

ꥵΥڡfixed-sized Workspace

Blocklyꥵɽޤ

ΤˡHTMLե˼5Ĥΰ򵭽Ҥޤ

  • JavascriptΥɤ߹
  • ե
  • divɲäơꤷޤ
  • ġܥå
  • Javascriptˤ

ѹǽʥڡResizable Workspace

divơ֥륿ˡid="blocklyArea"֤ơβˡid="blocklyDiv"div֤ޤȤϡưĴ륹ץȤ֤ޤ

ץեϡindex.htmlǤϤʤoverlay.html򸫤Ƥߤޤ礦

֥åɲáAdd Custom Blocks

ꥸʥΥ֥åɲä뤳ȤǤޤ

֥åɲäˤϡ3ĤѰդޤ

  • ֥å(/blocksɸ֥å)
  • ġܥåե(ġܥå֥å򻲾)
  • ͥ졼(֥å饳ɤ)

֥åϡBlockly Developer Tools뤳ȤǤޤ

ġܥåե󥹤ϡڡɲäġܥåƱ

ġܥåToolbox

ġܥåϡɥ˥塼ˤɸ֥å֤졣 BlokcsˡɸŪʥ֥åҤȤѰդƤ롣toolsboxɲäư XMLǵҤɡ񤭤ݤʾϡBlockly Developer ToolsǤ롣 ޤƥεˡ񤤤Ƥ롣

ʤߤˡäʤɡȢ򥪥ˤΤϡʴ

var workspace = Blockly.inject('blocklyDiv',
   {toolbox: document.getElementById('toolbox'), trashcan: true});

ɥͥ졼Code Generators

֥åȤץ򥳡ɤѴޤ

åɡGrid

BlocklyΥڡˤϡץǥåɤ֤Ǥޤ

ࡧZoom

BlocklyΥڡˤϡץǥ(/̾)֤Ǥޤ

٥ȡEvent

ڡΤ٤Ƥѹϡ٥ȤΥȥꥬˤʤޤ

Cloud Storage

GoogleΥ饦ɥӥGoogle App engineǥɤ¸ɤ߹ߡͭǤޤ

¾

  • ץ /blockly/demos/index.html
  • JavascriptPythonLuaؤѴ /blockly/demos/code
  • Javascript󥿥ץ꥿ /blockly/demos/interpreter

֥åġܥåΥޥ

Blockly Developer Tools

Blockly Developer ToolsǺ뤳ȤǤޤˤϡ֥åڡ뤿ᡢ3Ĥεǽޤ

  • Block Factoryɥåɥåפǥ֥åǥ󤹤
  • Block Exporterǥ󤷤֥å
  • Workspace Factoryڡǥ󤹤

֥åθ

¸֥å

¸֥åɽϡʲꤹ

https://developers.google.com/blockly/guides/configure/web/fixed-size

<script src="msg/js/en.js"></script>

ܸξϡ顣

<script src="msg/js/ja.js"></script>

ƥ

ġܥåΥƥϡname°ѹ롣

<category name="ܥå" colour="#ED225D">
 <block type="run_foward"></block>
 <block type="jump_forward"></block>
 <block type="is_ball"></block>
 <block type="is_wall"></block>
</category>

֥å

ȼɲä֥åɽϡ.appendFieldǻꤹ롣

Blockly.Blocks['run_foward'] = {
  init: function() {
    this.appendDummyInput()
       .appendField("˿ʤ");
    this.setPreviousStatement(true, null);
    this.setNextStatement(true, null);
    this.setColour(0);
 this.setTooltip("");
 this.setHelpUrl("");
  }
};

¾

ƱڡǸڤؤ

https://blockly-demo.appspot.com/static/demos/code/index.html

ɤΥ饤

  • Apache License 2.0

BlocklyȤΥ饤

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

äƤʤ¤ꡢΥڡΥƥĤCreative Commons Attribution 3.0 Licenseβǥ饤󥹤졢ɥץApache 2.0饤󥹤βǻѵޤ ܺ٤ˤĤƤϡ ȥݥꥷ JavaϡOracleӤδϢҤϿɸǤ

ͤˤʤڡ


  ȥå   ʬ Хåå   ñ측 ǽ   إ   ǽRSS
źեե: fileblocklyp5.js_s.png 103 [ܺ]
Last-modified: 2018-04-19 () 22:30:31 (333d)