11. [제트팩 라이브러리]

728x90

[11. 제트팩 라이브러리]

[11-1. 제트팩과 androidx 소개]

-제트팩 라이브러리 : 구글에서 제공. 안드로이드 앱 개발에 필요한 다양한 라이브러리 모음

[플랫폼 API] : 기본 재료

-플랫폼 API는 ART(Android Runtime)에서 제공하는 안드로이드 앱 핵심 라이브러리

-안드로이드 앱은 런타임 때 ART에 의해 실행되므로 ART에서 제공하는 플랫폼 API 이용 개발 -> [호환성 문제 발생 우려]

-앱 개발 시 더 다양한 기능/화면 제공을 위해 ‘제트팩’ 활용

[제트팩]

-제트팩 : 구글에서 앱 개발용으로 제공하는 추가 라이브러리 모음

: androidx 로 시작하는 패키지명 사용

-여러 버전에 일관되게 작동 코드 작성 돕는 라이브러리

-ex. 뷰모델/라이브 데이터/룸/페이징 등의 라이브러리 제공

<제트팩 사용 목적>

앱 개발 권장 아키텍처 재공

API 호환성 문제 해결

플랫폼 API 제공하지 않는 다양한 기능 추가 제공

[androidx 라이브러리]

-anroidx 패키지명.라이브러리 : 다양한 라이브러리 존재

-우선 <화면 구성 관련 라이브러리> 먼저 소개

androidx.appcompat	앱 API 레벨 호환성 해결
androidx.recyclerview	목록 화면 구성
androidx.viewpage2	스와이프로 넘기는 화면 구성
androidx.fragment	동작 뷰 제공
androidx.drawerlayout	서랍처럼 열리는 화면 구성

[11-2. appcompat 라이브러리 – API 호환성 해결]

[appcompat 라이브러리] : 액티비티 만듬

-appcompat 라이브러리 : ‘액티비티’ 만들고, API 레벨 호환성 문제 해결해줌

-이 라이브러리 이용해서 액티비티 만들 때, AppCompatActivity 클래스 상속받아 사용

[액티비티 화면 구성요소 : 액션바/툴바 비교]

[액션바]

-액션바 : 화면 위쪽 타이틀 문자열 출력 영역

<액션바 색상 설정>

-themes.xml 파일 속 테마 스타일에서 설정 가능

colorPrimary /colorSecondary	액션바/버튼/활성화 표현 색상
colorOnPrimary / colorOnSecondary	내용물 전경색
colorPrimaryVariant / colorSecondaryVariant	그림자 색상

<액션바 숨기기 설정>

-액티비티는 기본적으로 액션바 포함

-때때로, 액션바 대신 툴바 사용 원하면 ‘액션바’ 숨겨야 함

-테마파일에서 숨기기 설정 O

(1) Theme.MaterialComponents.DayNight.NoActionBar 상속받으면 액션바 숨겨짐
(2) 테마의 <item> 속성으로 설정 가능
<item name =“windowActionBar”>false</item>

<UP 업 버튼 설정>

-업버튼 :이전 화면 되돌아가는 (<-화살표) 버튼

① 매니페스트 파일에서 설정하는 방법
② 액티비티 코드로 직접 설정하는 방법

[① 매니페스트 파일에서 설정하는 방법]

-매니페스트 파일의 <activity> 태그에 parentActivityName 속성 등록하면 업 버튼 생성됨

-만약, 업 버튼 클릭 시, 특별 로직 추가 수행하려면

onSupportNavigateUp() 함수 재정의하여 사용하면 됨 (업 버튼 클릭 시 자동 호출됨)

//매니페스트 파일에 업 버튼 설정
<activity 
     android:name = “.TwoActivity"
     anroid:parentActivityName = “.MainActivity”></activity>

[② 액티비티 코드로 직접 설정하는 방법]

- supportActionBar?.setDisplayHomeAsUpEnabled(true)로 앱 버튼 생성

