NumOne绘制火柴人程序
NumOne绘制火柴人的代码分为四个部分:欢迎界面、练习足球和滑板、练习篮球和足球过人、疯狂篮球。由于NumOne的代码容量为3800个字符,虽然已经满足绝大多数的DIY应用场景,但面对像动态绘制火柴人这样需编写大量运行代码的程序,容量稍显不足,所以分为4个小程序来实现。下面是火柴人绘制动画的程序,分为图形程序以及自动生成的js-arduino风格的代码。
一、绘制欢迎界面
(1)图形程序

(2)生成的代码程序
Liquid_I2C.link(18,19);
while (true) {
Liquid_I2C.print(' Hello jsBlocks!');
Liquid_I2C.drawRoundRect(32,24,64,40,4,0);
Liquid_I2C.display();
delay(200);
Liquid_I2C.drawRoundRect(44,34,10,16,1,1);
Liquid_I2C.drawRoundRect(74,34,10,16,1,1);
Liquid_I2C.display();
delay(200);
Liquid_I2C.drawTriangle(48,24,48,16,57,24,1);
Liquid_I2C.drawTriangle(48,24,48,16,44,20,1);
Liquid_I2C.drawCircle(46,18,3,1);
Liquid_I2C.display();
delay(200);
Liquid_I2C.drawTriangle(71,24,80,24,80,16,1);
Liquid_I2C.drawTriangle(84,20,80,24,80,16,1);
Liquid_I2C.drawCircle(82,18,3,1);
Liquid_I2C.display();
delay(1000);
Liquid_I2C.clearDisplay();
}
二、火柴人创建
(1) 火柴人绘制函数
创建了一个可以动态绘制火柴人的函数,函数共11个参数:头部中心中心位置x,头部位置y,眼睛的状态(共三种状态1-双眼显示,2-显示左眼,3-显示右眼),左手状态(共2种状态,1、2的区别为圆弧方向)、左手角度(与x的角度),右手状态,右手角度,左脚状态,左脚角度,右脚状态,右脚角度。三个火柴人动画程序种都是用的火柴人函数,三个程序只是动画实现部分有区别。

(2) 生成的代码程序
// 实现一个火柴人
function matchstickman(head_x, head_y, eye_t, l_hand_t, l_hand_a, r_hand_t, r_hand_a, l_leg_t, l_leg_a, r_leg_t, r_leg_a) {
Liquid_I2C.drawCircle((head_x),(head_y),5,0);
if ((eye_t) == 1) {
Liquid_I2C.drawCircle(((head_x) - 2),(head_y),1,1);
Liquid_I2C.drawCircle(((head_x) + 2),(head_y),1,1);
}
if ((eye_t) == 2) {
Liquid_I2C.drawCircle(((head_x) - 2),(head_y),1,1);
}
if ((eye_t) == 3) {
Liquid_I2C.drawCircle(((head_x) + 2),(head_y),1,1);
}
var body_end_y;
body_end_y=((head_y) + 26);
Liquid_I2C.drawLine((head_x),((head_y) + 5),(head_x),(body_end_y));
var hand_start_y;
var hand_end_x;
var hand_end_y;
hand_start_y=((head_y) + 10);
hand_end_x=((head_x) - 20 * Math.sin((l_hand_a)/180*Math.PI));
hand_end_y=((hand_start_y) + 20 * Math.cos((l_hand_a)/180*Math.PI));
var pass_pnt_x;
var pass_pnt_y;
pass_pnt_x=(((head_x) + (hand_end_x)) / 2);
pass_pnt_y=(((hand_start_y) + (hand_end_y)) / 2);
if ((l_hand_t) == 1) {
Liquid_I2C.drawArc((head_x),(hand_start_y),(hand_end_x),(hand_end_y),((pass_pnt_x) - 4),(pass_pnt_y));
}
if ((l_hand_t) == 2) {
Liquid_I2C.drawArc((head_x),(hand_start_y),(hand_end_x),(hand_end_y),((pass_pnt_x) + 4),(pass_pnt_y));
}
hand_end_x=((head_x) + 20 * Math.sin((r_hand_a)/180*Math.PI));
hand_end_y=((hand_start_y) + 20 * Math.cos((r_hand_a)/180*Math.PI));
pass_pnt_x=(((head_x) + (hand_end_x)) / 2);
pass_pnt_y=(((hand_start_y) + (hand_end_y)) / 2);
if ((r_hand_t) == 1) {
Liquid_I2C.drawArc((head_x),(hand_start_y),(hand_end_x),(hand_end_y),((pass_pnt_x) + 4),(pass_pnt_y));
}
if ((r_hand_t) == 2) {
Liquid_I2C.drawArc((head_x),(hand_start_y),(hand_end_x),(hand_end_y),((pass_pnt_x) - 4),(pass_pnt_y));
}
var leg_end_x;
var leg_end_y;
leg_end_x=((head_x) - 20 * Math.sin((l_leg_a)/180*Math.PI));
leg_end_y=((body_end_y) + 20 * Math.cos((l_leg_a)/180*Math.PI));
pass_pnt_x=(((head_x) + (leg_end_x)) / 2);
pass_pnt_y=(((body_end_y) + (leg_end_y)) / 2);
if ((l_leg_t) == 1) {
Liquid_I2C.drawArc((head_x),(body_end_y),(leg_end_x),(leg_end_y),((pass_pnt_x) - 3),(pass_pnt_y));
}
if ((l_leg_t) == 2) {
Liquid_I2C.drawArc((head_x),(body_end_y),(leg_end_x),(leg_end_y),((pass_pnt_x) + 3),(pass_pnt_y));
}
leg_end_x=((head_x) + 20 * Math.sin((r_leg_a)/180*Math.PI));
leg_end_y=((body_end_y) + 20 * Math.cos((r_leg_a)/180*Math.PI));
pass_pnt_x=(((head_x) + (leg_end_x)) / 2);
pass_pnt_y=(((body_end_y) + (leg_end_y)) / 2);
if ((r_leg_t) == 1) {
Liquid_I2C.drawArc((head_x),(body_end_y),(leg_end_x),(leg_end_y),((pass_pnt_x) + 3),(pass_pnt_y));
}
if ((r_leg_t) == 2) {
Liquid_I2C.drawArc((head_x),(body_end_y),(leg_end_x),(leg_end_y),((pass_pnt_x) - 3),(pass_pnt_y));
}
}
三、火柴人踢足球和滑滑板
(1) 绘制图形代码

