自定义可绘制边框与应用栏布局标题重叠

Question

这是我的自定义绘图默认情况下的外观。

但滚动时，它与AppBarLayout重叠。

Drawable的代码如下：

@Override
public void draw(@NonNull Canvas canvas) {

    // get drawable dimensions
    Rect bounds = getBounds();

    float width = bounds.right - bounds.left;
    float height = bounds.bottom - bounds.top;
    float w2 = width / 2;
    float h2 = height / 2;
    float radius = Math.min(w2, h2) - mStrokeWidth / 2;

    mPath.reset();
    mPath.addCircle(width / 2, height / 2, radius, Path.Direction.CW);
    canvas.clipPath(mPath);

    // draw background gradient

    float barHeight = height / themeColors.length;
    mRectF.left = 0;
    mRectF.top = 0;
    mRectF.right = width;
    mRectF.bottom = height;
    for (int i = 0; i < themeColors.length; i++) {
        mPaint.setColor(themeColors[i]);

        canvas.drawRect(0, i * barHeight, width, (i + 1) * barHeight, mPaint);
    }

    mRectF.set(0, 0, width, height);
    canvas.clipRect(mRectF, Region.Op.REPLACE);

    if (mStrokeWidth != 0)
        canvas.drawCircle(width / 2, height / 2, width / 2 - mStrokeWidth / 2, mStrokePaint);

}

支持库版本：25.3.1,26.1.0

我尝试过的： - 剪切路径的不同区域值而不是REPLACE - 首先剪切路径矩形，然后剪切圆圈。

我该如何解决这个问题？

Answer 1

我发布我的解决方案作为答案。

它重叠的原因是因为画布被剪掉了两次而没有保存它。

我删除了这句话：

canvas.clipRect(mRectF, Region.Op.REPLACE);

并在第一次剪裁画布之前 我使用

保存了州

canvas.save();
canvas.clipPath(mPath);

然后当我画笔画时，我需要原画布，所以我恢复了它

canvas.restore();
if (mStrokeWidth != 0)
    canvas.drawCircle(width / 2, height / 2, width / 2 - mStrokeWidth / 2, mStrokePaint);

这解决了这个问题。

最终可绘制代码：

@Override
public void draw(@NonNull Canvas canvas) {

    // get drawable dimensions
    Rect bounds = getBounds();

    float width = bounds.right - bounds.left;
    float height = bounds.bottom - bounds.top;
    float w2 = width / 2;
    float h2 = height / 2;
    float radius = Math.min(w2, h2) - mStrokeWidth / 2;

    mPath.reset();
    mPath.addCircle(width / 2, height / 2, radius, Path.Direction.CW);
    canvas.save();
    canvas.clipPath(mPath);

    // draw background gradient

    float barHeight = height / themeColors.length;
    mRectF.left = 0;
    mRectF.top = 0;
    mRectF.right = width;
    mRectF.bottom = height;
    for (int i = 0; i < themeColors.length; i++) {
        mPaint.setColor(themeColors[i]);

        canvas.drawRect(0, i * barHeight, width, (i + 1) * barHeight, mPaint);
    }

    mRectF.set(0, 0, width, height);
    //canvas.clipRect(mRectF, Region.Op.REPLACE);
    canvas.restore();

    if (mStrokeWidth != 0)
        canvas.drawCircle(width / 2, height / 2, width / 2 - mStrokeWidth / 2, mStrokePaint);

}