[안드로이드] TabLayout + Fragment 사용하기

1. activity_main.xml에 TabLayout 추가

2. activity_main.xml 에 fragment 태그 추가하기

3. fragment.xml, Fragment.kt 만들기

4. MainActivity 탭 메소드, 프래그먼트 객체화해주기

 

 

1. activity_main.xml에 TabLayout 추가

 

2. activity_main.xml 에 fragment 태그 추가하기

<fragment> 태그안에 name을 꼭 지정해주어야한다.

 

3. fragment.xml, Fragment.kt 만들기

fragment_ranking.xml

탭을 두개 만들었으니 xml과 코틀린 파일도 각각 두개 만들어야한다.  위에는 랭킹 xml 아래는 즐겨찾기 코틀린 파일.

package com.example.rc_4.Fragment


data class ShoppingmallCard(val name: String, val contents:String, val img: Int)
class BookMarkFragment : Fragment() {

    private lateinit var binding : FragmentBookmarkBinding

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        binding = FragmentBookmarkBinding.inflate(inflater, container, false)

        return binding.root


    }

}

--> FragmentBookMark.kt

 

바인딩까지 완료해준다.

 

4. MainActivity 탭 메소드, 프래그먼트 객체화해주기

MainActivity.kt

프래그먼트를 객체화 해준다. 그리고 아래에 있는 supportFragmentManager를 통해서 어떤 프래그먼트를 제일 처음에 보여줄 것인지 결정!

나는 랭킹 프래그먼트를 처음 시작으로 정했다.

 

MainActivity.kt

 

그리고 탭을 누를때마다 프래그먼트가 전환(replaceView)이 되도록 메소드 구현해주었다.

0번 탭을 누르면 랭킹 프래그먼트로 전환, 1번 탭을 누르면 즐겨찾기 프래그먼트로 전환...

 

MainActivity.kt

 

프래그먼트가 전환이 되도록 하는 메소드는 요렇다. ll_fragment는 <fragment> 태그를 감싸고 있는 리니어 레이아웃이다. 

탭을 누를때마다 파라미터로 받은 프래그먼트로 리니어레이아웃을 바꿔준다. 

 

아래는 전체 MainActivity에 대한 코드

package com.example.rc_4

import android.app.Activity
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.fragment.app.Fragment
import com.example.rc_4.Fragment.BookMarkFragment
import com.example.rc_4.Fragment.RankingFragment
import com.example.rc_4.databinding.ActivityMainBinding
import com.example.rc_4.databinding.ActivityStoreBinding
import com.example.rc_4.databinding.ListviewBookMarkItemBinding
import com.google.android.material.tabs.TabLayout

class StoreActivity : AppCompatActivity() {

    private lateinit var tab_ranking:RankingFragment
    private lateinit var tab_bookMark:BookMarkFragment
    private lateinit var binding: ActivityStoreBinding
    private lateinit var tabLayout: TabLayout

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityStoreBinding.inflate(layoutInflater)
        val view = binding.root
        setContentView(view)

        // 프래그먼트 객체화
        tab_ranking = RankingFragment()
        tab_bookMark = BookMarkFragment()
        tabLayout = binding.tlStore

        supportFragmentManager.beginTransaction().add(R.id.ll_fragment,tab_ranking).commit()

        tabLayout.addOnTabSelectedListener(object :TabLayout.OnTabSelectedListener{
            override fun onTabSelected(tab: TabLayout.Tab?) {
                when (tab?.position){
                    0 -> {
                        replaceView(tab_ranking)
                    }
                    1 -> {
                        replaceView(tab_bookMark)
                    }
                }
            }

            override fun onTabUnselected(tab: TabLayout.Tab?) {
            }

            override fun onTabReselected(tab: TabLayout.Tab?) {
            }
        })
    }

    private  fun replaceView(tab:Fragment) {
        var selectedFragment : Fragment? = null
        selectedFragment = tab
        selectedFragment?.let{
            supportFragmentManager.beginTransaction()
                .replace(R.id.ll_fragment, it).commit()
        }
    }


}