效果图
BottomAppBar
底部栏是在屏幕底部展示出导航和关键动作按钮的一个控件,该组件最多可以放置4个菜单项,抽屉导航、悬浮按钮和另两个。示例图中抽屉导航右侧的画板图标不是按钮,而是抽屉导航的logo图标,可以自定义其他图标。
关键代码
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val fabAlignmentModeButton = findViewById<MaterialButton>(R.id.fabAlignmentModeButton)
val bottomAppBar = findViewById<BottomAppBar>(R.id.bottomAppBar)
fabAlignmentModeButton.setOnClickListener {
val alignmentMode = if (bottomAppBar.fabAlignmentMode == BottomAppBar.FAB_ALIGNMENT_MODE_CENTER)
BottomAppBar.FAB_ALIGNMENT_MODE_END else BottomAppBar.FAB_ALIGNMENT_MODE_CENTER
bottomAppBar.fabAlignmentMode = alignmentMode
}
bottomAppBar.replaceMenu(R.menu.menu_bottom_app_bar)
bottomAppBar.setOnMenuItemClickListener { item ->
when (item.itemId) {
R.id.item1 -> {
Toast.makeText(this, "Clicked menu item 1", Toast.LENGTH_SHORT).show()
true
}
R.id.item2 -> {
Toast.makeText(this, "Clicked menu item 2", Toast.LENGTH_SHORT).show()
true
}
else -> false
}
}
bottomAppBar.setNavigationOnClickListener {
Toast.makeText(this, "Clicked navigation item", Toast.LENGTH_SHORT).show()
}
}
}
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:paddingTop="16dp"
android:paddingBottom="100dp"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:clipToPadding="false">
<com.google.android.material.button.MaterialButton
android:id="@+id/fabAlignmentModeButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="false"
android:text="Toggle FAB alignment mode" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
<com.google.android.material.bottomappbar.BottomAppBar
android:id="@+id/bottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:navigationIcon="@drawable/ic_baseline_menu_24"
app:logo="@drawable/ic_baseline_color_lens_24"
app:navigationContentDescription="Navigation icon"
app:hideOnScroll="true" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_anchor="@id/bottomAppBar"
app:srcCompat="@drawable/ic_baseline_add_24"
android:contentDescription="fab" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
源码地址
https://github.com/yurensan/MaterialDesignDemo
我是予人三,希望大家点赞支持我哦~ 有大家的鼓励我会分享更多内容