#01.1 전화번호부 만들기(RecyclerView로 개선) 2021-03-25

[실행 화면]

[build.gradle(:app)]

implementation "androidx.recyclerview:recyclerview:1.1.0"

 

[activity_main.xml]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#1E7AC3"
        android:orientation="vertical">

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

            <TextView
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="5"
                android:padding="15dp"
                android:text="Contacts"
                android:textColor="@color/white"
                android:textSize="20sp"/>

            <ImageButton
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:scaleType="fitCenter"
                android:src="@drawable/loupe"/>

            <ImageButton
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_weight="1"
                android:scaleType="fitCenter"
                android:src="@drawable/menu"/>
        </LinearLayout>

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

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:backgroundTint="#1E7AC3"
                android:textColor="@color/white"
                android:text="FAVORITES"
                android:padding="15dp"
                android:textSize="15sp"/>

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:backgroundTint="#1E7AC3"
                android:textColor="@color/white"
                android:text="ALL CONTACTS"
                android:padding="15dp"
                android:textSize="15sp"/>
        </LinearLayout>
    </LinearLayout>

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:text="ME"
            android:textColor="#5C5B5B"
            android:textSize="15sp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="Set up my profile"
            android:padding="10dp"
            android:textSize="15sp"/>
    </LinearLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/containerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>



</LinearLayout>

 

[activity_detail_phone_book.xml]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Detail_PhoneBook"
    android:id="@+id/detailPhoneBoook"
    android:orientation="vertical">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:background="#6A6868">

        <ImageButton
            android:id="@+id/back"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:src="@drawable/back"
            android:scaleType="fitXY"/>

        <ImageView
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:src="@drawable/user"
            android:layout_gravity="center"/>

        <TextView
            android:id="@+id/detailName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:textSize="30sp"
            android:layout_margin="20dp"
            android:textColor="@color/white"/>
    </FrameLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_margin="10dp">

        <ImageView
            android:layout_width="0dp"
            android:layout_height="20dp"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:src="@drawable/phone"/>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="60dp"
            android:layout_weight="5"
            android:paddingLeft="10dp"
            android:gravity="center|left"
            android:orientation="vertical">

            <TextView
                android:id="@+id/detailNumber"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="15dp"
                android:textColor="@color/black"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Mobile"
                android:textColor="#4E4E4E"
                android:textSize="13dp"/>
        </LinearLayout>

        <ImageView
            android:layout_width="0dp"
            android:layout_height="20dp"
            android:layout_weight="1"
            android:src="@drawable/comment"
            android:layout_gravity="center"/>

    </LinearLayout>
</LinearLayout>

 

[numberlist_view.xml]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/txHeadName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:textSize="15sp"/>

        <TextView
            android:id="@+id/txPhoneNumber"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="10dp"
            android:textSize="15sp" />
    </LinearLayout>
</LinearLayout>

 

[MainAcitivity.kt]

package com.hellow.phonebook

