1. Android Studio - Hello World 휴대폰에 출력하기

장기 프로젝트 진행으로 얻은 경험을 바탕삼아, 안드로이드 앱 만들기를 독학으로 진행해보기로 결정했다. 무려 5년 넘게 필자를 보좌했던 노트북을 교체하게 된 계기도 이와 무관하지 않은데, 안드로이드 앱 제작을 위한 프로그램인 Android Studio를 돌리기 위해서 최소 8GB 이상의 메모리가 필요했기 때문이다. 기존의 노트북에 돌리니, 단순한 글자 하나 입력하는데도 너무나 많은 시간이 소모되었다(8GB 이하의 메모리로 안드로이드 독학을 하시려는 분들은 프로그램 돌리는 그 순간부터 속에서 복장이 터질 것이다. Android Studio를 돌리기 위해 충분한 메모리가 장착되어 있는지 확인하도록 하자).

 

어쨌든, 새 노트북도 왔고, Android Studio도 이전과 다르게 쌩쌩하게 도는 것을 확인해서, 모든 프로그램의 기본인 Hello World를 출력하는 것을 먼저 진행해보기로 했다. 그런데... 일반적인 프로그래밍 언어와 달리, Hello World를 스마트폰에 출력하기 위해 알아야 할 내용이 한두가지가 아니다. 하나씩 알아보자.

 

** 참고로, Android Studio의 설치법은 대부분의 사이트에서도 다루고 있는 내용이라, 설치와 관련된 내용은 생략한다. 딱히 설명을 크게 할 부분도 없고 말이다. 다만, 책을 사서 독학하시는 분들이라면 유의해야 할 점이 하나 있는데, 책에서 사용하는 Android Studio의 버전 현재 최신 Android Studio 버전이 다르다는 점이다(필자가 나름 최근에 출판된 책을 샀음에도 말이다). 이 말은, 책에 캡쳐된 스크린 샷과 실제 화면에 차이가 많다는 것이다. 필자의 포스팅을 참고하시는 분들은 Android Studio 4.0.0 버전을 다운받아 설치하시면 된다.

 

 

1. Android 화면의 구성

 

Android 화면은 다음과 같은 구성을 가진다. 

 

처음 프로젝트 생성 시, 필자의 화면과 보이는 부분이 조금 다를 수 있다.

 

이 화면은 새로로 세 부분으로 나누어져 있는데, 좌측은 Android 앱 제작에 필요한 폴더와 파일 목록을 보여주는 '프로젝트 창', 가운데는 실제 Android 앱 제작에 들어갈 코드를 작성하거나 디자인을 만드는 '에디터 창', 그리고 오른쪽은 Android에 들어가는 버튼이나 문구 등등의 속성을 설정하는 '속성 창'이다. 가운데 부분을 제외한 양 옆 구역은 최소화(-)시켜 화면을 정리하는 것도 가능하다.

 

양 옆 구역을 최소화하면, 그나마 복잡해보이는 화면이 조금이나마 정리된다.

 

가운데 부분은 실제 Android 휴대폰에 나타나는 디자인과 앱 코드를 작성하는 부분이다. 빈 프로젝트를 생성했다면, 필자와 마찬가지로, 2개의 파일이 가운데 구역에 열려 있는 것을 확인할 수 있다.

 

 

activity_main.xml과 MainActivity.kt파일이 있는데, 필자와 같은 화면을 보기 위해서는 activity_main.xml을 선택하면 된다.

 

현재 필자의 화면에는 디자인 부분만 표시되어 있어서 코드를 어디에 작성하는지 의아한 분들이 분명 있을 것이다. 가운데 구역의 우측 상단을 보자. 

 

 

Code, Split, Design 세 항목으로 나누어진 버튼이 보이는데, 이 항목들은, 가운데 코딩 및 디자인 영역 중. 어떤 영역을 보이게 할 지 선택하는 버튼이라고 보면 된다. 현재 필자는 Design으로 선택되어 있기 떄문에 마치 스마트폰 화면과 비슷한 사각형 두 개가 나타나 있는 것이다. 만약 필자가 Code를 선택하면, 이 디자인과 관련된 코드를 작성할 수 있는 창이 하나 나타나며, Split을 선택하면, 가운데 화면이 두 부분으로 나뉘어져 좌측은 코드, 우측은 디자인 관련 화면이 나타나게 된다. 

 

 

