[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.00,0:00:06.25,Default,,0000,0000,0000,,지난 시간에 draw()함수와 if구문을 통해\N공 튀기기를 해봤어요 Dialogue: 0,0:00:06.25,0:00:08.01,Default,,0000,0000,0000,,복습 한번 할게요 Dialogue: 0,0:00:08.01,0:00:12.26,Default,,0000,0000,0000,,먼저 공의 위치변수와 속도변수에\N초기값을 설정해요 Dialogue: 0,0:00:12.26,0:00:17.24,Default,,0000,0000,0000,,그리고 반복 호출되는 draw()함수를 통해 Dialogue: 0,0:00:17.24,0:00:20.91,Default,,0000,0000,0000,,배경을 다시 칠하고 \N타원을 그리는 과정을 반복해요 Dialogue: 0,0:00:20.91,0:00:27.78,Default,,0000,0000,0000,,타원의 위치는 위치변수값과 속도변수값의\N상호작용에 의해 결정돼요 Dialogue: 0,0:00:27.78,0:00:31.20,Default,,0000,0000,0000,,if문 없이는 공이 앞으로만 계속 갈거에요 Dialogue: 0,0:00:31.20,0:00:33.14,Default,,0000,0000,0000,,재시작을 하기 전까지는 말이죠 Dialogue: 0,0:00:33.14,0:00:36.02,Default,,0000,0000,0000,,그래서 밑에다가 if문을 두개 추가했습니다 Dialogue: 0,0:00:36.02,0:00:40.60,Default,,0000,0000,0000,,그렇게 해서 공이 오른쪽벽이나 왼쪽벽에 가까워진다면 Dialogue: 0,0:00:40.61,0:00:45.31,Default,,0000,0000,0000,,그 공이 반대쪽으로 튕겨나갈 수 있게\N속도를 양수나 음수로 바꿔줍니다 Dialogue: 0,0:00:45.31,0:00:50.07,Default,,0000,0000,0000,,공은 이제 계속 앞뒤로 움직일겁니다 Dialogue: 0,0:00:50.07,0:00:53.67,Default,,0000,0000,0000,,멋지네요\N이것을 응용할 수 있는 애니메이션은 많이 있어요 Dialogue: 0,0:00:53.67,0:00:57.52,Default,,0000,0000,0000,,그렇지만 지금은 유저와의 상호작용을\N추가하고싶어요 Dialogue: 0,0:00:57.52,0:01:00.07,Default,,0000,0000,0000,,아직은 이 프로그램이 TV쇼를 보는것같아요 Dialogue: 0,0:01:00.07,0:01:04.76,Default,,0000,0000,0000,,프로그램을 친구에게 줘도 친구가 프로그램 \N할 줄도 모르고 그래서 상호작용할 수가 없으니까 Dialogue: 0,0:01:04.76,0:01:06.74,Default,,0000,0000,0000,,눈으로 보기만 했었죠 \N그것도 괜찮긴 하지만 Dialogue: 0,0:01:06.74,0:01:10.24,Default,,0000,0000,0000,,보기만 하는 것보다\N직접 해보는게 더 신날 것 같아요 Dialogue: 0,0:01:10.24,0:01:13.23,Default,,0000,0000,0000,,그래서 유저가 조작할 수 있게\N방법을 제시해야겠어요 Dialogue: 0,0:01:13.23,0:01:20.16,Default,,0000,0000,0000,,이전에 mouseX와 mouseY라는 전역변수에 대해 배웠어요 Dialogue: 0,0:01:20.16,0:01:25.46,Default,,0000,0000,0000,,현재 마우스 위치를 알아내는 변수에요 Dialogue: 0,0:01:25.46,0:01:28.78,Default,,0000,0000,0000,,이것을 이용하면 프로그램이 보다 쌍방향적으로 돼요 Dialogue: 0,0:01:28.78,0:01:31.24,Default,,0000,0000,0000,,그걸 어떤 방법으로 사용할까요? Dialogue: 0,0:01:31.24,0:01:34.03,Default,,0000,0000,0000,,draw()함수 안에서 사용하면 돼요 Dialogue: 0,0:01:34.03,0:01:39.50,Default,,0000,0000,0000,,프로그램이 실행될 때\Ndraw()함수만 반복 호출되기 때문이에요 Dialogue: 0,0:01:39.50,0:01:44.55,Default,,0000,0000,0000,,draw()함수를 제외하고는 한번만 호출돼요 Dialogue: 0,0:01:44.55,0:01:48.14,Default,,0000,0000,0000,,반복 호출되지 않으면 Dialogue: 0,0:01:48.14,0:01:51.24,Default,,0000,0000,0000,,유저가 mouseX와 mouseY를 이용해\N상호작용을 할 수 없게 됩니다 Dialogue: 0,0:01:51.24,0:01:57.28,Default,,0000,0000,0000,,draw()함수를 통해\N200 픽셀 위치에 공을 그릴거에요 Dialogue: 0,0:01:57.28,0:02:02.73,Default,,0000,0000,0000,,y좌표니까 mouseY를 이용하는 것은 어떨까요? Dialogue: 0,0:02:02.74,0:02:08.53,Default,,0000,0000,0000,,그랬더니 공이 움직일 때 마우스 y위치가 적용되네요 Dialogue: 0,0:02:08.53,0:02:14.36,Default,,0000,0000,0000,,이것 좀 봐요! 마우스를 위아래로 움직이면 \N공이 움직이는 라인을 위아래로 바꿀 수 있어요 Dialogue: 0,0:02:14.36,0:02:18.20,Default,,0000,0000,0000,,멋지네요\N이제 mouseX를 사용해볼 차례입니다 Dialogue: 0,0:02:18.20,0:02:19.86,Default,,0000,0000,0000,,어떻게할까요? Dialogue: 0,0:02:19.86,0:02:22.44,Default,,0000,0000,0000,,좌우가 아닌 위아래로 움직이는 Dialogue: 0,0:02:22.44,0:02:25.94,Default,,0000,0000,0000,,또다른 공을 만드는 것이 어떨까요? Dialogue: 0,0:02:25.94,0:02:30.03,Default,,0000,0000,0000,,유저가 공의 x좌표를 조작할 수 있게 하고요 Dialogue: 0,0:02:30.03,0:02:32.61,Default,,0000,0000,0000,,인자를 반대로 하면 되겠네요 Dialogue: 0,0:02:32.61,0:02:39.51,Default,,0000,0000,0000,,elipse(mouseX, position, 50, 50)\N이렇게 말이죠 Dialogue: 0,0:02:39.51,0:02:41.47,Default,,0000,0000,0000,,확인해보세요 Dialogue: 0,0:02:41.47,0:02:46.91,Default,,0000,0000,0000,,수직 방향으로 움직이는 2개의 공을\N제가 지금 제어하고 있어요 Dialogue: 0,0:02:46.91,0:02:50.08,Default,,0000,0000,0000,,그래도 좀 부족한 것 같아요 Dialogue: 0,0:02:50.08,0:02:53.44,Default,,0000,0000,0000,,유저가 더 조작할 수 있게 하고싶어요 Dialogue: 0,0:02:53.44,0:02:56.94,Default,,0000,0000,0000,,2번째 공이 보이게 하는 권한을 유저에게 주고싶어요 Dialogue: 0,0:02:56.94,0:03:01.41,Default,,0000,0000,0000,,마우스 클릭한 지점에서 시작하도록 말이죠 Dialogue: 0,0:03:01.41,0:03:07.34,Default,,0000,0000,0000,,그럼 유저가 마우스를 눌렀는지 알아내야 하네요 Dialogue: 0,0:03:07.34,0:03:12.94,Default,,0000,0000,0000,,다행히 그 역할을 할 bool형태의 변수가 이미 있어요 Dialogue: 0,0:03:12.94,0:03:19.36,Default,,0000,0000,0000,,mouseIsPressed라고 불리는데\Nif문 안에 사용할 수 있어요 Dialogue: 0,0:03:19.36,0:03:22.34,Default,,0000,0000,0000,,두번째 공을 보세요 Dialogue: 0,0:03:22.34,0:03:31.94,Default,,0000,0000,0000,,if(mouseIsPressed) 를 적고\N그 곳에 elipse(...)를 이동시킵니다 Dialogue: 0,0:03:31.94,0:03:40.86,Default,,0000,0000,0000,,이것이 하는 일은 If 조건이 true이면\N타원을 그리게 하는 거에요 Dialogue: 0,0:03:40.86,0:03:46.03,Default,,0000,0000,0000,,유저가 마우스를 누르면\NmouseIsPressed가 true가 되고요 Dialogue: 0,0:03:46.03,0:03:48.20,Default,,0000,0000,0000,,그럼 같이 해봐요 Dialogue: 0,0:03:48.20,0:03:49.69,Default,,0000,0000,0000,,짜잔! Dialogue: 0,0:03:49.69,0:03:53.36,Default,,0000,0000,0000,,마우스 클릭할 때마다 공이 보이네요 Dialogue: 0,0:03:53.36,0:03:58.41,Default,,0000,0000,0000,,평면에서 공이 튀어나와요 Dialogue: 0,0:03:58.41,0:04:00.03,Default,,0000,0000,0000,,멋져요! Dialogue: 0,0:04:00.03,0:04:04.74,Default,,0000,0000,0000,,mouseIsPressed변수는 흥미로워요 Dialogue: 0,0:04:04.74,0:04:08.80,Default,,0000,0000,0000,,프로그램에 기반한 것이 아닌\N유저의 행동에 기반해서 작동하니까요 Dialogue: 0,0:04:08.80,0:04:13.20,Default,,0000,0000,0000,,그리고 draw()함수가 반복호출되는 것 때문에 Dialogue: 0,0:04:13.20,0:04:16.17,Default,,0000,0000,0000,,프로그램의 결과는 계속해서 Dialogue: 0,0:04:16.17,0:04:18.74,Default,,0000,0000,0000,,유저의 단순한 입력에 따라 바뀔거에요 Dialogue: 0,0:04:18.74,0:04:22.03,Default,,0000,0000,0000,,if 구문과 mouseIsPressed변수의 조합의 힘 때문에 Dialogue: 0,0:04:22.03,0:04:26.67,Default,,0000,0000,0000,,버튼과 그리기 프로그램 처럼\N멋진 것을 그릴 수 있게 되었어요 Dialogue: 0,0:04:26.67,0:04:29.00,Default,,0000,0000,0000,,유후!