- 사용자가 앱 버튼 클릭 시 수행할 로직 : onSupportNavigaeUp() 안에 작성

class TwoActivity : AppCompatActivity() {
   override fun onCreate(saverdInstanceState: Bundle?) {
          ...
          supportActionBar?.setDisplayHomeAsUpEnabled(true) 
                                      //업버튼 나오도록 설정  
   }

   override fun onSupportNavigateUp(): Boolean {  //업 버튼 클릭 시 자동 호출 함수 
          Log.d(“kkang”, “onSupportNavigateUp”)
          onBackPressed()
          return super.onSupportNavigateUp()
   }
}

▶[메뉴 구성]

-액티비티에 메뉴 추가하면 액션바 오른쪽에 오버플로 버튼 나타남

-오버플로 버튼 클릭 시 -> 메뉴 확장된 ‘오버플로 메뉴’ 나타남

<액티비티에 메뉴 추가>

onCreateOptionsMenu() 함수	-호출시점 : 액티비티 실행 초기 한 번만 호출 -정적인 메뉴 구성 (多사용)
onPrepareOptionsMenu() 함수	-호출시점 : 오버플로 메뉴 나타날 때마다 반복 호출 -동적인 메뉴 구성

① <Menu 객체에 MenuItem 객체 추가> : add() 함수 이용

<메뉴 선택 시 이벤트 처리> : onOptionsItemSelected() 함수 이용

-menuItem의 itemId 속성값으로 객체 식별값 얻어 when()문으로 각각의 이벤트 처리함

② <리소스로 메뉴 구현> : <item> 태그로 MenuItem 추가

-액티비티 메뉴는 대부분 정적 제공되므로 리소스 XML파일로 구성 多

-이 XML파일을 코드에 적용하려면 menuInflater.inflate()에 xml파일 명시

<showAsAction 속성 이용 > : 아래 속성값으로 지정하여 설정 가능

never (기본)	항상 오버플로 메뉴로 출력
ifRoom	액션바 공간 O -> 액션 아이템으로 출력 액션바 공간 X -> 오버플로 메뉴로 출력
always	항상 액션 아이템으로 출력

▶[액션 뷰 이용] : 액션바에서 검색 기능 제공(서치뷰)

-액션뷰 : 액션바에서 특별한 기능 제공 ex. SerchView

-액션뷰를 메뉴에 적용 시 actionViewClass 속성 이용

-이용할 액션뷰 클래스를 actionVIewClass 속성에 등록하면 액션바에 검색 뷰 생김

-코드에서 검색 기능 구현하려면 SerachView 객체 얻어야 함

[툴바]

-툴바: 사용목적은 액션바와 같음

-액션바 : 액티비티에 자동 포함되는 구성요소
-툴바 : 개발자가 직접 제어하는 ‘뷰’ 속성

- androidx.appcompat.widget.Toolbar 클래스 이용함

-툴바 사용하려면 액티비티 테마 설정에서 ‘액션바’ 화면에 숨기고 -> 레이아웃 XML파일에 툴바 등록함

-액션바 내용이 툴바에 적용되도록 지정 : setSupportActionBar(binding.toolbar)

[호환성 고려한 기본 뷰 클래스]

-appcompat 라이브러리는 호환성 고려한 기본 뷰 클래스를 제공

-플랫폼 API 제공 기본 뷰는 appcompat 라이브러리에서도 제공함

-기본 뷰 상속받아서 제공하며 사용목적/기능 대부분 같다.

-호환성 해결을 위해 일부러 같은 기능을 다시 제공

[11-3. 프래그먼트 – 액티비티처럼 동작하는 뷰]

[프로그먼트 소개]

-프래그먼트 :액티비티 화면을 구성하는 뷰의 한 종류

-액티비티처럼 동작하는 ‘컨테이너’ 역할

-여러 화면 제공하고 싶을 때, 이를 모두 하나의 클래스에 구현하기는 부담스러움

-따라서, 화면 각각을 ‘플래그먼트’ 단위로 만들고 이를 조합해서 하나의 액티비티 화면 구성