(2)生成的代码程序
Liquid_I2C.link(18,19);
for (var a = 0; a < 100; a=a+1) {
for (var i = -20; i <= 150; i=i+1) {
Liquid_I2C.clearDisplay();
matchstickman(i, 10, 3, 1, Math.sin(((i) * 30)/180*Math.PI) * 30, 2, Math.sin(((i) * 30)/180*Math.PI) * 30, 2, Math.sin(((i) * 30)/180*Math.PI) * 30, 1, Math.sin(((i) * 30)/180*Math.PI) * 30);
Liquid_I2C.drawCircle(((i) + 17 + Math.sin(((i) * 15)/180*Math.PI) * 10),50,3,1);
Liquid_I2C.display();
}
for (var i = 150; i >= -20; i=i-1) {
Liquid_I2C.clearDisplay();
matchstickman(i, 10, 2, 2, 45, 1, 45, 1, 30, 2, Math.sin(((i) * 30)/180*Math.PI) * 30 + 30);
Liquid_I2C.drawArc(((i) - 20),50,((i) + 20),50,(i),54);
Liquid_I2C.drawCircle(((i) - 10),55,2,1);
Liquid_I2C.drawCircle(((i) + 10),55,2,1);
Liquid_I2C.display();
}
}
三、火柴人练习篮球和足球过人
(1) 绘制图形代码

(2)生成的代码程序
Liquid_I2C.link(18,19);
for (var a = 0; a < 10; a=a+1) {
for (var i = -20; i <= 150; i=i+1) {
Liquid_I2C.clearDisplay();
matchstickman(i, 10, 3, 1, Math.sin(((i) * 15)/180*Math.PI) * 30 - 60, 2, Math.sin(((i) * 15)/180*Math.PI) * 30, 2, Math.sin(((i) * 15)/180*Math.PI) * 30, 1, Math.sin(((i) * 15)/180*Math.PI) * 30);
Liquid_I2C.drawCircle(((i) + 15),(38 + Math.sin(((i) * 15)/180*Math.PI) * 12),3,1);
Liquid_I2C.display();
}
for (var i = 150; i >= -20; i=i-1) {
Liquid_I2C.clearDisplay();
matchstickman(i, Math.sin(((i) * 10)/180*Math.PI) * 30, 2, 2, Math.sin(((i) * 30)/180*Math.PI) * 30, 1, Math.sin(((i) * 30)/180*Math.PI) * 30, 1, Math.sin(((i) * 30)/180*Math.PI) * 30, 2, Math.sin(((i) * 30)/180*Math.PI) * 30);
Liquid_I2C.drawCircle((((i) - 17) - Math.sin(((i) * 25)/180*Math.PI) * 10),(Math.sin(((i) * 10)/180*Math.PI) * 30 + 45),3,1);
Liquid_I2C.display();
}
}
三、火柴人疯狂打篮球
(1) 绘制图形代码

5、动态改变火柴人、绘制篮球
(2)生成的代码程序
Liquid_I2C.link(18,19);
for (var a = 0; a < 100; a=a+1) {
for (var i = 0; i <= 100; i=i+1) {
Liquid_I2C.clearDisplay();
matchstickman(64, 10, Math.random_int(1,4), 2, Math.sin(((i) * 15)/180*Math.PI) * Math.random_int(10,60) - 60, 2, Math.sin(((i) * 15)/180*Math.PI) * 30 - Math.random_int(10,100), 1, Math.sin(((i) * 15)/180*Math.PI) * 10 + 10, 1, Math.sin(((i) * 15)/180*Math.PI) * 10 + 10);
Liquid_I2C.drawCircle((Math.abs(64 + Math.sin(((i) * 15)/180*Math.PI) * 20)),(30 + Math.abs(Math.cos(((i) * 15)/180*Math.PI) * 30)),3,1);
Liquid_I2C.display();
}
}