Material Design Components之BottomAppBar的使用

一：导包

implementation 'com.google.android.material:material:1.0.0'

二：App主题

android:theme="@style/Theme.MaterialComponents.Light"

三：基本使用

代码

效果

Image.png

四：属性解释

style="@style/Widget.MaterialComponents.BottomAppBar.Colored"

跟随主题颜色的Style；

style="@style/Widget.MaterialComponents.BottomAppBar"

没有颜色的Style。

app:fabAlignmentMode="center"

FloatingActionButton位于中间

app:fabCradleMargin="6dp"

与FloatingActionButton的外边距

app:fabCradleRoundedCornerRadius="10dp"

BottomAppBar嵌入位置圆角半径

app:menu="@menu/menu"

给BottomAppBar添加一个Menu

app:backgroundTint="#FFFF00"

背景着色

app:fabCradleVerticalOffset="8dp"

缺口垂直方向的偏移量

五：三角形缺口

需求：实现下图效果

Demo_image.png

需要给BottomAppBar设置一个TriangleEdgeTreatment（默认情况下是BottomAppBarTopEdgeTreatment），写法如下：

BottomAppBar mBottomAppBar = findViewById(R.id.bottom_app_bar);
        float size = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, getResources().getDisplayMetrics());
        TriangleEdgeTreatment triangleEdgeTreatment = new TriangleEdgeTreatment(size, true);
        ShapePathModel shapePathModel = new ShapePathModel();
        shapePathModel.setTopEdge(triangleEdgeTreatment);
        MaterialShapeDrawable materialShapeDrawable = new MaterialShapeDrawable(shapePathModel);
        materialShapeDrawable.setTint(0XFFDDDDDD);
        mBottomAppBar.setBackground(materialShapeDrawable);

Image.png

六：结合RecyclerView实现滚动消失

只需要在BottomAppBar里面添加app:hideOnScroll="true"就可以了

scroll.gif