05. 레이아웃 객체

Download Report

Transcript 05. 레이아웃 객체

“구글의 안드로이드 프로그래밍” 4강 요약 정리
서강대학교 게임교육원 게임소프트웨어 개발학과 김성애
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
01. ACTIVITY
ACTIVITY란 윈도우 OS의 ‘윈도우’와 같은
애플리케이션의 화면을 칭한다.
윈도우 OS처럼 안드로이드 애플리케이션도
여러 개의 ACTIVITY를 가질 수 있다.
01. ACTIVITY
SYSTEM
ACTIVITY
ACTIVITY는 UI COMPONET를 화면에 표시
하고
USER
시스템, 유저와 프로세싱 한다.
01. ACTIVITY
새로운 화면이 열리면 이전화면은
히스토리 스택[Task stack]에
저장된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
액티비티 생성
01. ACTIVITY
+ 액티비티 라이프 사이클
onCreate()
액티비티가 생성될 때
처음 호출되는 메소드.
리소스를 초기화한다.
01. ACTIVITY
+ 액티비티 라이프 사이클
onStart()
ACTIVITY가 사용자에
보여줄 준비가 되었을
때 호출된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
onResume()
ACTIVITY STACK의
맨 위에 있다.
사용자의 입력처리가
가능할 때 호출된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
액티비티 활성화
01. ACTIVITY
+ 액티비티 라이프 사이클
다른 액티비티가
위로 올 경우
01. ACTIVITY
+ 액티비티 라이프 사이클
onPause()
데이터의 저장,
애니메이션의 중지,
CPU소비 중단 수행.
이전 액티비티가
Resume되기 전 호출
된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
액티비티가 최상위로
온다.
01. ACTIVITY
+ 액티비티 라이프 사이클
액티비티가 화면에
보이지 않을 경우
01. ACTIVITY
+ 액티비티 라이프 사이클
onStop()
액티비티가 스택의
최상위에 있지 않으므로
보여지지 않는다.
01. ACTIVITY
+ 액티비티 라이프 사이클
Stop된 ACTIVITY가
다시 최상위 화면으로
올 경우
01. ACTIVITY
+ 액티비티 라이프 사이클
onRestart()
ACTIVITY가 멈췄을
경우에 재시작하고자
할 때 호출된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
onDestroy()
호출되면 ACTIVITY를
파기한다.
01. ACTIVITY
+ 액티비티 라이프 사이클
다른 어플리케이션에서
메모리가 필요할 때
01. ACTIVITY
+ 액티비티 라이프 사이클
프로세스가 종료된다.
01. ACTIVITY
+ 액티비티 라이프 사이클
유저가 해당
ACTIVITY로
돌아가고자 할 때
01. ACTIVITY
+ INTENT
ACTIVITY
ACTIVITY
intent
ACTIVITY
INTENT란 안드로이드에서 화면과 화면사이를
이동할 때 쓰는 클래스로 어플리케이션이 해야 하
는 정보가 담겨있다.
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
02. Intent receiver, Service, Content provider
02. Intent receiver, Service, Content provider
INTENT Receiver란 네트워크 접속의 활성화나
전화가 걸려오는 등 외부에서 이벤트가 발생했을
때 처리하기 위해 사용된다.
Notification Manager를 이용해서 사용자에게
어떤 일이 발생했는지를 알려준다.
02. Intent receiver, Service, Content provider
ACTIVITY
ACTIVITY
ACTIVITY
SERVICE
Service는 화면으로 보여지는 것과 상관 없이 오랫
동안 존재하면서 실행되는 코드이다.
Activity의 Context.startService()문장을 실행하면
해당 서비스를 멈출 때까지 Service로 실행한다.
02. Intent receiver, Service, Content provider
Data Sharing
APPLICATION
APPLICATION
Content Provider 클래스를 이용하면 애플리케이션
에서 SQLite 데이터베이스에 저장하지 않고 데이터
를 저장하거나 다른 애플리케이션과 데이터를 공유
할 수 있다.
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
03. 프로세스 라이프 사이
클
FOREGROUND ACTIVITY
VISIBLE ACTIVITY
사용자가 현재 조작중인
BACKGROUND ACTIVITY
최상위 화면의 ACTIVITY.
가장 중요한 프로세스로
메모리가 부족해도 가장
마지막에 제거된다.
EMPTY PROCESS
03. 프로세스 라이프 사이
클
FOREGROUND ACTIVITY
VISIBLE ACTIVITY
사용자 화면에는 보여지지만
BACKGROUND ACTIVITY
최상위화면이 아닌 화면.
FOREGROUND ACTIVITY
다음으로 중요하다.
EMPTY PROCESS
03. 프로세스 라이프 사이
클
FOREGROUND ACTIVITY
VISIBLE ACTIVITY
사용자에게 보여지지 않고
BACKGROUND ACTIVITY
멈춘 화면. 상위, 차상위
프로세스가 메모리 요구 시
제거된다.
EMPTY PROCESS
03. 프로세스 라이프 사이
클
FOREGROUND ACTIVITY
VISIBLE ACTIVITY
Service, BroadcastReceiver
BACKGROUND ACTIVITY
클래스와 같이 ACTIVITY도
없고
애플리케이션 컴포넌트도 없
는
EMPTY PROCESS
것을 EMPTY PROCESS라고
한다. 메모리가 부족해지면
시스템에 의해 즉시 제거된다.
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
04. 화면 구성 요소들의 계층구조 + View
View 클래스는 직사각형 형태의
레이아웃과 각종 정보를 저장하
는 자료구조이다.
화면의 크기, 레이아웃, 그리기,
포커스 변화, 스크롤링과 키 처리
등을 위해 사용된다.
04. 화면 구성 요소들의 계층구조 + ViewGroup
ViewGroup은 다양한 형태의
View들의 집합이다.
ViewGroup은 View안에 또
다른 View를 포함하는 구조적
형태를 지원한다.
04. 화면 구성 요소들의 계층구조 + 트리구조의 사용자 인터페이스
안드로이드에서는 Activity의 UI를 View와
ViewGroup의 트리구조를 이용하여 구성한다.
각 ViewGroup은 가용 공간 계산 후 하위의 View를
배치한다.
04. 화면 구성 요소들의 계층구조 + LayoutParams
LayoutParams의 서브 클래스
는
뷰 객체들을 어떻게 그려야 하
는 지에 대한 정보를 부모 객
체에게 알려준다.
각 하위 요소들은 부모의 속성
에 맞는 LayoutParams를 정
의해야 한다. 모든 뷰그룹은
가로,세로,여백, 테두리 속성을
가지고 있다.
04. 화면 구성 요소들의 계층구조 + LayoutParams
WRAP_CONTENT
FILL_PARENT
-WRAP_CONTENT
-FILL_PARENT
콘텐츠를 표시하는 데
부모 객체와의 패딩(여
필요한 최소한의 크기
백)
로
을 제외한 나머지 모든
그린다.
공간을 차지한다.
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
05. 레이아웃 객체 + FrameLayout
가장 단순한 레이아웃 객체로, 모든
객체들이 화면의 왼쪽 위를 기준으로
그려진다.
기준점을 설정할 수 없으며 특정 객체
를 그린 후 다른 객체를 그리면 먼저
그린 객체는 가려진 만큼 지워진다.
05. 레이아웃 객체 + LinearLayout
LinearLayout
Click to add
Name
Comments
LinearLayout은 모든 하위 구성요소
를
수직, 수평 형태 중 하나로 정렬하여
그리는 형식이다.
하위 구성 요소들 간의 마진과 정렬,
가중치값을 지정할 수 있다.
05. 레이아웃 객체 + LinearLayout
LinearLayout
LinearLayout
Click to add
Click to add
Name
Comments
Name
Comments
가중치 값은 화면 구
성 요소들이 남는 공
간을 어떻게 활용할
지 결정하는 값으로,
가중치값이 다르면
남는 공간을 가중치
비율별로 배분한다.
가중치 기본 값이 전부 0일
Comments에 가중치 값을
때
1로 주었을 경우
05. 레이아웃 객체 + TableLayout
G
5:57 PM
Views/Layouts/TableLayout/Ex 4
Open…
Save As…
Ctrl-O
Ctrl-Shift-S
TableLayout에서는 테
이블의 행과 열을 기준
으로 하위 구성요소들을
배치한다.
TableLayout 컨테이너
는 테두리 라인을 표시
하지 않는다.
05. 레이아웃 객체 + AbsoluteLayout
(0,0)
(x1,y1)
AbsoluteLayout
Click to add
(x2,y2)
Name
AbsoluteLayout에서는 하위 구
성 요소들을 화면에 표시하기 위
해서 x,y 좌표를 직접 설정해주어
야 한다.
(xn,yn)
Comments
좌측상단을 기준으로 (0,0)이나
서로 다른 단말기 환경에서는 예
상과 다르게 그려질 수 있기 때문
에 가급적 사용하지 않는다.
05. 레이아웃 객체 + RelativeLayout
Views/Layouts/RelativeLayout/Example
Type here:
Cancel
OK
RelativeLayout에서는 하위 구성 요소들이 다른 구성 요소
의 상대적인 위치에 그려진다.
05. 레이아웃 객체 + RelativeLayout
TextView
•ID : label1
•Width : fill_parent
•height:
wrap_content
•Text : Type here:
RelativeLayout
Views/Layouts/RelativeLayout/Example
•Width : fill_parent
•Height : wrap_content
•Background : gray
•Padding : 10
Type here:
Cancel
OK
EditText
•ID : textEntry
•Width : fill_parent
•Height : wrap_content
•Below : “label1”
Button
•Width : wrap_content
•Height : wrap_content
•toLeft : “okButton”
•alignTop : “okButton”
•Text : “Cancel”
Button
•ID : okButton
•Width : wrap_content
•Height : wrap_content
•Below : “textEntry”
•alignParentRight : true
•marginLeft : 10
•Text : “OK”
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
06. XML을 이용한 화면 디자인
화면 디자인을 하드 코딩하는 번거로운 작업
을 피하기 위해 화면디자인을 XML파일로 표
<?xml version = “1.0” encoding = “utf-8”?>
<!– Demonstrate using a relative layout to
create a form -->
<RelativeLayout xmlns:android = “http://schemas.
android.com/apk/res/android
android:layout_width = “fill_parent”
android:layout_height = “wrap_content”
android:padding = “10px” >
<TextView android:id = “@+id/label”
android:layout_width
android:layou
andro
현하고 프로그램 소스와 분리하여 작업한다.
안드로이드 GUI 클래스와 일치하는 태그로
구성되며, 각 클래스들의 메소드와 대부분 유
사한 속성을 가지고 있다.
이러한 태그를 엘리먼트라고 하며, 엘리먼트
의 속성들은 클래스의 메소드와 유사한 개념
이다.
06. XML을 이용한 화면 디자인
Views/Layouts/RelativeLayout/Example
Type here:
Cancel
OK
TextView, EditText, Button, Button
엘리먼트들의 나열 및 설정을 통해 화
면 디자인.
06. XML을 이용한 화면 디자인
<?xml version=“1.0”encoding=“utf-8”?>
<!-- Demonstrates using a relative layout to create a form -->
<RelativeLayout xmlns:android=“http://schema.android.com/apk/res/android
android:layout_width = “fill_parent”
android:layout_height= “wrap_content”
android:padding = “10px”>
<TextView android:id=“@+id/label”
android:layout_width=“fill_parent”
android:layout_height= “wrap_content”
android:backgroud=“@android:drawable/editbox_backgroud”
android:layout_below=“@id/label”/>
<EditText id=“@+id/entry”
android:layout_width=“fill_parent”
android:layout_height=“wrap_content”
android:backgroud=“@android:drawable/editbox_backgroud”
android:layout_below=“@id/label”/>
06. XML을 이용한 화면 디자인
<Button id=“@+id/ok”
android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_below=“@id/entry”
android:layout_alignParentRight=“true”
android:layout_marginLeft=“10px”
android:text=“OK”/>
<Button android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_toLeftOf=“@id/ok”
android:layout_alignTop=“@id/ok”
android:text=“Cancel”/>
<RelativeLayout>
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
Chapter 04 애플리케이션의 구조와 사용자 인터페이스
01. ACTIVITY
02. Intent receiver
Service
Content provider
03. 프로세스
라이프 사이클
07. 후킹, 이벤트, 테마
04. 화면 구성 요소들의
계층구조
05. 레이아웃 객체
06. XML을 이용한 화면 디자인
07. 후킹, 이벤트, 테마
07. 후킹, 이벤트, 테마
화면을 구성하는 xml파일 내의 엘리먼트를 자주 접근해야 하기 때문에 애플리케
이션 실행중에 텍스트 박스의 내용을 변경하려면 프로그램소스에서 접근해야 한다.
<TextView android:id=“@+id/label”
Label아이디가 가리키는 엘리먼트의 주소
는
android:layout_width=“fill_parent”
R클래스에 기록된다. R클래스를 살펴보면
android:layout_height= “wrap_content”
엘리먼트를 구할 수 있다.
android:backgroud=“@android:drawable/editbox_backgroud”
android:layout_below=“@id/label”/>
안드로이드에서 특정 엘리먼트를 검색하는 것을 ‘후킹(hooking)’이라고 한다.
엘리먼트를 검색하는 것은 엘리먼트의 핸들을 얻는 것으로
Activity.findViewById()
메소드를 호출해 화면 엘리먼트의 핸들을 얻는다.
07. 후킹, 이벤트, 테마
Public class SendResult extends Activity{
protected void onCreate(Bundle savedValue){
…
사용자 인터페이스를 위한
이벤트 처리 메소드는 외부
//Listen for button clicks.
에 노출되어 있다.
Button button = (Button)findViewById(R.id.corky);
그러나 버튼과 같은 몇몇
button.setonClickListner(mCorkyListener);
컴포넌트들은 이벤트 처리
}
//Create an anonymous class to act as a button click listner.
메소드가 별도로 제공되지
Private onClickListener mCorkyListener = new
않기 때문에 왼쪽과 같이 콜
OnClickListener() {
백(callback) 메소드를 수동
public void onClick(View v) {
Intent data = new Intent();
Data.setAction(“Corky!”);
setResult(RESULT_OK, data);
finish();
}
};
으로 등록해야 이벤트를 처
리할 수 있다.
07. 후킹, 이벤트, 테마
<!-- AndroidManifest.xml -->
<manifest xmlns:android =
G
Hello, Android
5:57 PM
Hello World, HelloAndroid
http://schemas.android.com/apk/res/android
package = “com.android.home”>
<application android:theme = “android:style/Theme_Black”>
<activity class = “.Home”
…
</activity>
</application>
</manifest>
protected void onCreate(Bundle icicle)//하드코딩을
{
통해 테마적용
super.onCreate(icicle);
…
setTheme(android.R.style.Theme_Light);
setContentView(R.layout.linear_layout_3);
}
테마는 애플리케이션의 전
체적인 분위기를 설정한다.
테마를 설정하려면
‘AndroidManifest.xml’파
일을 수정해야 한다.
이미지 출처
https://people.chem.umass.edu/wiki/images
http://androidkr.blogspot.com/2009/03/android-activity-task.html
감사합니다.