13. 멀티미디어와 Google 지도 제목. 13. 멀티미디어와 Google 지도 제목.

Presentation on theme: "13. 멀티미디어와 Google 지도 제목. 13. 멀티미디어와 Google 지도 제목."— Presentation transcript:

1

2 13. 멀티미디어와 Google 지도 제목

3 오디오를 실행하는 방식을 익힌다. 스레드를 이해하고 오디오에 적용한다. Google 지도를 활용하는 앱을 작성한다.

4 01 오디오 02 스레드 03 Google 지도

5 1. 오디오[1/12] 오디오 MediaPlayer 클래스는 음악 및 동영상을 재생해주는 기능
MediaPlayer의 play( ), pause( ), stop( ) 메소드는 각각 음악을 시작, 일시정 지, 정지하는 기능을 함

6 1. 오디오[2/12] 간단한 음악 재생 예제 res 폴더에서 raw 폴더를 만든 후 적당한 Mp3 파일을 복사

7 1. 오디오[3/12] 간단한 음악 재생 예제

8 1. 오디오[4/12] 간단한 음악 재생 Java 코드 스위치를 켜면 음악이 시작되고 스위치를 끄면 음악이 정지됨

9 1. 오디오[5/12]

10 1. 오디오[6/12] 안드로이드 프로젝트 생성 프로젝트 이름 : Project13_1
패키지 이름 : com.cookandroid.project13_1

11 1. 오디오[7/12] 화면 디자인 및 편집 DDMS에서 AVD의 /storage/sdcard(또는 /storage/ ) 폴더에 mp3 파일을 넣음

12 1. 오디오[8/12] Activity_main.xml의 바깥 리니어레이아웃 안에 3개의 리니어레이아웃(수평)을 만듦
리니어레이아웃1 : 리스트뷰(lvMP3) 1개 리니어레이아웃2 : 버튼(btnPlay, btnStop) 2개 리니어레이아웃3 : 텍스트뷰(tvMP3) 1개, 프로그래스바(pbMP3) 1개 layout_weight는 6:1:1 정도로 설정

13 1. 오디오[9/12] Java 코드 작성 및 수정 리스트뷰 변수 1개
<듣기>, <중지>에 대응할 변수 2개 텍스트뷰에 대응할 변수 1개 프로그래스바 변수 1개 MP3 파일 목록이 저장될 ArrayList<String> 변수 1개 리스트뷰에서 선택된 MP3 파일 이름이 저장될 변수 1개 MP3 파일이 저장되어 있는 SD카드의 절대 경로를 저장할 문자열 변수 1개 MediaPlayer 변수 1개

14 1. 오디오[10/12] SD카드의 MP3 파일을 읽어서 리스트뷰에 출력하는 부분 작성

15 1. 오디오[11/12] <듣기>, <중지>를 클릭했을 때 동작하는 리스너를 onCreate( ) 내부에 코딩

16 1. 오디오[12/12]

17 2. 스레드 ▶프로그래스바와 시크바[1/3] 프로그래스바와 시크바 프로그래스바 : 작업의 진행 상태를 확인할 때 많이 활용
시크바 : 음악이나 동영상 재생의 위치를 지정할 때 많이 활용

18 2. 스레드 ▶프로그래스바와 시크바[2/3] 프로그래스바/시크바 예제

19 2. 스레드 ▶프로그래스바와 시크바[3/3] 프로그래스바/시크바 예제 Java 코드

20 2. 스레드 ▶스레드 기본[1/5] 스레드(Thread) 동시에 여러 작업을 수행하기 위해 사용되는 개념
멀티 스레드(Multi-Thread), 혹은 경량 프로세스라고도 함 → 스레드가 프로세스(전체 프로그램 동작) 안에서 동작하는 작은 단위이기 때문 → 함수는 하나의 작업이 끝나야 다음 작업이 진행되지만, 스레드는 하나의 작업이 끝나기 전에 다른 작업을 동시에 진행시킬 수 있음

21 2. 스레드 ▶스레드 기본[2/5] 스레드 기본 예제

22 2. 스레드 ▶스레드 기본[3/5] 스레드 기본 예제 Java 코드

23 2. 스레드 ▶스레드 기본[4/5] 스레드 기본 형식

24 2. 스레드 ▶스레드 기본[5/5] 스레드 기본 예제 Java 코드(수정)

25 2. 스레드 ▶UI 스레드[1/5] UI(User Interface) 스레드 화면의 위젯을 변경할 때 사용
일반적인 스레드는 스레드 안에서 필요한 내용을 계산하는 것만 가능하며, 화면의 다른 위젯을 변경할 수 없음

26 2. 스레드 ▶UI 스레드[2/5] UI 스레드 예제

27 2. 스레드 ▶UI 스레드[3/5] UI 스레드 예제 Java 코드

28 2. 스레드 ▶UI 스레드[4/5] UI 스레드 사용 형식

29 2. 스레드 ▶UI 스레드[5/5] UI 스레드 예제 Java 코드(수정)

30 2. 스레드 ▶스레드 응용[1/4] 스레드 응용 예제

31 2. 스레드 ▶스레드 응용[2/4] 스레드 응용 예제 Java 코드

