SW교육/앱인벤터

1-4강. 첫 번째 앱 만들기 - 블록에디터

k2man 2015. 3. 30. 13:27
반응형

블록 코딩하기

화면 오른쪽에 있는 [Blocks] 버튼을 클릭하면 블록에디터로 화면이 전환됩니다.

11.jpg

블록(Blocks)에서 "Button1"을 선택하면 아래 그림처럼 Button1에 연결된 여러 기능의 블록들이 나타납니다.

12.jpg

우리는 고양이 사진이 있는 버튼을 터치(클릭) 했을 때 고양이 소리를 들려줄 예정입니다.

그래서 화면처럼 "when (Button1).Click do ..." 블록을 사용하게 됩니다. 글자 그대로 해석해 보면  "Button1을 클릭했을 때 ... 을 실행해라"라고 할 수 있습니다.

이 블럭을 뷰어(Viewer)로 끌어다 놓습니다.

다음은 버튼일 눌렸을 때 실행할 대상을 블록으로 조립하면 됩니다. 이 앱에서는 고양이 소리를 들려줄 예정이였습니다.

13.jpg

블록(Blocks)에서 Sound1을 선택하면 그림처럼 Sound1과 관련된 기능들을 가진 블록들이 표시됩니다. 

이 중에 우리가 필요한 것은 Sound를 들려주는 기능입니다. 그래서 "Call (Sound1).Play"를 선택했습니다. Sound1을 재생해라는 의미를 갖고 있죠.

블록 모양을 보시면, 앞서 끌어다 놓은 "when (Button1).Click do ..." 블록의 중간에 딱 들어 맞게 생긴 것을 알 수 있습니다.

그럼 화면처럼 끌어다 놓아 볼까요?

스크린샷 2015-03-22 오후 3.51.36.png

이제 모든 작업이 끝났습니다.

만든 블록의 의미를 다시 해석해 볼까요?

when (Button1).Click do { call (Sound1).Play }

"Button1을 클릭했을 때 Sound1을 재생해라." 정도로 해석할 수 있겠습니다.


실행하기

앱인벤터로 만든 앱을 실행해 보는 방법은 세 가지가 있습니다.

그 중에서 안드로이드 스마트폰이 있고, 같은 무선공유기(wifi)에 컴퓨터와 스마트폰이 모두 연결되어 있다는 전제하에 설명을 하겠습니다.

만약 안드로이드 스마트폰이 없거나, 무선공유기가 없다면 다음에 설명하는 "앱인벤터 실행 방법"을 보고 실행하면 됩니다.

MIT AI2 Companion으로 실행하기

먼저 스마트폰의 Play스토어를 열고 "MIT AI2 Companion"을 검색하여 설치합니다.

아니면 아래 QR코드를 인식시키면 바로 설치할 수 있습니다.

20140817_200442.png

스마트폰에서는 설치한 MIT AI2 Companion을 실행시키고, 

앱인벤터의 [Connect] > [AI Companion] 메뉴를 선택합니다.

14.jpg

그럼 아래 그림처럼 QR코드와 6자리 문자가 나오게 됩니다.

connectIt.png

스마트폰에서 [scan QR code] 버튼을 선택하여 QR코드를 스캔해도 되며, 6자리 문자를 입력한 후에 [connect with code] 버튼을 선택해도 됩니다.

그럼 잠시 후에 스마트폰에서 앱이 실행된 것을 볼 수 있습니다.

Screenshot_2015-03-22-16-13-23.png

고양이 사진을 터치해 보세요. "야옹~~" 소리가 들리나요?


연재 바로가기 => http://www.educoding.kr/appinventor_info

반응형