[Android Studio] 웹개발과 앱개발의 비교

 

1. Activity

2. Fragment

3. RecyclerView

4. Adapter

5. ViewPager2

6. Intent

 

 

 

일단 안드로이드 개념과 각각의 역할, 언제 쓰는지 ? 등을 중점으로 정리해보려고 한다.

 

 

1. Activity

= 페이지

 

◎ 개념

: 사용자가 보는 하나의 전체 화면

: 안드로이드 앱의 기본 단위

 

◎ 역할

: 화면 표시

: 생명주기 관리 (onCreate, onStart 등)

: 다른 화면으로 이동

 

◎ 언제 쓰는지 ?

: 로그인 화면

: 메인 화면

 

◎ 웹으로 치면 비슷한 기능 ?

: 하나의 HTML 페이지 (/login, /main)

 

 

 

2. Fragment

= 페이지 안의 조각

 

◎ 개념

: Activity 안에 들어가는 화면 조각

: 혼자서는 실행 불가

 

◎ 역할

: 화면을 나눠서 관리

: 재사용 가능

: ViewPager, 탭 화면에서 핵심

 

◎ 언제 쓰는지 ?

: 탭 화면

: 화면 일부만 교체할 때

: 태블릿, 모바일 공용 UI

 

◎ 웹으로 치면 비슷한 기능 ?

: Vue 컴포넌트

 

 

** 레이아웃 XML 을 직접 소유하며 생명주기를 가짐.

버튼 클릭 처리를 하거나 

RecyclerView를 포함할 수 있고

ViewPager2 의 한 페이지가 될 수도 있다.

 

= 보여지는 대상

 

☞  'RecyclerView를 포함할 수 있다'의 의미

내부에 다른 view들으르 마음대로 넣을 수 있다.

<!-- fragment.xml -->
<LinearLayout>
    <TextView />
    <RecyclerView />
</LinearLayout>

 

 

☞ 'ViewPager2의 한 페이지가 될 수도 있다'의 의미

ViewPager2는 페이지를 직접 그리지 않고 Adapter에게 페이지를 만들어달라고 요청한다.

이때, 페이지가 Fragment

 

 

3. RecyclerView

= 리스트 렌더링 엔진

 

◎ 개념

: 스크롤되는 목록을 보여주는 뷰

: 화면에 보이는 것만 그려서 성능 최적화

 

◎ 역할

: 목록 표시

: 재사용

 

◎ 언제 쓰는지 ?

: 게시글 목록

: 상품 리스트

 

◎ 웹으로 치면 비슷한 기능 ?

: <ul>

 

 

**

리사이클러뷰는 혼자서 아무것도 못 그린다.

몇 개 그릴지, 뭘 그릴지 Adapter가 알려준다.

 

 

 

 

4. Adapter

= 데이터 ↔ 화면 연결자

 

◎ 개념

: 데이터를 View로 바꿔주는 중간자

 

◎ 역할

: 데이터를 어떻게 보여줄지 정의

: RecyclerView, ViewPager 필수

 

◎ 언제 쓰는지 ?

: 리스트

: 페이지 전환

 

◎ 웹으로 치면 비슷한 기능 ?

: <v-for>

 

 

 

**

화면이 아니다. 레이아웃 XML 을 소유하지 않고 생명주기가 없다.

데이터를 받아서 View로 만들어 줄 뿐이다.

데이터 개수를 알려주거나 바인딩을 하거나.

 

= 보여주기 위한 수단

 

 

 

** 어댑터 사용할 때

ViewHolder

: 리스트아이템을 들고 있는 보관함 객체.

: 리사이클러뷰 아이템 한 개의 View묶음. v-for로 만들어진 한 줄

 

예전에는 리스트를 스크롤 할 때마다 findViewById() 를 계속 호출하고 View 를 계속 새로 생성해서 느렸는데

이제 ViewHolder로

아이템 View를 한 번 찾고 계속 재사용해서 빠르게 쓸 수 있다.

 

// 뷰홀더는 아이템 레이아웃을 하나 들고 있음
class MyViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
    val title: TextView = itemView.findViewById(R.id.title)
}

// 어댑터에서 뷰홀더 생성
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
    val view = LayoutInflater.from(parent.context)
        .inflate(R.layout.item_row, parent, false)
    return MyViewHolder(view)
}

// 어댑터에서 데이터 연결
override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
    holder.title.text = data[position]
}

 

 

 

웹의 items[index]  = 앱의 data[position]

 

 

 

 

 

5. ViewPager2

= 스와이프 페이지 전환

 

◎ 개념

: 좌우 스와이프로 화면 넘기기

: 내부적으로 RecyclerView 기반

 

◎ 역할

: 페이지 전환

: Fragment 묶음 관리

 

◎ 언제 쓰는지 ?

: 탭 화면

: 온보딩 화면

: 좌우 넘김 UI

 

◎ 웹으로 치면 비슷한 기능 ?

: 슬라이더

 

 

 

 

 

6. Intent

= 페이지 이동 명령

 

◎ 개념

: Activity를 실행시키는 메시지

 

◎ 역할

: 화면 이동

: 데이터 전달

 

◎ 언제 쓰는지 ?

: 로그인 → 메인

: 목록 → 상세

 

◎ 웹으로 치면 비슷한 기능 ?

: 라우터, location.href

 

 

 

---

 

 

 

 

 

 

✔ Activity는 페이지
✔ Fragment는 컴포넌트
✔ RecyclerView는 리스트
✔ Adapter는 데이터 연결. 
✔ ViewPager2는 페이지 슬라이더
✔ Intent는 페이지 이동

 

 

 

---

 

<ul>
  <li v-for="item in items">
    {{ item.name }}
  </li>
</ul>

 

<ul>	RecyclerView
v-for	Adapter
<li>	ViewHolder
items	데이터 리스트