32 2. 스레드 ▶스레드 응용[3/4] 스레드 응용 예제 Java 코드
음악이 중지되고 프로그래스바와 진행 시간을 초기화하려면 아래 코드로 변경

33 2. 스레드 ▶스레드 응용[4/4]

34 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[1/10]
Google Play services 설치 Android Studio 메뉴 [Tools]-[Android]-[SDK Manager]를 실행 ‘Google Play services’를 체크한 후 <Install Packages>를 클릭

35 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[2/10]
[Choose Packages to Install]이 나오면 ‘Accept License’를 선택하고 <Install>을 클릭 설치가 끝난 뒤 왼쪽 아래에 “Done loading packages”라는 완료 메시지가 나오면 종료

36 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[3/10]
인증을 위한 SHA1 코드 알아내기 JDK 설치 폴더로 이동한 후 “keytool.exe -list -v –keystoreC:\Users\현재사용자 이름\.android\debug.keystore” 사용 비밀번호를 물어보면 “android”를 입력하고 SHA1 코드 복사

37 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[4/10]
프로젝트 이름 : CookMap 패키지 이름 : com.cookandroid.cookmap Application Name : CookMap → Project Name 동일 Package Name : com.cookandroid.cookmap Minimum SDK : API 21 : Android 5.0 (Lollipop)

38 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[5/10]
Google API 등록 웹 브라우저에서 접속하고 로그인 <프로젝트 만들기> 클릭 후, 이름은 ‘CookMap’으로 입력하고 <만들기> 클릭 대시보드에서 <API 사용 설정 및 관리> 클릭

39 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[6/10]
Google API 등록 [Google Maps Android API]를 클릭

40 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[7/10]
Google API 등록 <API 사용 설정>을 클릭한 후 왼쪽의 <←>를 클릭

41 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[8/10]
Google API 등록 왼쪽 <사용자 인증 정보>를 클릭하고 <새 사용자 인증 정보>의 <API 키>를 선택 <새 키 만들기> 중 <Android 키> 클릭

42 3. Google 지도 ▶Google 지도 사용을 위한 준비 사항[9/10]
Google API 등록 <Android API 키 생성>에서 <+ 패키지 이름 및 지문 추가> 클릭

43 3. Google 지도▶Google 지도 사용을 위한 준비 사항[10/10]
API Key 발급 완료 이 코드를 메모장에 복사(코드는 24시간 동안 유효) <사용자 인증 정보>의 <Oauth 동의 화면>을 클릭하여 이메일 주소와 ‘사용자에게 표시되는 제품 이름’을 채우고 <저장>을 클릭

44 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[1/8]
Project Tree에서 [Gradle Scripts]-[build.gradle (Module: app)]을 더블클릭 아래쪽 dependencies 부분에 다음을 추가 후 ‘ Sync Now’ 버튼을 클릭

45 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[2/8]
AndroidMenifest.xml 파일 편집

46 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[3/8]
AndroidManifest.xml 파일 수정 결과

47 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[4/8]
activity_main.xml에 fragment를 추가

48 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[5/8]
Google 지도를 사용하려면 FragmentActivity 클래스 상속

49 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[6/8]
프로젝트 실행 및 결과 확인 [SDK 설치 폴더]의 “AVD Manager.exe”를 실행해서 새로운 AVD를 만듦 새로운 가상머신을 부팅하고 한글 환경으로 설정

50 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[7/8]
프로젝트 실행 및 결과 확인 프로젝트를 실행(방금 만든 AVD를 선택하고 <OK>를 클릭)

51 3. Google 지도 ▶Google Play service 라이브러리 사용 설정[8/8]
프로젝트 실행 및 결과 확인 화면을 스크롤하거나 더블 클릭하면 지도 화면이 움직임

52 3. Google 지도 ▶Google 지도 응용[1/6]
GoogleMap 클래스 GoogleMap 클래스는 기본적으로 확대, 축소, 이동의 기능이 제공 그 외의 기능은 그라운드 오버레이(GroundOverlay)를 활용 그라운드 오버레이는 지도(GoogleMap 클래스) 위에 투명한 유리막을 얹어놓 는 개념

53 3. Google 지도 ▶Google 지도 응용[2/6]
안드로이드 프로젝트 생성 CookMap 프로젝트를 이어서 진행 화면 디자인 및 편집 activity_main.xml을 그대로 사용

54 3. Google 지도 ▶Google 지도 응용[3/6]
Java 코드 작성 및 수정 GoolgeMap 개체를 준비하고, 위성지도가 보이도록 설정 후 실행

55 3. Google 지도 ▶Google 지도 응용[4/6]
옵션 메뉴 생성(직접 Java 코드에서 생성) 앞 예제의 11행과 12행을 삭제 옵션 메뉴에 위성 지도/일반 지도/월드컵경기장 바로가기 3개를 생성 위성 지도 선택하면 위성지도가 켜지고, 일반 지도 선택하면 위성지도가 꺼지도록 함

56 3. Google 지도 ▶Google 지도 응용[5/6]
지도를 클릭하면 표시한 CCTV 모양의 아이콘이 지도에 생성되도록 코드 작성

57 3. Google 지도 ▶Google 지도 응용[6/6]

58