【问题标题】:How to put the android BottomAppBar with rounded corners如何将带有圆角的android BottomAppBar
【发布时间】:2019-01-28 16:34:50
【问题描述】:

我正在使用来自谷歌的BottomAppBar,如下所示:

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

自定义底栏是平的,我需要在底栏上添加圆角(下图示例)

我应该怎么做才能以这种方式工作?

【问题讨论】:

标签: android xml android-layout material-components-android android-bottomappbar


【解决方案1】:

BottomAppBar 与 MaterialShapeDrawable 配合使用,您可以对其应用圆角(使用 RoundedCornerTreatment)。

在您的布局中:

  <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/..."
      ../>

然后在代码中定义:

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

MaterialShapeDrawable bottomBarBackground = (MaterialShapeDrawable) bottomAppBar.getBackground();
bottomBarBackground.setShapeAppearanceModel(
       bottomBarBackground.getShapeAppearanceModel()
                .toBuilder()
                .setTopRightCorner(CornerFamily.ROUNDED,radius)
                .setTopLeftCorner(CornerFamily.ROUNDED,radius)
                .build());

它也适用于fabCradle

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomAppBar"
    app:fabAlignmentMode="center"
    app:fabCradleVerticalOffset="8dp"
    app:fabCradleMargin="8dp"
    .../>

需要1.1.0版本。

【讨论】:

  • 不工作val shapeAppearanceModel = ShapeAppearanceModel() .toBuilder() .setTopRightCorner(CornerFamily.ROUNDED, 16f) .setTopLeftCorner(CornerFamily.ROUNDED, 16f) .build() ViewCompat.setBackground(bottom_appbar, MaterialShapeDrawable(shapeAppearanceModel))
  • @AkshayRaj。您的代码有效,刚刚尝试过。但是16f != 16dp.
  • @AkshayRaj。我已经更新了答案。 BottomAppBar 提供MaterialShapeDrawable。将圆角应用于更改 ShapeAppearanceModel 就足够了
  • 如果您的目标是Android L,这是正确答案
【解决方案2】:

你可以尝试添加一个shape drawable xml文件,并在其中添加以下代码

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

然后将BottomAppBar的背景设置为drawable

【讨论】:

    【解决方案3】:

    根据this,您可以创建从BottomAppBar扩展的customView类,并实现这些代码:

    `@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);
    }
    

    `

    记住在你的自定义类的每个构造函数中,这样做:

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2012-09-12
      • 2014-09-02
      • 2020-01-15
      • 1970-01-01
      • 2020-05-25
      • 2020-05-11
      • 1970-01-01
      相关资源
      最近更新 更多