1、实现效果，可点击或者滑动切换fragment

点击                                                                                         滑动

                   

 

 实现方法：

1、创建三个fragment.kt

2、创建fragmentAdapter

class MyFragmentAdapter(fragmentManager: FragmentManager, private val fragmentList: List<Fragment>, private val titleList: List<String>, private val context: Context) : FragmentPagerAdapter(fragmentManager) {override fun getItem(position: Int): Fragment {return fragmentList[position]}override fun getCount(): Int {return titleList.size}//注意！！！这里就是我们自定义的布局tab_itemfun getCustomView(position: Int): View {val view = LayoutInflater.from(context).inflate(R.layout.tab_item, null)val iv = view.findViewById(R.id.tab_iv) as ImageViewval tv = view.findViewById(R.id.tab_tv) as TextViewwhen (position) {0 -> {//drawable代码在文章最后贴出iv.setImageDrawable(context.resources.getDrawable(R.drawable.home_icon_selector))tv.text = "首页"}1 -> {iv.setImageDrawable(context.resources.getDrawable(R.drawable.txl_icon_selector))tv.text = "通讯录"}2 -> {iv.setImageDrawable(context.resources.getDrawable(R.drawable.wd_icon_selector))tv.text = "我的"}}return view}
}

3、ViewPager加载fragment

 

private lateinit var fragment3:BlankFragment3
private lateinit var fragment2:BlankFragment2
private lateinit var fragment:BlankFragment

private fun getdata() {fragment  = BlankFragment()fragment2 = BlankFragment2()fragment3 = BlankFragment3()fragmentList!!.add(fragment)fragmentList!!.add(fragment2)fragmentList!!.add(fragment3)titleList!!.add("首页")titleList!!.add("通讯录")titleList!!.add("我的")activity_tablayout.setTabMode(TabLayout.MODE_FIXED)//不可以轮动activity_tablayout.addTab(activity_tablayout.newTab().setText(titleList!!.get(0)))activity_tablayout.addTab(activity_tablayout.newTab().setText(titleList!!.get(1)))activity_tablayout.addTab(activity_tablayout.newTab().setText(titleList!!.get(2)))activity_viewPager.adapter=MyFragmentAdapter(getSupportFragmentManager(), fragmentList!!, titleList!!,this)activity_tablayout.setupWithViewPager(activity_viewPager)for (i in 0..2) {val tab = activity_tablayout.getTabAt(i)//注意！！！这里就是添加我们自定义的布局tab!!.setCustomView(adapter!!.getCustomView(i))//这里是初始化时，默认item0被选中，setSelected（true）是为了给图片和文字设置选中效果，代码在文章最后贴出if (i == 0) {(tab!!.getCustomView()!!.findViewById(R.id.tab_iv) as ImageView).isSelected = true(tab!!.getCustomView()!!.findViewById(R.id.tab_tv) as TextView).isSelected = true}}}

demo云盘链接：https://pan.baidu.com/s/1HJKbRY0WBXGMfwmU-AP7HA

密码在线回复:QQ1085220040

kotlin工程demo链接：https://download.csdn.net/download/meixi_android/11212091