시온고 안드로이드 스터디 노트 - 1.Create Project Sunshine
2014.12.30
2014.12.30
몇 주 전 부터 교내에서 친구 몇명 모아서 안드로이드 스터디를 하고 있습니다. 구글 코리아 측에서 스터디 그룹 프로그램을 해서 해 보게 되었는대. 2차 지필평가로 인해 진도가 많이 밀렸습니다. Udacity(udacity.com) 에 있는 Developing Android Apps코스를 기반으로 진행 중입니다. 7~8개의 레슨으로 구성 되어 있는대. 레슨 하나가 마무리 될 때마다. 이렇게 글로 정리를 해 보고자 합니다. 한참 진도가 늦습니다만… 일단 드디어 레슨 1 을 마무리 했으므로. 레슨 1 을 정리해 보고자 합니다.
레슨 1 은 대략 아래와 같은 내용으로 구성되어 있습니다. 하나씩 자세히 알아봅시다. 스터디 에서는 가장 처음에 Git에 대해서도 다뤘고, 간단히 안드로이드 플랫폼에 대한 설명도 했었으나, Git 사용법은 검색 좀 해보면 나오고, 안드로이드가 뭔지는 다들 알기 때문에 이 글에서는 생략 하겠습니다.
안드로이드 앱을 Java 로 작성하고. 우리가 안드로이드 앱 개발에 사용할 도구가 JDK를 유구하기에. 우선, JDK를 설치 하여야 합니다.
Ubuntu, Arch Linux 계열 리눅스를 사용하시면, 이 부분을 건너 뛰세요.
# "<파일이름>" 은 다운로드 받은 파일의 이름으로 합니다
sudo rpm -i <파일이름>
# 명령어 예시 : sudo rpm -i jdk-8u25-linux-x64.rpm
터미널에서 다음 명령어로, WebUpd8 JDK 저장소를 추가하고, 설치를 진행합니다.(아래 명령어는 JDK8을 설치합니다)
sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java8-installer
간단히 AUR에서 받아다 설치합니다. 아래 명령어를 실행하세요.
yaourt -S jdk
sudo -i
cd /usr/java/
cp (*.tar.gz 파일의 상위 경로)/(해당 파일 이름).tar.gz (해당 파일 이름).tar.gz
tar zxvf (해당 파일 이름).tar.gz
Java 로 작성된 프로그램을 실행하기 위해, JAVA_HOME 변수와, Path 변수를 설정해 주어야 합니다.
먼저 프로필 파일을 텍스트 에디터로 열어주세요.
# "gedit" 은 텍스트 에디터 이름 입니다.
# 다른 텍스트 에디터 사용시 gedit 대신 해당 에디터 이름을 입력하세요.
# 사용중인 계정에 대해서만 설정 할 경우
gedit ~/.bash_profile
# 시스템 전체적으로 설정 할 경우
# (시스템 영역에 접근하여 파일 수정시, 루트 권한이 필요하므로, 앞에 sudo를 붙입니다.)
sudo gedit /etc/profile
에디터로 열었으면, 가장 아래에 다음을 추가 하세요.
# <JDK경로>는 여러분의 시스템에 JDK 가 설치된 경로로 하시면 됩니다.
export JAVA_HOME=<JDK경로>
# 예시 : export JAVA_HOME=/usr/java/jdk1.8.0_25
export PATH=$JAVA_HOME/bin:$PATH
다 했으면, 저장하고 에디터를 닫습니다. 그리고 아래 명령어로 설정한 것을 적용 시키세요.
# 사용중인 계정에 대해서만 설정 한 경우
source ~/.bash_profile
# 시스템 전체적으로 설정 한 경우
source /etc/profile
아래 명령어를 실행하여 확인합니다.
java -version
http://developer.android.com/sdk/index.html 위 URL 에 접속하여 Android Studio 를 다운로드 하세요.
앱 개발 및 빌드에 필요한 각종 API 패키지나 빌드툴 등을 SDK Manager 를 통해 다운로드 합시다.
이제 프로젝트를 하나 새롭게 생성 해 봅시다. 생성 과정 중에 Minimum SDK, Target SDK, Package Name 등을 정하게 됩니다.
다음 화면으로 넘어가서 어떤 디바이스를 위한 앱을 개발할지 선택하고, Minimum SDK 를 지정합니다. 이 글에서는 휴대전화/태블릿 앱을 개발한다고 보고 Phone and Tablet 만 선택하고 Minimum SDK 를 선택하겠습니다.
다음 화면에서 새로 만들 Activity 형태를 선택합니다. 지금은 Blank Activity with Fragment 를 선택합니다. 그리고 마지막으로 Activity 이름을 지정하고 프로젝트 생성을 마칩니다.
안드로이드 스튜디오에서, 앱은 Gradle 이라는 빌드 시스템에 의해 빌드 됩니다. Gradle 은 일종의 세련된(?) 빌드 시스템으로 안드로이드 스튜디오와 함께 공개 되었습니다. DSL 이라는 선언문 형태의 언어로 빌드 스크립트를 작성하여 빌드를 설정합니다. 간단히 빌드 과정에 대해 알아봅시다.
별도로 USB 드라이버를 설치해야, Android Studio 에서 디바이스를 인식 할 수 있습니다. 설치 방법은 제조사 마다 차이가 있으므로, 여기에서는 다루지 않겠습니다. 구글링 하시면 금방 알아내실 수 있습니다.
기본적으로 생성된 코드를 한번 살펴 봅시다. 좌측 프로젝트 탐색 메뉴에서 MainActivity.java 를 열어주세요.
코드의 상단에는 아래와 같은 내용이 있습니다. MainActivity 클래스가 정의 되어 있는 것을 보실 수 있습니다.
//ActionBarActivity 를 상속 하는 MainActivity 클래스가 정의되어 있습니다.
public class MainActivity extends ActionBarActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...
그리고 스크롤을 하다 보면 다음과 같이 PlaceholderFragment 클래스가 MainActivity 클래스 내부에 정의 되어 있습니다.
/**
* A placeholder fragment containing a simple view.
*/
public static class PlaceholderFragment extends Fragment {
public PlaceholderFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
return rootView;
}
}
...
Activity 는 뭐고, Fragment 는 뭘까요?
간단한 Fragment 레이아웃을 하나 만들어 봅시다. 좌측 프로젝트 탐색 메뉴에서 fragment_main.xml 파일을 열어주세요.
사진과 같은 화면이 보이나요? 왼쪽 팔레트에서 원하시는 뷰(View) 를 마우스로 드래그해서 배치해 보세요. 안드로이드 에서는 화면에 표시되는 각각의 구성요소(예 : 버튼, 텍스트, 이미지 등) 을 통틀어서 뷰(View) 라고 합니다. View 도 종류가 매우 다양합니다.
View 도 상당히 그 종류가 다양합니다. 나눠보자면 대략 이렇게 나눠집니다.
딱히 자세히 설명하지 않아도 될 것 같내요. 버튼이나 텍스트, 드롭다운 박스, 텍스트 같은 조그마한 컨트롤이나 기본적인 요소 들입니다.(예 : TextView, Button, ImageVIew, Spinner …)
하나 이상의 View 를 포함 내부에 할 수 있는 View 입니다.(예 : 각종 Layout, AdapterView)
Layout 은 여러 뷰들을 화면상에 어떻게 배치할지 정해주는 ViewGroup 입니다. 대표적으로 FrameLayout, LinearLayout, RelativeLayout 이 있습니다.
목록과 같이 일련의 데이터들을 표시 하고자 할때 사용합니다. 데이터들을 화면에 표시할 때, Adapter 를 이용하여 표시해서 AdapterView 라고 합니다. (예 : ListView, GridView …)
아래와 같은 과정을 거쳐, 간단한 ListView 를 구현해 봅시다.
fragment_main.xml 파일을 수정하여, Layout 을 변경해 봅시다. 우리는 화면을 ListView로 가득 체울 것이므로. FrameLayout 을 사용하고 그 내부에 RelativeLayout 을 배치 할 것입니다.
먼저 fragment_main.xml 을 열고, 하단에 탭을 Design 에서 Text 로 변경하여, 텍스트 편집 화면으로 바꾸세요. 아래와 같은 코드가 보이나요?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity$PlaceholderFragment">
<TextView android:text="@string/hello_world" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
이 코드에서, RelativeLayout을 FramgLayout 으로 변경하고. 기존에 내부에 있던 TextView 를 지운다음, ListView 를 넣읍시다. 그러면 아래와 같이 코드가 바뀝니다.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity$PlaceholderFragment">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/listView"/>
</FrameLayout>
MainActivity.java 를 열어 동작을 구현해 봅시다. 우리는 Fragment 에 동작을 구현할 것이므로, Framgnet 코드를 먼저 찾으세요. 아래와 같은 코드를 찾았나요?
/**
* A placeholder fragment containing a simple view.
*/
public static class PlaceholderFragment extends Fragment {
public PlaceholderFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
return rootView;
}
}
...
문자열 배열로 ListView 에 넣을 데이터를 하나 만듭시다. 이름은 myArray 라고 하겠습니다.
String[] 현태로 데이터를 만들고, 나중에 유동적으로 데이러를 넣고 빼기 위해, List
...
public PlaceholderFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
//문자열 배열로 ListView에 넣을 데이터 만들기. 이름은 myArray.
String[] myArray = {"Sample Item 0", "Sample Item 1", "Sample Item 2", "Sample Item 3", "Sample Item 4"};
List<String> myArrayList = new ArrayList<String>(Arrays.asList(myArray)); //ArrayList로 변환합니다. 동적으로 항목을 추가하거나 뺄 수 있습니다.
return rootView;
}
}
...
그리고 우리가 준비한 데이터와 ListView 사이에서 다리 역할을 하는 Adapter 를 하나 초기화 해서 만들어 줘야 합니다. 먼저 Adapter 에 대해 알아 봅시다.
Adapter 는 언급한 바와 같이, AdapterView 와 AdapterView에 표시될 데이터 사이에서 다리 역할을 해 줍니다. Adapter 는 처음에 초기화 될때 매개변수로 받은 데이터를 가지게 되고 가진 데이터를 관리하며, AdapterView 에 표시될 View 를 필요한 만큼 가지고 있는 데이터에서 항목을 확인해 각 데이터에 해당되는 View 를 만들어 줍니다.
우리는 다양한 Adapter 중. ArrayAdapter 를 사용 할 것 입니다. 아래와 같이 초기화 합니다. 몇가지 매개변수를 요구하는대, 아래 코드를 참고해서 입력 하시면 됩니다.
...
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
//문자열 배열로 ListView에 넣을 데이터 만들기. 이름은 myArray.
String[] myArray = {"Sample Item 0", "Sample Item 1", "Sample Item 2", "Sample Item 3", "Sample Item 4"};
List<String> myArrayList = new ArrayList<String>(Arrays.asList(myArray));
//ArrayAdapter 초기화
ArrayAdapter<String> myAdapter = new ArrayAdapter<String>(
getActivity(), //Context - Fragment 는 Context 를 가지지 않으므로 Activity 에서 얻어옴
android.R.layout.simple_list_item_1, //각 항목별 Layout - 일단은 안드로이드 시스템 내장 리소스 얻어옴
myArrayㅣ냣); //ListView 에 표시될 데이터
return rootView;
}
...
findViewById 를 이용해 ListView를 id값으로 찾습니다.
...
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
//문자열 배열로 ListView에 넣을 데이터 만들기. 이름은 myArray.
String[] myArray = {"Sample Item 0", "Sample Item 1", "Sample Item 2", "Sample Item 3", "Sample Item 4"};
List<String> myArrayList = new ArrayList<String>(Arrays.asList(myArray));
//ArrayAdapter 초기화
ArrayAdapter<String> myAdapter = new ArrayAdapter<String>(
getActivity(), //Context - Fragment 는 Context 를 가지지 않으므로 Activity 에서 얻어옴
android.R.layout.simple_list_item_1, //각 항목별 Layout - 일단은 안드로이드 시스템 내장 리소스 얻어옴
myArrayList); //ListView 에 표시될 데이터
//ListView 찾기
ListView LV = (ListView)rootView.findViewById(R.id.listView); //R.id.(ListView id 값 - Layout 파일에서 확인 가능)
return rootView;
}
...
마지막으로 LitView 에 Adapter 를 설정해 ListView 와 Adapter 가 서로 작용하도록 합시다.
...
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
//문자열 배열로 ListView에 넣을 데이터 만들기. 이름은 myArray.
String[] myArray = {"Sample Item 0", "Sample Item 1", "Sample Item 2", "Sample Item 3", "Sample Item 4"};
List<String> myArrayList = new ArrayList<String>(Arrays.asList(myArray));
//ArrayAdapter 초기화
ArrayAdapter<String> myAdapter = new ArrayAdapter<String>(
getActivity(), //Context - Fragment 는 Context 를 가지지 않으므로 Activity 에서 얻어옴
android.R.layout.simple_list_item_1, //각 항목별 Layout - 일단은 안드로이드 시스템 내장 리소스 얻어옴
myArrayList); //ListView 에 표시될 데이터
//ListView 찾기
ListView LV = (ListView)rootView.findViewById(R.id.listView); //R.id.(ListView id 값 - Layout 파일에서 확인 가능)
//Adapter 설정
LV.setAdapter(myAdapter);
return rootView;
}
...
사진과 같이 잘 나오나요? Lesson 1 내용은 여기까지 입니다.
Lesson 1 에 해당되는 소스코드 입니다. https://github.com/sukso96100/zionhs_android_study/tree/lesson1