import android.app.Activity
import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.LinearLayout
import android.widget.TextView
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // 리사이클러뷰 인스턴스 생성
        val phoneBook_Recycler_View : RecyclerView = findViewById<RecyclerView>(R.id.containerView)

        // 어댑터 및 레이아웃 매니저설정
        with(phoneBook_Recycler_View) {
            this.adapter = PhoneBookRecyclerAdapter(
                    phoneBookList = createFakePhoneBook(50),
                    inflater = LayoutInflater.from(this@MainActivity),
                    activity = this@MainActivity)
            this.layoutManager = LinearLayoutManager(this@MainActivity)
        }
    }

    // 생성 할 Person의 갯수를 입력하면 해당 갯수만큼 Person 인스턴스를 List에 추가 전화번호부를 return
    fun createFakePhoneBook(fakeNumber: Int = 10, phoneBook: PhoneBook = PhoneBook()): PhoneBook {
        for (i in 0 until fakeNumber) {
            phoneBook.addPerson(
                    Person("${i}번째 사람", "010-1234-567,${i}")
            )
        }
        return phoneBook
    }

    fun createPhoneBookList(phoneBook: PhoneBook) {
        // 인플레이터와 아이템 뷰를 붙일 컨테이너 생성
        val inflaterLayout = LayoutInflater.from(this@MainActivity)
        val container = findViewById<LinearLayout>(R.id.containerView)

        // headName과 phoneNumber 변수 생성 및 데이터 저장
        for (i in 0 until phoneBook.personList.size) {
            val itemView = layoutInflater.inflate(R.layout.numberlist_view, null)
            val headName = itemView.findViewById<TextView>(R.id.txHeadName)
            val phoneNumber = itemView.findViewById<TextView>(R.id.txHeadName)

            headName.text = phoneBook.personList[i].name
            phoneNumber.text = phoneBook.personList[i].number

            // 생성한 itemView를 container에 addView
            container.addView(itemView)

            // 리스트 클릭 시 상세페이지 이동
            detailPageOpen(phoneBook.personList[i], itemView)

        }
    }

    // 상세 페이지 생성 및 리스트 클릭 시 액티비티 전환
    fun detailPageOpen(person: Person, view: View) {
        view.setOnClickListener {
            // 인텐트 생성 및 서브 액티비티 실행
            val intent = Intent(this@MainActivity, Detail_PhoneBook::class.java)
            intent.putExtra("Name", person.name)
            intent.putExtra("Number", person.number)

            startActivity(intent)
        }
    }
}

// RecyclerView Adapter
// 리사이클러뷰 어댑터 클래스
class PhoneBookRecyclerAdapter (
        val phoneBookList : PhoneBook,
        val inflater : LayoutInflater,
        val activity : Activity
) : RecyclerView.Adapter<PhoneBookRecyclerAdapter.ViewHolder>() {
    inner class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val personName : TextView?
        val personNumber: TextView?

        init {
            personName = itemView?.findViewById<TextView>(R.id.txHeadName)
            personNumber = itemView?.findViewById<TextView>(R.id.txPhoneNumber)

            itemView.setOnClickListener {

                // 인텐트 생성
                val intent = Intent(activity, Detail_PhoneBook::class.java)

                // 인텐트에 데이터 저장
                intent.putExtra("Name", phoneBookList.personList[adapterPosition].name)
                intent.putExtra("Number", phoneBookList.personList[adapterPosition].number)

                // 상세 페이지 액티비티 시작
                activity.startActivity(intent)
            }
        }
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = inflater.inflate(R.layout.numberlist_view, parent, false)
        return ViewHolder(view)
    }

    override fun getItemCount(): Int {
        return phoneBookList.personList.size
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.personName?.text = phoneBookList.personList[position].name
        holder.personNumber?.text = phoneBookList.personList[position].number
    }
}

// Person인스턴스 List를 가진 PhoneBook 클래스 선언
class PhoneBook() {
    val personList = ArrayList<Person>()
    fun addPerson(person: Person) {
        personList.add(person)
    }
}

// 이름과 전화번호를 가진 Person클래스 선언
class Person(val name: String, val number: String) {
}

 

[Detail_PhoneBook.kt]

package com.hellow.phonebook

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.ImageButton
import android.widget.TextView

class Detail_PhoneBook : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_detail__phone_book)

        getPersonInfo()

        // back클릭시 MainActivity로 이동
        val btnBack : ImageButton = findViewById<ImageButton>(R.id.back)
        btnBack.setOnClickListener{
            onBackPressed()
        }
    }

    fun getPersonInfo() {
        // TextView Name, Phone 변수
        val strName = findViewById<TextView>(R.id.detailName)
        val strPhone = findViewById<TextView>(R.id.detailNumber)

        // 인텐트로 받아온 이름, 전화번호 값을 name, phone에 저장
        strName.text = intent.getStringExtra("Name")
        strPhone.text = intent.getStringExtra("Number")
    }
}

 

이상 마치겠습니다. :)