상세 컨텐츠

본문 제목

[안드로이드 코틀린 ] RecyclerView Item Animation 서서히 나타나는 효과 주는 방법 part1

안드로이드

by aries574 2022. 8. 11. 16:48

본문


recyclerView에 애니메이션 기능을 적용해서 서서히 리스트가 보이는 방법을 알아보겠습니다.

이번 시간에는 리스트에 보여지는 아이템 관련 화면기능을 구현하겠습니다.


목차

1. 아이템 클래스 Item.kt
2. 아이템 화면 item_layout.xml
3. 아이템 어댑터 ItemAdapter.kt


1. 아이템 클래스 Item.kt

- 설명 -

리스트에 보여질 데이터 담는 그릇

data class Item(

    val title: String, //제목
    val description: String //설명
)

 


2. 아이템 화면 item_layout.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="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:backgroundTint="@android:color/holo_purple"
        app:cardCornerRadius="20dp"
        app:cardElevation="5dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/title_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="20dp"
                android:text="title"
                android:textColor="@android:color/white"
                android:textSize="15sp"
                android:textStyle="bold"/>

            <TextView
                android:id="@+id/desc_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="20dp"
                android:text="description"
                android:textColor="@android:color/white"
                android:textSize="15sp"
                android:textStyle="bold"/>
        </LinearLayout>
    </androidx.cardview.widget.CardView>
</RelativeLayout>

 


3. 아이템 어댑터 ItemAdapter.kt

- 설명 -

데이터아이템 화면을 연결해주는 클래스

class ItemAdapter(private val itemList: ArrayList<Item>): RecyclerView.Adapter<ItemAdapter.ItemHolder>() {


    class ItemHolder(itemView: View): RecyclerView.ViewHolder(itemView){

        //초기화
        val titleText: TextView = itemView.findViewById(R.id.title_text)
        val descText: TextView = itemView.findViewById(R.id.desc_text)
    }

    //화면 설정
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ItemHolder {

       val view = LayoutInflater.from(parent.context)
           .inflate(R.layout.item_layout, parent, false)

        return ItemHolder(view)
    }

    //데이터 설정
    override fun onBindViewHolder(holder: ItemHolder, position: Int) {

        val currentItem = itemList[position]

        //데이터 넣기
        holder.titleText.text = currentItem.title
        holder.descText.text = currentItem.description
    }

    //아이템 갯수 가져오기
    override fun getItemCount(): Int {
        return itemList.size
    }

    //아이템 추가하기
    fun addItem(item: Item){

        itemList.add(item)
    }
}

2022.08.06 - [안드로이드] - [안드로이드 코틀린] 간단한 할 일 목록(ToDo List) 쉽게 만드는 방법

 

[안드로이드 코틀린] 간단한 할 일 목록(ToDo List) 쉽게 만드는 방법

이번 시간에는 ListView를 이용해서 간단한 할 일(todo list) 목록 만드는 방법에 대하여 알아보겠습니다. 목차 1. 실행 화면 2. 아이템 화면 list_item.xml 3. 메인 화면 activity_main.xml 4. 메인 ..

aries574.tistory.com

2022.08.05 - [안드로이드] - [안드로이드 코틀린] 애니메이션으로 뷰(View) 표시 및 숨기기 - 회전 표시 쉽게 만드는 방법

 

[안드로이드 코틀린] 애니메이션으로 뷰(View) 표시 및 숨기기 - 회전 표시 쉽게 만드는 방법

이번 시간에는 애니메이션(Animation)을 이용해서 텍스트뷰가 퍼지듯이 나타났다가 퍼지듯이 사라지는 방법을 알아보겠습니다. 목차 1. 실행 화면 2. 메인 화면 activity_main.xml 3. 메인 코드 MainA

aries574.tistory.com

2022.08.03 - [안드로이드] - [안드로이드 코틀린] 애니메이션으로 뷰(View) 표시 및 숨기기 - 크로스페이드(CrossFade) 쉽게 만드는 방법

 

[안드로이드 코틀린] 애니메이션으로 뷰(View) 표시 및 숨기기 - 크로스페이드(CrossFade) 쉽게 만드

이번 시간에는 2개의 이미지를  애니메이션(Animation)을 이용해서 변경해주는 방법에 대하여 알아보겠습니다. 목차 1. 실행 화면 2. 메인 화면 activity_main.xml 3. 메인 코드 MainActivity.kt 1. ..

aries574.tistory.com

 

반응형

관련글 더보기

댓글 영역