ex.) 네이버 뉴스탭 누르면 -> 뉴스 화면 나오고
네이버 연예기사 탭 누르면 -> 연예기사 화면 나오는 것

[프래그먼트 구현]

androidx.fragment 라이브러리에서 제공

프래그먼트도 ‘뷰’이지만 그 자체로는 아무것도 출력 X

(1) 프레그먼트 화면 구성 레이아웃 XML 파일 작성
(2) Fragment 상속받은 클래스 작성
(3) 클래스 안에 자동 호출되는 onCreateView() 함수 작성

[프래그먼트 출력 방식]

① 액티비티 레이아웃 XML 파일에 등록하여 프래그먼트 출력

-<fragment> 태그의 name 속성에 출력할 프래그먼트 클래스 지정

② 액티비티 코드에서 직접 프래그먼트 출력

액티비티 레이아웃 XML파이레 프래그먼트 출력시킬 레이아웃 뷰 준비

<코드에서 프래그먼트 동적 제어> : FragmentTransaction 클래스 함수 이용

add( )	새로운 프래그먼트를 화면에 동적 추가
replace( )	추가된 프래그먼트 대체
remove( )	추가된 프래그먼트 제거
commit( )	화면에 적용

[프래그먼트 생명주기]

-액티비티와 생명주기 같다

-[5단계] : 초기화/생성/시작/재개/소멸

[11-4. 리사이클러 뷰 – 목록 화면 구성]

[리사이클러 뷰 사용법]

-리사이클러 뷰 : 여러 항목 나열 목록 화면

-RecyclerView 클래스 사용 -> 목록 화면

<내부 구성요소>

ViewHolder(필수)	항목 뷰 객체 가짐
Adapter(필수)	항목을 구성
LayoutManager(필수)	항목 배치
ItemDecoration (선택)	항목 꾸미기

[리사이클러 뷰 사용]

① 리사이클러 뷰 사용 위해 gradle 파일 dependencies 항목에 의존 추가

implementation ‘androidx.recyclerview:recyclerciew:1.2.1’

② 리사이클러 뷰를 레이아웃 XML 파일에 등록

③ 항목 레이아웃 XML파일도 필요

<‘목록 화면’ 전체 구성 순서>

-> 뷰 홀더 (각 항목 뷰 객체 가짐) 준비
-> 어댑터는 뷰 홀더의 각 항목 뷰 객체에 적절 데이터 대입하여 항목 완성
-> 레이아웃 매니저는 어댑터가 만든 항목의 배치 결정
-> 리사이클러 뷰에 최종 출력

▷[뷰 홀더 준비]

-RecycleView.ViewHolder 상속받아 작성

-각 항목 뷰 객체를 가지는 뷰 홀더 생성

-‘뷰 바인딩 기법’ 이용 : 홀더는 항목 레이아웃 파일에 해당하는 바인딩 객체만 가지고 있으면 바인딩 객체에 항목 뷰가 자동 선언되어 사용 가능함

▷[어댑터 준비]

-어댑터 : 뷰 홀더 내부 각각의 항목 뷰에 데이터를 출력해서 각 항목 만들어 주는 역할

-RecyclerView.Adapter 상속받아 생성. 액티비티 항목 구성용 데이터를 매개변수로 받음

<어댑터에서 재정의 해야하는 함수>

getItemCount()	항목 개수 판단 위해 (자동 호출)
onCreateViewHolder()	뷰 홀더 준비 위해 (자동 호출)
onBindViewHolder()	뷰 홀더의 항목 뷰에 데이터 출력 위해 (자동 호출)

▷[리사이클러 뷰 출력]

-리사이클러 뷰에 ‘어댑터’와 ‘레이아웃 매니저’를 등록하여 화면에 출력

<리사이클러 뷰에 항목 동적 추가/제거>

-항목이 이미 출력된 이후, 동적으로 추가/제거해야 할 때.

