▷ 9장 실습
- 리소스 종류와 특징
리소스 : 정적 자원, 많이 사용할수록 코드를 더 간결하게 작성이 가능하다.
- 앱 리소스 사용하기
디렉터리명 | 리소스 종류 | 디렉터리명 | 리소스 종류 |
animator | 속성 애니메이션 XML | mipmap | 앱 실행 아이콘 리소스 |
anim | 트윈 애니메이션 XML | layout | 레이아웃 XML |
color | 색상 상태 목록 정의 XML | menu | 메뉴 구성 XML |
drawable | 이미지 리소스 | raw | 원시 형태로 이용되는 리소스 파일 |
values | 단순 값으로 이용되는 리소스 | xml | 특정 디렉터리가 정의되지 않은 나머지 XML파일 |
font | 글꼴 리소스 |
→ 표에 있는 리소스 디렉터리는 고정이고 res 디렉터리 아래에 개발자가 임의로 이름을 붙인 디렉터리를 만들 수 없고 하위 디렉터리에 추가할 수 없다.
→ valuse에 추가하는 파일을 제외하고 모두 자바의 이름 작성 규칙을 지켜야 하며 알파벳 대문자를 사용할 수 없다.
→ 레이아웃 리소스 - layout 디렉터리
화면을 구성하는 레이아웃 XML 파이을 저장하는 디렉터리이다.
→ 이미지 리소스 - drawable 디렉터리
이미지 리소스를 저장하는 디렉터리이다.
PNG, JPG, GIF, 9.PNG 파일을 저장 가능하다.(XML로 작성된 이미지도 저장 가능)
→ XML 이미지 제작 규칙
태그 | 설명 |
<shape> | 도형을 의미하고 android:shape="rectangle"처럼 shape 속성을 이용해 도형의 타입을 지정 shape값은 rectangle, oval, line, ring중에서 선택 가능 |
<corners> | 둥근 모서리를 그리는데 사용 shape값이 rectangle일때 사용가능 |
<gradient> | 그라데이션 색상 지정 |
<size> | 도형의 크기 지정 |
<solid> | 도형의 색상 지정 |
<stroke> | 도형의 윤곽선 지정 |
→ 실행 아이콘 리소스 - mipmap 디렉터리
앱을 기기에 설치하면 나타나는 시행 아이콘의 이미지 리소스가 저장되는 디렉터리
→ 값 리소스 - values 디렉터리
값으로 이용되는 리소스를 저장하는 디렉터리
문자열, 색상, 크기, 스타일, 배열 등의 값을 XML로 저장할 수 있다.
values 디렉터리에 저장되는 리소스는 문자열 이외에도 색상, 크기, 스타일 등이 있다.
색상 : color태그로 등록
크기 : dimen태그로 등록
□ 코드에서 색상과 크기 리소스 사용
binding.textView.text = getString(R.string.txt_data2)
binding.textView.setTextColor(ResourcesCompat.getColor(resources,R.color.txt_color,null))
binding.textView.setTextSize(resources.getDimension(R.dimen.txt_size))
values 디렉터리의 리소스 파일만 파일이 아닌 태그를 R 파일에 등록한다.
→ 색상 리소스 - color 디렉터리
특정 뷰의 상태를 표현하고 그 상태에 적용되는 생상을 등록할 때 사용한다.
□ 색상 리소스 등록
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#ffff0000"/>
</selector>
<item> 태그를 이용해 이 리소스가 적용될 뷰의 상태와 그 상태일 때의 색상을 지정
→ 글꼴 리소스 - font 디렉터리
글꼴 리소스를 저장
TTF, OTF파일을 저장한 후 글꼴을 적용할 뷰에서 사용하면 된다.
- 플랫폼 리소스 사용
앱 개발자가 res 디렉터리에 추가하는 것은 앱 리소스이다.
플랫폼 리소스 : 안드로이드 플랫폼이 제공하는 많은 리소스
안드로이드 탐색 창 -> packages -> Libraries
R 파일에 등록된 식별자로 이용 가능하다.
□ 안드로이드 플랫폼 이미지 사용 방법
android:src="android:drawable/alert_dark_Frame"
- 리소스 조건 설정
어떤 리소스를 특정 환경에서만 적용되도록 설정하는 것
□ 기기별 실행 아이콘 크기
화면밀도 | 크기 | 화면밀도 | 크기 |
XXXHDPI | 192 X 192 | XXHDPI | 144 X 144 |
XHDPI | 96 X 96 | HDPI | 48 X 48 |
MDPI | 36 X 36 |
대부분 앱을 개발할 때 아이콘이 선명하게 출력되도록 기기 크기별로 이미지를 5개씩 준비한다.
→ 리소스 디렉터리 이름에서 붙임표(-) 뒤의 단어가 리소스 조건이다.
만약 아이콘의 파일명이 모두 ic_launcher.png인 경우 R파일에는 식별자 하나만 생성된다.
그런데 이렇게 되면 파일명이 중복되는 문제가 발생되는데 이런 문제를 해결하기 위해 이름이 같은 파일을 하나의 디렉터리가 아닌 mipmap-mdpi, mipmap-hdpi처럼 각각의 디렉터리에 담는다.
이 외에도 많은 리소스 조건이 있다 (Doit! 깡샘의 안드로이드 앱 프로그래밍 with 코틀린 247page 참조)
- 화면 회전에 대응하기
화면 회전에 대응하려면 가로와 세로 방향일 때 출력할 레이아웃 XML 파일을 각각 준비해야 한다.
□ 세로 방향 레이아웃 XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:src="@drawable/image"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:src="@drawable/image2"/>
</LinearLayout>
□ 가로 방향 레이아웃 XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/image"/>
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/image2"/>
</LinearLayout>
두 방향의 SML파일을 만들었는데 두 파일의 이름이 같다.
세로 방향일 때의 파일을 layout디렉터리에 저장하고 가로 방향일 때의 파일을 layout-land로 저장하면 된다.
- 국제 언어 제공하기
글로벌 서비스를 제공하는 앱이라면 리소스 문자열을 각국 언어로 제공해야 한다.
각국의 언어로 된 파일을 저장할 때 name값은 같아야 한다. 두 파일의 리소스 조건을 명시한 각각의 디렉터리에 만들면 된다.( 한국어 파일인 경우 values-ko-rKR 디렉터리에 저장하면 된다)
- 폰 크기의 호환성
안드로이드 시스템에서 도와주는 부분이 있고 개발자가 직접 코드에서 해결해야 하는 부분이 있다.
- 논리적인 단위
크기 | 설명 |
ldpi | 저밀도 화면 ~120dpi |
mdpi | 중밀도 화면 ~160dpi |
hdpi | 고밀도 화면 ~240dpi |
xhdpi | 초고밀도 화면 ~320dpi |
xxhdpi | 초초고밀도 화면 ~480dpi |
xxxhdpi | 초초초고밀도 화면 ~640dpi |
dpi : dots per inch , 1인치 안에 있는 도트의 개수
논리적인 단위를 사용하지 않고 물리적인 단위를 사용할 경우 시스템의 도움을 받을 수 없다.
□ 안드로이드 앱 개발할 때 크기 지정에 사용할 수 있는 단위
단위 | 설명 |
dp(density-independent pixels) | 스크린의 물리적 밀도에 기반을 둔 단위 |
sp(scale-independent pixels) | dp와 유사하며 글꼴 크기에 적용 |
pt(points) | 스크린 크기의 1/72을 1pt로 함 |
px | 픽셀 |
mm | 밀리미터 |
in | 인치 |
- 화면 정보 가져오기
개발자가 크기를 직접 코드에서 조정할 수 있다.
DisplayMetrics : 기기의 다양한 크기 정보를 제공
widthPixels | 가로 화소 수 |
heightPixels | 세로 화소 수 |
densityDpi | 화면 밀도 |
density | mdpi를 기준으로 한 배율, 스케일링할 때 곱하는 값 |
scaleDensity | 문자열 스케일링할 때 곱하는 값 |
xdpi | 정확한 가로 밀도 |
ydpi | 정확한 세로 밀도 |
- 9장 실습
메신저 앱의 인트로 화면 만들기
가로 모드, 세로 모드 한글, 영어 버전으로 제작되었다.
□ 영어 버전 string.xml
<resources>
<string name="app_name">Ch09_Resource</string>
<string name="intro_main">
Find your phone contatct on Messenger
</string>
<string name="intro_detail">
Continuously uploading your contacts helps Facebook and Messenger suggest connections and provide and improve ads for your and others, and offer and better service
</string>
<string name="intro_more">
Learn More
</string>
<string name="intro_button">
TRUN ON
</string>
<string name="intro_delay">
NOT NOW
</string>
</resources>
□ 한글 버전 string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Ch09_Resource</string>
<string name="intro_main">
Messenger에서 휴대폰 연락처에 있는 사람들을 찾아보세요
</string>
<string name="intro_detail">
연락처를 계속 업로드 하면 Facebook 및 Messenger에서 연결된 연락처를 추천하고 회원님과 다른 사람들에게 더욱 관련성 높은 광고를 표시하여 더 나은 서비스를 제공하는 데 도움이 됩니다.
</string>
<string name="intro_more">
더 알아보기
</string>
<string name="intro_button">
설정
</string>
<string name="intro_delay">
나중에 하기
</string>
</resources>
□ 세로 모드 XML 파일
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="20dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/imageView"
android:src="@drawable/intro"
android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/mainTextView"
android:text="@string/intro_main"
android:textSize="20dp"
android:layout_centerHorizontal="true"
android:textStyle="bold"
android:gravity="center_horizontal"
android:layout_below="@id/imageView"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/detailTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_detail"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:layout_below="@id/mainTextView"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/delayTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_delay"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true"
android:layout_marginTop="20dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_button"
android:background="@drawable/round_button"
android:textColor="#FFFFFF"
android:layout_centerHorizontal="true"
android:layout_above="@id/delayTextView"
android:layout_marginBottom="20dp"/>
</RelativeLayout>
□ 가로 모드 XML 파일
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="20dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/mainTextView"
android:text="@string/intro_main"
android:textSize="20dp"
android:layout_centerHorizontal="true"
android:textStyle="bold"
android:gravity="center_horizontal"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/detailTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_detail"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:layout_below="@id/mainTextView"
android:layout_marginTop="20dp"/>
<TextView
android:id="@+id/delayTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_delay"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true"
android:layout_marginTop="20dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/intro_button"
android:background="@drawable/round_button"
android:textColor="#FFFFFF"
android:layout_centerHorizontal="true"
android:layout_above="@id/delayTextView"
android:layout_marginBottom="20dp"/>
</RelativeLayout>
실습을 따라 하다 보니 리소스를 사용해서 프로그램 만드는 것이 익숙해져 가는 것 같다.
12일 차 공부 끝!
'KOTLIN' 카테고리의 다른 글
[Kotlin] 공부 14일차 (2022-02-01) (0) | 2022.02.02 |
---|---|
[Kotlin] 공부 13일차 (2022-01-28) (0) | 2022.01.29 |
[Kotlin] 공부 11일차 (2022-01-25) (0) | 2022.01.25 |
[Kotlin] 공부 10일차 (2022-01-24) (0) | 2022.01.24 |
[Kotlin] 공부 9일차 (2022-01-23) (0) | 2022.01.24 |