[Android Material Design]组件18 - BottomAppBar

效果图

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

我是予人三，希望大家点赞支持我哦~ 有大家的鼓励我会分享更多内容