앱인벤터 교사 김석전 한국교원대학교 영재교육원
앱인벤터란?
디 자 인 화 면 구 성
앱인벤터를 사용하기 위한 준비 1단계 : 구글 크롬 브라우저 설치하기 https://www.google.com/chrome/browser/desktop/index.html 2단계 : 구글 회원 가입하기 https://www.google.co.kr/ 3단계 : 핸드폰에 QR-droid 설치하기 4단계 : 앱인벤터 페이지 접속하기 http://appinventor.mit.edu/explore/
끝 !! 자! 이제 앱을 만들어 핸드폰에서 작동 시켜 봅시다. 끝 !! 자! 이제 앱을 만들어 핸드폰에서 작동 시켜 봅시다.
첫번째 만들어볼 앱은? 버튼 누르고 말하면 텍스트로 바꿔주는 앱 Voice talk 어떻게 만들까? 어떤 재료가 필요할까? 작동하려면 어떤 과정이 필요할까?
두번째 만들어 볼 앱은? 사진 찍어 배경화면으로 저장하기 Camera 어떻게 만들까? 어떤 재료가 필요할까? 작동하려면 어떤 과정이 필요할까?
세번째 만들어 볼 앱은? 텍스트 입력 받고 버튼 누르면 말하는 앱 Button talk 어떻게 만들까? 어떤 재료가 필요할까? 작동하려면 어떤 과정이 필요할까?
네번째 만들어 볼 앱은? 화면에 그림 그리고 흔들면 지워지는 앱 Sketch 어떻게 만들까? 어떤 재료가 필요할까? 작동하려면 어떤 과정이 필요할까?
다섯번째 만들어 볼 앱은? 입력된 전화번호로 전화하는 앱 Phonecall 어떻게 만들까? 어떤 재료가 필요할까? 작동하려면 어떤 과정이 필요할까?
간단한 앱을 만들어 본 이유는?
텍스트 입력받고 전화하는 앱 사진찍고 사진에 그림 그리는 앱 지금까지 만들어 본 앱 중에 2개를 합쳐 보자 무엇과 무엇을 합치면 새로운 기능의 앱이 만들어 질까? 텍스트 입력받고 전화하는 앱 사진찍고 사진에 그림 그리는 앱
만들자~!! 텍스트 입력받고 전화하는 앱
만들자~!! 사진찍고 사진에 그림 그리는 앱
시간이 많이 남았는가?ㅋㅋ 좀더 어려운 앱을 만들어 보자~!! 시간이 많이 남았는가?ㅋㅋ 좀더 어려운 앱을 만들어 보자~!!
나침반을 만들어 볼까~?
방향센서
블록 코딩을 해보자 N의 위치 : x=폭/2, y=20 E의 위치 : x=폭-20, y=높이/2 W E S N의 위치 : x=폭/2, y=20 E의 위치 : x=폭-20, y=높이/2 S의 위치 : x=폭/2, y=높이-20 W의 위치 : x=20, y=높이/2 폭 : 100 높이 : 200 X=50, y=100 높이-20
스크린 초기화 하기 화면의 N, E, W, S의 위치 잡아 표시해 주기 N의 위치 : x=폭/2, y=20 E의 위치 : x=폭-20, y=높이/2 S의 위치 : x=폭/2, y=높이-20 W의 위치 : x=20, y=높이/2
위도값N, 경도값W 를 텍스트로 라벨로케이션에 셋팅 위치 센서값이 변했을때 위도값N, 경도값W 를 텍스트로 라벨로케이션에 셋팅 라벨로케이션에 값 표시 Lattitude : 위도 Longitude : 경도 Altitude : 고도 Azimuth : 방위각
방위각 값을 얻어서 텍스트로 라벨오리엔테이션라벨에 표시하기 이미지스프라이트의 머리를 얻은 방위각에 90을 더한 값으로 세팅하기 방향 센서값이 변했을때 방위각 값을 얻어서 텍스트로 라벨오리엔테이션라벨에 표시하기 이미지스프라이트의 머리를 얻은 방위각에 90을 더한 값으로 세팅하기 헤딩의 초기 값은 : 0 E방향이므로 N방향을 바라보게하려면 90 +
진짜 끝~!! 앱을 만들어 봤는데 좋았는가? 느낌은? 더 만들어 보고 싶은 것은? 더 배워 보고 싶은가?