daum

코딩. 0부터 1까지 Coding 0 to 1 최태윤, 정유미, 김태경

코드? 지시어 Code? Instruction

झಕ੉झ ੋ߬੉؊

1ࠗ Ӓܻ٘

x୷ y୷

0,0, 색칠

0,0, 색칠 x୷ y୷

0,0, 색칠 2,1, 색칠

0,0, 색칠 2,1, 색칠 4,0 색칠

0,0, 색칠 2,1, 색칠 4,0 색칠 1,3, 색칠

0,0, 색칠 2,1, 색칠 4,0 색칠 1,3, 색칠 4,4, 색칠

파이어폭스, 오픈소스 브라우저   자바스크립트

function setup() { createCanvas(500,500); } function draw() { rect(100,100,100,100); }

sketch.js ਢಕ੉૑ ࢜۽Ҋஜ ௏٘ ੘ࢿ ੷੢ index.html

1. 함수: 函數 2. 숫자가 들어있는 상자 function ಔ࣌

function setup() 셋업 프로그램 설정 펑션: 함수

function setup() 소괄호 퍼렌터시스 parenthesis

전달인수, 아규먼트 argument ( )

소괄호 입력

중괄호 컬리 브레이스 Curly brace function setup(){ }

두개의 중괄호 사이에 지시문statement이 들어간다 { }

중괄호 입력

function setup(){ createCanvas(500,500); } 캔버스를 만든다 세미콜론 대문자 x축, y축

쎄미콜론 하나의 지시문이 끝남을 표시 ;

