ViewPager를 만들어보자!

16087 단어 androidkotlinSOPTSOPT

용어 설명

참고 자료

  • FragmentManager : Activity에서 Fragment를 관리하기 위해 필요한 것.

  • Fragment Transaction : 액티비티에서 프래그먼트 추가, 변경, 삭제 작업을 수행한다.

ViewPager 만들기

1. ViewPager에 들어갈 Fragment를 만들어준다.

  • 세 개정도 XML파일을 만들어주고 원하는대로 커스터마이징한다.

  • 그리고 각 Fragment의 .kt파일을 만들어서 onCreateView()를 override해준다.

<fragment_first.xml>

<androidx.constraintlayout.widget.ConstraintLayout 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:id="@+id/frameLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFDDAA"
    tools:context=".FirstFragment">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Fragment1"
        android:textSize="26sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

<FirstFragment.kt>

class FirstFragment : Fragment() {
	//onCreateView() : Fragment의 화면을 그릴 때 호출된다.
    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment

        val view = inflater.inflate(R.layout.fragment_first, container, false)
        return view
    }
}
  • 위와 같은 .kt 파일과 .xml 파일을 총 세 개 만들어준다.

2. ViewPager가 들어갈 곳의 xml에 ViewPager 추가한다.

  • 여기서는 ViewPager2가 아닌 ViewPager를 사용하였다.
<activity_main.xml>

<androidx.constraintlayout.widget.ConstraintLayout
    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">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/sample_viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

3. ViewPagerAdapter 만들기

  • ViewPager의 adapter는 FragmentManager를 필요로 한다!

  • FragmentStatePagerAdapter() : 현재 보이는 화면 양 옆 프래그먼트를 제외한 나머지를 완전히 파괴하여 메모리 누수 관리에 효과적이다.

  • FragmentPagerAdapter() : FragmentStatePagerAdapter() 대신 상속 받을 수 있으며, 프래그먼트의 인스턴스를 완전히 파괴하지 않아서 프래그먼트 개수가 고정적일 때 효과적이다.

  • var fragments = listOf<Fragment>() : Fragment를 담은 List를 만들어준다.

<ViewPagerAdapter.kt>

class ViewPagerAdapter(fm : FragmentManager)
    : FragmentStatePagerAdapter(fm, BEHAVIOR_RESUME_ONLY_CURRENT_FRAGMENT) //main에서 supportFragmentManager로 인자 넘겨줌
{
    var fragments = listOf<Fragment>()

    override fun getCount(): Int = 3//fragments.size

    override fun getItem(position: Int): Fragment = when(position) {
        0 -> FirstFragment()
        1 -> SecondFragment()
        2 -> ThirdFragment()

        else -> throw IllegalStateException("Unexpected position $position")
    }
}
  • ViewPagerAdapter는 getItem(), getCount() 메소드를 반드시 override 해줘야 한다.
    • getItem() : list에 있는 프래그먼트의 인스턴스를 새 페이지로 제공한다.

    • getCount() : Adapter에서 만들 페이지 수를 반환한다.

4. ViewPager가 보여질 Activity의 .kt 파일을 코딩한다.

  • private lateinit ~~ : Adapter를 선언해준다.
  • viewPagerAdapter = ViewPagerAdapter(supportFragmentManager) : FragmentManager 불러온다.
  • sample_viewpager.adapter = viewPagerAdapter : activity_main.xml에서 만든 ViewPager에 선언한 Adapter를 넣어준다.
  <MainActivity.kt>

  class MainActivity : AppCompatActivity() {
    private lateinit var viewPagerAdapter : ViewPagerAdapter

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

        viewPagerAdapter = ViewPagerAdapter(supportFragmentManager)
        viewPagerAdapter.fragments = listOf(

            FirstFragment(),
            SecondFragment(),
            ThirdFragment()
        )
        sample_viewpager.adapter = viewPagerAdapter
    }
}

끝!



  • BottomNavigationView가 궁금하다면?

  • TabLayout이 궁금하다면?

좋은 웹페이지 즐겨찾기