-기존 데이터에 데이터 추가/제거 후 -> 어댑터의 notifyDataSetChanged() 함수 호출

[레이아웃 매니저]

-레이아웃 매니저 : 어댑터로 만든 항목을 리사이클러 뷰에 배치

RecyclerView.LayoutManager 상속받은 클래스

LinearLayoutManager	항목 가로/세로 배치
GridLayoutManager	항목 그리드로 배치
StaggeredGridLayoutManager	항목 지그재그 배치

[아이템 데코레이션] : 선택사항

-리사이클러 뷰 꾸밀 때 사용.

-대부분 ItemDecoration 상속받은 클래스 만들어서 ‘다양한 꾸미기 작업’ 수행

<아이템 데코레이션 꾸미기 작업 제공 함수 3가지>

onDraw()	-항목 배치 전 호출. -이 함수가 그린 그림 위해 항목 나타남
onDrawOver()	-항목 배치 후 호출 -항목 위에 이 함수 그림 출력
getItemOffsets()	-개별 항목 꾸밀 때 호출 -항목 네 방향 여백 설정/ 바탕색 설정

▷[이 아이템 데커레이션 객체 -> 리사이클러 뷰에 적용] : addItemDecoration() 함수 이용

[11-5. 뷰 페이저2 – 스와이프로 넘기는 화면 구성]

[뷰 페이저] : ViewPager

-사용자가 스와이프(손가락으로 화면 미는) 이벤트로 화면 전환 시 사용

-기본 플랫폼 API에서 제공 X

-androidx 라이브러리 이용해야만 함

-단, 2019년 viewpager2 제공 시작 -> 뷰 페이저2 기능 더 多 -> 뷰 페이저2로 실습

<‘뷰 페이저 2’ 의 사용>

(1) gradle 파일에 dependencies 항목 선언 추가
implementation ‘androidx.viewpager2:viewpager2:1.0.0’

(2) 레이아웃 XML 파일에 뷰 페이저2 추가

-‘뷰 페이저2’는 화면을 ‘항목’으로 봄 -> [어댑터 사용 필수]

<뷰 페이저 2 사용 가능 어댑터 2가지>
➀ 리사이클러 뷰 어댑터 이용
➁ 프래그먼트 어댑터 이용

* 中. 프래그먼트 어댑터 이용 : 프래그먼트가 하나의 ‘컨테이너’ 역할을 하는데, 각 항목(화면) 복잡하게 구성되어 있으니 각 항목의 내용을 ‘프래그먼트’로 작성하고 FragmentStateAdapter로 뷰 페이저 2 구현함

[11-6. 드로어 레이아웃 – 옆에서 열리는 화면 구성]

[드로어 레이아웃] : DrawerLayout

-액티비티 화면에 보이지 않던 (숨겨진) 내용이 왼/오른쪽에서 손가락의 움직임에 따라 밀려나오는 기능

-마치 서랍처럼 열리는 메뉴 구성 시 사용

<드로어 레이아웃 사용 선언> : gradle파일의 dependencies 항목에 선언

implementation ‘android.drawerlayou:drawerlayout:1.1.1’

<액티비티에 드로어 레이아웃 적용>

-액티비티 레이아웃 XML 파일의 루트 태그를 DrawerLayout으로 선언함

-> 기본 화면 위를 덮듯이 ‘드로어 레이아웃’이 나오는 구조이므로 전체를 감싸야 함

-드로어 레이아웃 하위에는 ‘뷰 2개 선언 필수’ : 종류는 상관없고 반드시 2개여야 함

<드로어 메뉴 토글 버튼> : ActionBarDrawerToggle 클래스에서 제공

-토글 버튼도 액션바 영역의 아이콘이므로 내부에서는 메뉴로 취급함

-따라서 메뉴 이벤트 처리하는 onOptionsItemSelected()에서 토글 버튼 이벤트 처리 필요

[11-7. 제트팩 이용 화면 구성] : 실습

[참고] : Do It 안드로이드 앱 프로그래밍 with 코틀린