여러개의 지시문을 포함하기도 한다. } 지시문 ; { 지시문 ;
지시문 ;

function setup(){ createCanvas(500,500); } x축 y축 0 0 500 500

셋업 드로우

햄스터 휠같이 반복 재생 function draw( )

rect(100,100,100,100); 너비, 높이 사각형 rectangle X축, Y축

ࢸޙઑࢎೞӝ

एחदр ࢸޙઑࢎೞӝ

ইөߓ਍Ѫٜҗ ࣻ૘ೠ੿ࠁ۽ ੉۠Ѫਸٜ݅যࠅѢ৘ਃ

ٜ݅ӝਤ೧ࢲח ੉۠Ѫٜਸ೧ঠ೤פ׮ Ӗ੗ ৈ۞ѐ੄ بഋ

Ӗ੗֍ӝ

Ӗ੗֍ӝ text(“ղਊ”, xઝ಴, yઝ಴);

Ӗ੗֍ӝ text(“উ֞ೞࣁਃ”, 50, 50); ղਊ Yઝ಴ Zઝ಴

੉ۧѱӖ੗оաఋժפ׮ ଵҊ ೐ܽ౟

੉ઁபߡझਤীӖ੗ܳ֍যࠅѱਃ ଵҊ ೐ܽ౟

୐ߣ૩Ӗ੗ੋtѐҳܻuܳ ੄ਤ஖ী֍যࠁѷणפ׮ text(“ѐҳܻ”, 50, 100);

Ӗ੗ܳ֍যࠇद׮ ଵҊ ೐ܽ౟

Ӗ੗ܳৈ۞ѐ֍যࠇद׮ text(“ѐҳܻ”, 50, 100); text(“ѐҳܻ”, 50, 200); text(“ѐҳܻ”, 50, 300);
text(“ѐҳܻ”, 50, 400);

ଵҊ ೐ܽ౟ Ӗ੗ܳৈ۞ѐ֍যࠇद׮

ղоઑࢎೠ೦ݾਵ۽߄Լࠇद׮ text(“࣠ಞ”, 50, 100); text(“ੋ੺޷”, 50, 200); text(“ಀदܖڂ”, 50, 300);
text(“х੗ڂ”, 50, 400);

ղоઑࢎೠ೦ݾਸ֍যࠇद׮ ଵҊ ೐ܽ౟

بഋ֍ӝ

੉ۧѱٜ݅Ѫੑפ׮

੉ࢎпഋਸݢ੷ٜ݅যࠁѷणפ׮ ଵҊ ೐ܽ౟

ࢎпഋਸ݅٘חߑߨӝরաࣁਃ rect(xઝ಴, yઝ಴, ց࠺, ֫੉);

ࢎпഋೞաܳ֍যࠇद׮ rect(50, 100, 50, 50);

ࢎпഋ੉ೞաٜযщणפ׮ ଵҊ ೐ܽ౟

੉ߣীח୐ߣ૩ࢎпഋয়ܲଃী ࢎпഋೞա؊ٜ݅যࠅѤؘਃ ଵҊ ೐ܽ౟

rect(150, 50, 50, 50); rect(200, 50, 50, 50); ୐ߣ૩ࢎпഋ فߣ૩ࢎпഋ

୐ߣ૩ࢎпഋয়ܲଃী ࢎпഋ੉ٜ݅য઎णפ׮ ଵҊ ೐ܽ౟

فߣ૩ࢎпഋয়ܲଃী ࢎпഋਸೠߣ؊୶о೤פ׮ rect(150, 50, 50, 50); rect(200, 50, 50, 50);
rect(250, 50, 50, 50); ୐ߣ૩ࢎпഋ فߣ૩ࢎпഋ ࣁߣ૩ࢎпഋ

فߣ૩ࢎпഋয়ܲଃী ࢎпഋ੉ٜ݅য઎णפ׮ ଵҊ ೐ܽ౟

੉ઁل૩઴ਸٜ݅যࠅѱਃ ଵҊ ೐ܽ౟

ل૩઴੄୐ߣ૩֎ݽٟܳ݅פ׮ rect(150,50,50,50); rect(200,50,50,50); rect(150,150,50,50); rect(250,50,50,50);

ل૩઴୐ߣ૩ࢎпഋ੉ ٜ݅য઎णפ׮ ଵҊ ೐ܽ౟

ࢎпഋց࠺۽ઑ੺ೞחߑߨ ଵҊ ೐ܽ౟

ࢎпഋ੄ց࠺чਸ ߉਷झ౭ழѐࣻ݅ఀғ೧સפ׮ ଵҊ ೐ܽ౟

ࢎпഋ੄ց࠺чਸ ߉਷झ౭ழѐࣻ݅ఀғ೧સפ׮ rect(150, 150, 50*झ౭ழѐࣻ, 50); ࢎпഋ੄о۽ց࠺

ࢎпഋց࠺ܳઑ੺೧઱חߑߨਵ۽ ੉੹௏٘ب߸҃೧ࠇפ׮ ଵҊ ೐ܽ౟

पण ଵҊ ೐ܽ౟

࢝ӭ߄Բӝ

੉ۧѱٜ݅ѩפ׮

അ੤࢚࢝਷ഥ࢝ਵ۽غয੓חؘਃ ﬁll(‘grey’);

ٮ১಴উ੄Ӗ੗ܳ߄Լࠇद׮ ﬁll(‘red’);

Ӗ੗࢝җبഋ੄࢝੉߄Շ঻णפ׮ ଵҊ ೐ܽ౟

׮࢚ٜܲ࢝ਸ੸ਊ೧ࠇद׮ fill(‘red’); fill(‘yellow’); fill(‘blue’); ࡈр࢝ ֢ۆ࢝ ౵ۆ࢝ fill(‘navy’); թ࢝

Ӗ੗࢝җبഋ੄࢝੉߄Շ঻णפ׮ ଵҊ ೐ܽ౟

ઁݾਸ୶о೤פ׮ ଵҊ ೐ܽ౟

ellipse(100,100,100,100); 원

ellipse(100,100,10,10); 폭, 높이 엘립스, 원 X축, Y축 원 100 100
10 10

입력

function setup(){ createCanvas(500,500); } function draw(){ ellipse(mouseX,mouseY,10,10);   } 마우스
위치 입력 x축 마우스 위치, y축 마우스 위치

만약에 거짓 참 지시어

if(mouseIsPressed){ } 5-2 조건문 햄버거를 먹자; 마우스를 클릭하면

function draw(){ if(mouseIsPressed){ ellipse(mouseX,mouseY,10,10); } } 조건 성립시에만 반복 5-2
마우스를 클릭하면

daum

daum

More Decks by Taeyoon Choi

Featured

Transcript