在项目中很多时候需要用到底部导航栏(顶部导航栏)来切换页面,其中的具体实现步骤如下。
1.创建MainActivity
class MainActivity : BaseActivity() {
private val helper = OrderMainHelper(this)
private val items by lazy {
helper.items
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
initToolbar(true)
// init bottom menu
//不展示动画效果
bnv_navigation.enableAnimation(false)
bnv_navigation.enableShiftingMode(false)
bnv_navigation.enableItemShiftingMode(false)
bnv_navigation.onNavigationItemSelectedListener = oNNavigationItemSelectedListener
// 主页
bnv_navigation.selectedItemId = bnv_navigation.menu.getItem(0).itemId
}
private val oNNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { item ->
return@OnNavigationItemSelectedListener navigateItem(item.itemId)
}
private fun navigateItem(@IdRes menuId: Int): Boolean {
val item = items.find { model ->
menuId == model.resId
}
if (item != null) {
navigateReplace(item.fragment, item.title)
return true
}
return false
}
override fun onSupportNavigateUp(): Boolean {
onBackPressed()
return true
}
}
2. 写OrderMainHelper,里面包含切换的三个Fragment
class OrderMainHelper (val activity: Activity){
val items by lazy {
listOf(
OrderMainItemModel(R.id.mine_orders_my_all, AllPaidFragment(), activity.getString(R.string.mine_goods_my_all)),
OrderMainItemModel(R.id.mine_goods_my_no_paid, NoPaidFragment(), activity.getString(R.string.mine_goods_my_no_paid)),
OrderMainItemModel(R.id.mine_goods_my_paid, PaidFragment(), activity.getString(R.string.mine_goods_my_paid))
)
}
}
3.写OrderMainItemModel
data class OrderMainItemModel (@IdRes val resId: Int,
val fragment: Fragment,
val title: String): Serializable
4.写menu文件,里面包含底部导航栏的三个按钮信息
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/mine_orders_my_all"
android:checked="true"
android:icon="@mipmap/ic_news_gray"
android:title="@string/mine_goods_my_all" />
<item
android:id="@+id/mine_goods_my_no_paid"
android:icon="@mipmap/ic_more_gray"
android:title="@string/mine_goods_my_no_paid" />
<item
android:id="@+id/mine_goods_my_paid"
android:icon="@mipmap/ic_discovery_gray"
android:title="@string/mine_goods_my_paid" />
</menu>
4.写MainActivity的布局
<?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"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="@+id/abl_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="@layout/toolbar_main" />
</android.support.design.widget.AppBarLayout>
<android.support.constraint.ConstraintLayout
android:id="@+id/container_mine"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.ittianyu.bottomnavigationviewex.BottomNavigationViewEx
android:id="@+id/bnv_navigation_mine_orders"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
app:itemIconTint="@drawable/bottom_navigation_selector"
app:itemTextColor="@drawable/bottom_navigation_selector"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="@menu/main_orders"
/>
<FrameLayout
android:id="@+id/fl_fragment_container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/bnv_navigation_mine_orders"
app:layout_constraintBottom_toBottomOf="parent"
/>
</android.support.constraint.ConstraintLayout>
</LinearLayout>
特别注意,FragLayout的名字fl_fragment_container不能改动,否则就会无法成功显示。很惭愧,我目前没有找出问题在哪里,我认为这个名字是应该能修改的,希望哪位大神知道问题在哪里,能够指导一下,谢谢。
5. 下一步就是写需要的Fragment
class AllPaidFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View?{
return inflater.inflate(R.layout.fragment_all_orders, container, false)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
}
}
6.设置Fragment的切换
fun navigateReplace(dst: Fragment, title: CharSequence? = null, isAddStack: Boolean = false) { if (!TextUtils.isEmpty(title)) { setTitle(title) } FragmentUtils.replace(supportFragmentManager, dst, R.id.fl_fragment_container, isAddStack) } open fun onNextAction(fragmentId: FragmentID, extra: String?) {}
到这里,我们就完成来Fragment+BottomNavigationViewEx底部导航栏切换页面的实现。