기본값으로 눈에 보이지 않는 화면 아래 구역도 존재한다. 우측 아래에 Event Log라고 적힌 버튼을 누르면, 아래에 새 구역이 새로 나타나는데 Android Studio를 구동하면 나타나는 로그를 확인할 수 있는 부분도 있다. 

 

 

화면이 복잡해보이는데, 구성은 이게 끝이다. 이제 안드로이드 프로그램 제작을 위해 어떤 파일이 필요한지, 프로젝트 창의 폴더 트리를 한 번 살펴보자.

 

 

2. Android 앱 제작에 필요한 파일

 

Android 앱 제작 파일을 이해하기 위해서, Android에서 사용하는 용어에 조금 익숙해질 필요가 있다. 우선, 프로젝트 창에서 주요 파일이 위치한 폴더만 화살표를 눌러 확장한 다음, 해당 파일의 이름을 쭉 살펴보자.

 

 

우리가 맨 처음 접했던 MainActivity 파일(코틀린 파일)과 activity_main 파일(xml 파일)이 각각 java -> com.example.{프로젝트 명}, res -> layout 폴더 내에 위치하고 있음을 알 수 있다. 여기서 Activity라는 용어는 Android의 화면을 의미하는 것이라고 보면 된다.

 

즉, 코틀린(프로그램 언어의 일종)으로 만들어진 MainActivity 파일은 우리가 제작하려는 앱의 주요 동작을 정의하는 파일이라고 보면 되고, xml로 만들어진 activity_main 파일은 우리가 제작하려는 앱의 화면을 구성하는 파일이라고 생각하면 된다. 

 

이 두 파일 외에, 중요한 파일이 하나 더 존재하는데, 팔래트 창의 가장 위에 위치한 Manifest 파일이 바로 그것이다. AndroidManifest라는 이름의 이 파일은 activity_main과 마찬가지로 xml로 만들어진 파일인데, 이 파일은 우리가 제작하려는 앱이 몇 개의 화면(Activity)을 가지는지, 여러 Activity 중 어느 Activity가 시작 부분인지 등의 정보가 표시된다.

 

 

이외에도 살펴볼 파일이 몇 개 있지만, Hello World를 프린트하는 작업을 진행함에 있어서 크게 중요한 파일들은 아니니, 추후 필요할 때 다시 언급하려 한다. 

 

정리하자면, Android 앱 제작에 필요한 주요 파일은 다음과 같다.

 

(1) Android 앱의 화면을 디자인하는 activity_main.xml 파일

(2) Android 앱의 동작을 정의하는 MainActivity.kt파일

(3) Android 앱의 구성을 정의하는 Manifest 파일

 

이제, 본격적으로 Hello Print 화면을 출력해보도록 하자.

 

 

 

3. 에디터 창에서 Hello World를 출력하는 앱을 디자인하기

 

에디터 창에서 activity_main.xml 파일을 선택하면 좌측 상단에 Pallete 창이 보인다. 

 

이 창은 Android 화면에 넣을 수 있는 몇몇 디자인을 목록화해 두었는데, 앱에서 필요한 항목을 단순히 끌어옴으로써, 앱 화면을 구성할 수 있다. 이렇게 드래깅으로 앱 화면을 구성하면 Android Studio가 해당 코드 또한 자동으로 생성하게 된다.

 

에디터 창만 남기고 모든 창을 최소화한 뒤, Split 모드로 전환하고 text -> plain text 1개를 화면의 정중앙에 위치시켜보자. 아마 아래와 같이 코드와 화면 디자인이 변할 것이다.

 

화면에 어떠한 디자인 항목도 추가하지 않은 상태의 코드화 디자인

Text -> Plain Text 1개를 화면 정중앙에 위치시킨 뒤의 코드와 디자인

 

다시 Split에서 Design 화면으로 전환하고, 추가한 Text를 클릭한 뒤, 속성 창을 열어보자. 속성창을 열면, 해당 Text의 글씨 크기, 내용 등을 수정할 수 있는 필드가 제공된다. 

 

 

