You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

自定义弧形BottomNavigationViewEx顶部阴影适配问题求助

适配弧形底部导航栏的自定义阴影方案

我之前也踩过这个坑——默认的elevation或者带阴影的Drawable只会基于View的矩形边界生成阴影,完全适配不了我们自定义的弧形路径。这里有两种靠谱的解决方法,你可以按需选择:

方法1:通过Paint阴影层直接绘制(快速实现)

这种方法最简单,直接给你自定义View里绘制弧形的Paint添加阴影属性即可:

修改你的CurvedBottomNavigationView代码:

在init()方法里补充阴影配置:

private void init() {
    mPath = new Path();
    mPaint = new Paint();
    mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
    mPaint.setColor(Color.WHITE);
    // 添加阴影配置:模糊半径、水平偏移、垂直偏移、阴影颜色
    mPaint.setShadowLayer(8f, 0f, -2f, Color.parseColor("#33000000"));
    // 硬件加速可能导致阴影不显示,开启软件图层兼容
    setLayerType(LAYER_TYPE_SOFTWARE, mPaint);
    setBackgroundColor(Color.TRANSPARENT);
}

参数说明:

  • 第一个值是阴影模糊半径,数值越大阴影越柔和
  • 水平偏移设0即可,垂直偏移设负数让阴影向上显示在导航栏顶部
  • 阴影颜色用半透明灰色,视觉上更自然

保持onDraw方法不变,绘制Path时就会自动带上适配弧形的阴影了。

方法2:自定义OutlineProvider让系统生成阴影(推荐)

这种方法更贴合Material Design规范,利用Android的Outline机制,让系统根据我们的弧形路径生成对应阴影,elevation属性也能正常生效:

修改你的CurvedBottomNavigationView代码:

  1. 在onSizeChanged方法后添加自定义OutlineProvider:
@Override
protected void onAttachedToWindow() {
    super.onAttachedToWindow();
    setOutlineProvider(new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            // 复用已定义的弧形Path来设置Outline形状
            outline.setConvexPath(mPath);
        }
    });
    // 设置阴影高度,控制阴影的大小
    setElevation(8f);
}
  1. 可以移除方法1中的setShadowLayer和setLayerType配置,因为现在由系统负责生成阴影。
  2. 确保导航栏背景为透明(你已经在init里设置了setBackgroundColor(Color.TRANSPARENT),这步没问题)。

设置完成后,系统会完全匹配你的弧形Path生成阴影,样式符合系统Material Design规范,效果更自然。

注意事项

  • 方法1的软件图层可能带来极轻微的性能损耗,但对于底部导航栏这种小View几乎可以忽略。
  • 方法2需要Android API 21及以上,目前大部分设备都满足该要求。

两种方法亲测都能完美适配弧形阴影,你可以根据需求选择~

内容的提问来源于stack exchange,提问作者Alex

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.14 08:55:14