一、顶部导航栏(TabLayout+viewpager)
简介 使用google原生推荐的TabLayout+viewpager,超级好用,而且性能上已经是优化到最好了,超级推荐大家这样用,代码的每个细节的作用和功能我都已经标明,下面来看看效果图:
文章图片
文章图片
代码
【kotlin|kotlin顶部导航栏(TabLayout+viewpager)、底部导航栏(谷歌官方)】MainActivity
class MainActivity : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)val sectionsPagerAdapter = SectionsPagerAdapter(this, supportFragmentManager)
val viewPager: ViewPager = findViewById(R.id.view_pager)
viewPager.adapter = sectionsPagerAdapter
val tabs: TabLayout = findViewById(R.id.tabs)
tabs.setupWithViewPager(viewPager)}
}
SectionsPagerAdapter
class SectionsPagerAdapter(private val context: Context, fm: FragmentManager)
: FragmentPagerAdapter(fm) {
//顶部tablayout的字符
private val TAB_TITLES = arrayOf(
R.string.tab_text_1,
R.string.tab_text_2,
R.string.tab_text_3,
R.string.tab_text_4)override fun getItem(position: Int): Fragment {
// 顶部有多少个tab,就会运行多少次(初次会加载第一第二,第三第四要点第三个tab才会运行)
/*******新建Fragment******/
Log.d("WY+","运行第几次:"+(position+1))
when (position) {
0 -> {
return PlaceholderFragment.newInstance(position + 1)
}
1 -> {
return PlaceholderFragment.newInstance(position + 1)
}
2 -> {
return ThreeFragment.newInstance(0)
}
3 -> {
return FourFragment.newInstance(0)
}
}
return PlaceholderFragment.newInstance(position + 1)}override fun getPageTitle(position: Int): CharSequence? {
return context.resources.getString(TAB_TITLES[position])
}override fun getCount(): Int {
// 顶部显示多少个页,不要超过TAB_TITLES的总数.
return 4
}
}
PageViewModel
class PageViewModel : ViewModel() {private val _index = MutableLiveData()val text: LiveData> = Transformations.map(_index) {"Hello world from section: $it"}fun setIndex(index: Int) {
_index.value = https://www.it610.com/article/index
}
}
ThreeFragment
class ThreeFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.fragment_three, container, false)return root
}companion object {
/**
* 单例,返回给定节编号的此片段的新实例。
*/
@JvmStatic
fun newInstance(sectionNumber: Int): ThreeFragment {
return ThreeFragment().apply {}
}
}
}
PlaceholderFragment
class PlaceholderFragment : Fragment() {private lateinit var pageViewModel: PageViewModeloverride fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)//实例一个PageViewModel,object.apply返回一个自身的对象(object),apply可以赋值一个类里面的属性和调用方法
pageViewModel = ViewModelProviders.of(this).get(PageViewModel::class.java).apply {
setIndex(arguments?.getInt(ARG_SECTION_NUMBER) ?: 1)
}}override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.fragment_main, container, false)
val textView: TextView = root.findViewById(R.id.section_label)pageViewModel.text.observe(viewLifecycleOwner, Observer> {
Log.d("WY+", "===>$it")
textView.text = it})
return root
}companion object {
private const val ARG_SECTION_NUMBER = "section_number"/**
* 返回给定节编号的此片段的新实例。
*/
@JvmStatic
fun newInstance(sectionNumber: Int): PlaceholderFragment {
return PlaceholderFragment().apply {
arguments = Bundle().apply {
putInt(ARG_SECTION_NUMBER, sectionNumber)
}
}
}
}
}
FourFragment
class FourFragment : Fragment() {override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.fragment_four, container, false)return root
}companion object {
/**
* 单例,返回给定节编号的此片段的新实例。
*/
@JvmStatic
fun newInstance(sectionNumber: Int): ThreeFragment {
return ThreeFragment().apply {}
}
}
}
activity_main.xml
fragment_main.xml
fragment_three.xml
fragment_four.xml
最后想要demo的朋友可到这里下载:https://download.csdn.net/download/wy313622821/12520093
注意:谷歌原生的代码布局是使用CoordinatorLayout,在配合底部导航栏使用时,切换其他的页面时会产生一个空白的区域,解决这个问题就是把CoordinatorLayout换成ConstraintLayout
二、底部导航栏(谷歌官方)
文章图片
试用BottomNavigationView时,如果底部的菜单项多于3个时,除第一个外都只显示图标,而不显示文字。
文章图片
解决办法:
bottomNavigationView.labelVisibilityMode = LabelVisibilityMode.LABEL_VISIBILITY_LABELED
需要代码的可以到这里下载:
添加链接描述
推荐阅读
- Android|android属性之noHistory
- android|Android历史版本
- android|android studio如何复制错误信息
- Android|TabLayout+ViewPager2的联合使用
- LeetCode|Java实现 LeetCode 704 二分查找(二分法)
- LeetCode|Java实现 LeetCode 378 有序矩阵中第K小的元素
- 面试|腾讯三面终拿Offer,关于redis,高并发,分布式,微服务一键领取
- Linux|再见 Xshell~ 这款开源的终端工具逼格更高
- 数据库|redis