우리는 우선 내용만 변경해보자. Common Attritube의 가장 위에 위치한 text 필드의 내용만 Hello World로 바꿔보자.

 

 

화면 디자인에 Hello World가 출력되는 것을 확인할 수 있다. 

 

그런데, 화면을 자세히 보니, 팔레트 창 아래에 Component Tree라는 창이 존재하고, 이 창에 방금 우리가 만든 Hello World 텍스트가 경고 딱지가 붙은 것이 보인다. 이 경고 표시를 클릭하면, 해당 경고가 왜 발생되었는지 아래의 로그 화면에 다음과 같은 모양으로 출력된다. 

 

 

Hardcoded Text라는 말로 시작하는 이 말을 얼핏 보니, 우리가 만든 Hello World 라는 텍스트가 Android에서 제공하는 @string 리소스로 변환되지 않아서 경고가 나타나는 것이라 한다. 다행히 해당 경고의 가장 마지막에 Android에서 이 텍스트를 문자열 리소스로 변환해준다고 한다. 경고 설명 문구의 스크롤을 아래로 내려, Fix를 클릭하고 Hello World 문자열을 리소스화 한다.

 

 

컴퓨터가 자동으로 해당 문자열을 리소스화 하기위한 설정값을 입력해놓았다. 이제, OK를 클릭하면 문자열이 리소스화되고 경고 문구도 사라지게 된다. 

 

 

끝이다. 이제 이 앱을 안드로이드 휴대폰에 테스트하여 잘 뜨는지 확인해봐야한다. 

 

 

 

4. 안드로이드 휴대폰을 앱 테스트 기기로 사용하기

 

Android 기기의 '설정' 메뉴에 가면, 가장 아래에 '기기 정보'라는 항목이 존재한다. 이 항목을 클릭하고 들어가면, '소프트웨어 정보'가 존재하는데, 이 항목을 눌러 들어가면 '빌드 번호' 항목이 존재한다. 이 탭을 여러번 클릭하면, 화면에 '개발자 모드가 활성화되었습니다'다는 표시가 나타난다. 

 

다시 설정 앱을 실행하고, 가장 아랫부분의 항목을 살펴보면, 아까는 존재하지 않았던 '개발자 옵션'이라는 항목이 나타난다. 이 항목을 들어가면 기본값으로 개발자 항목이 꺼져있는데, 우선 이를 활성화시켜주자.

 

실제 스마트폰에서 우리가 만든 앱을 테스트하기 위해서는, 이 앱이 Android Studio가 깔린 앱과 USB 케이블로 연결되어야 하고, 스마트폰에서 USB를 통한 디버깅이 가능하도록 설정되어 있어야 한다. 개발자 옵션 항목 체크를 활성화했다면, 조금 더 아래에 위치한 USB 디버깅 항목도 같이 활성화해주자. 물론, USB는 컴퓨터와 연결되어 있어야 한다.  

 

위와 같이 설정이 진행되고 나면, Android Studio의 우측 상단에 우리가 연결한 스마트폰의 정보가 나타나게 된다. 

 

 

이제 우리가 만든 앱을 연결한 스마트폰에서 실행해보자. 연결된 기기를 확인한 항목의 오른쪽에 보면, 초록색의 재생 아이콘이 있는데, 이것이 우리가 만든 프로그램을 스마트폰에서 테스트 용도로 실행하도록 만드는 Run 버튼이다. 이 버튼을 클릭하면 Android Studio는 우리가 만든 디자인과 코드를 컴파일(컴퓨터가 이해할 수 있는 언어로 변환)하여 스마트폰에서 재생하게 된다. 클릭을 하고 조금 기다리면, 연결한 스마트폰의 화면이 우리가 만든 앱 화면으로 변하게 된다.

 

실제 연결된 스마트폰에서 스크린샷 한 결과.

 

---

 

지금까지 Android Studio를 이용하여, Hello World를 출력하는 앱 제작 및 해당 앱을 테스트 스마트폰에서 동작시켜보는 과정까지 알아보았다. 다음 포스팅에서는 오늘 만든 String 리소스 "hello_world"의 값을 변화시키는 방법 및 다국어 적용 방법에 대해 알아보려 한다. 

 

 

FIN.