How to put the android BottomAppBar with rounded corners

问题

I am using the BottomAppBar from google like this:

 <com.google.android.material.bottomappbar.BottomAppBar
            android:id="@+id/vNavigationBar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

The custom bottom bar is flat and I need to add rounded corners on the Bottom bar(image example bellow)

What should I do to make this work this way?

回答1:

you can try add a shape drawable xml file and add the following code to it

<corners
    android:topLeftRadius="16dp"
    android:topRightRadius="16dp" />

And then set the BottomAppBar's background to the drawable

回答2:

according to this, you can create your customView class extended from BottomAppBar, and implement these code:

`@Override protected void onLayout(boolean changed, int left, int top, int 
 right, int bottom) {
 super.onLayout(changed, left, top, right, bottom);
 }
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    mNavigationBarWidth = getWidth();
    mNavigationBarHeight = getHeight();
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    mPath.reset();
    mPath = RoundedRect(0, 0, mNavigationBarWidth, mNavigationBarHeight, 50, 50, true);
    canvas.drawPath(mPath, mPaint);
}

remember just in every constructor of your custom class,do this:

mPath = new Path();
    mPaint = new Paint();
    mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
    mPaint.setColor(Color.WHITE);
    setBackgroundColor(Color.TRANSPARENT);

回答3:

You can use the MaterialShapeDrawable provided by the Material Components Library:

In your layout:

  <com.google.android.material.bottomappbar.BottomAppBar
      android:id="@+id/bottom_app_bar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:backgroundTint="@color/..."
      ../>

Then in the code define:

//Corner radius
float radius = getResources().getDimension(R.dimen.default_corner_radius);
BottomAppBar bottomAppBar = findViewById(R.id.bottom_app_bar);

ShapeAppearanceModel shapeAppearanceModel = new ShapeAppearanceModel()
    .toBuilder()
    .setTopRightCorner(CornerFamily.ROUNDED,radius)
    .setTopLeftCorner(CornerFamily.ROUNDED,radius)
    .build();

ViewCompat.setBackground(bottomAppBar,new MaterialShapeDrawable(shapeAppearanceModel));

It requires the version 1.1.0.

来源：https://stackoverflow.com/questions/54406436/how-to-put-the-android-bottomappbar-with-rounded-corners

标签

android

xml

android-layout

material-components-android

android-bottomappbar