android - 来自WebView的Android位图缺少颜色

Question

我需要将 WebView 中显示的 CIELab 图表保存为图像。我使用的代码如下。

public Bitmap getBitmapFromView(View view, Context context) {
    DisplayMetrics displayMetrics = new DisplayMetrics();
    ((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);

    view.measure(displayMetrics.widthPixels, displayMetrics.heightPixels);
    view.layout(0, 0, displayMetrics.widthPixels, displayMetrics.heightPixels);
    view.buildDrawingCache();

    Bitmap bitmap = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);

    Canvas canvas = new Canvas(bitmap);
    view.draw(canvas);

    return bitmap;
}

下图显示了图表的示例。

有时生成的图像会丢失色环，如下所示。位图配置错了吗？奇怪的是，它并不总是发生。

编辑：在网页中，使用带有 2 个蒙版的扫描渐变来呈现圆形，以使其具有中间孔的圆形外观。我注意到如果我用一个简单的 png 图像作为背景替换它，位图转换可以正常工作。下面是网页代码。SweepGradient 类是此处定义的类。

<style>
    #maskWithHoleInTheMiddle {
        position: absolute;
        top: 0px;
        left: 10px;
        width: 540px;
        height: 540px;
        background: -moz-radial-gradient(transparent 294px, white 295px);
        background: -webkit-radial-gradient(transparent 269px, white 270px);
        background: -ms-radial-gradient(transparent 294px, white 295px);
        background: -o-radial-gradient(transparent 294px, white 295px);
        pointer-events: none;
    }

    #sweepCanvas {
        width: 540px;
        height: 540px;
        top: 0px;
        left: 10px;
    }

    #circleMask {
        background: #FFFFFF;
        width: 430px;
        height: 430px;
        border-radius: 50%;
        top: 55px;
        left: 66px;
    }
</style>

<div id="container">
    <canvas id="sweepCanvas"></canvas>
    <div id="maskWithHoleInTheMiddle"></div>
    <div id="circleMask"></div>
</div>

<script>        
    const displayElement = document.querySelector("#sweepCanvas");
    const displayRect = displayElement.getBoundingClientRect();
    const width = displayRect.width;
    const height = displayRect.height;
    displayElement.width = width;
    displayElement.height = height;
    const ctx = displayElement.getContext("2d");

    const x0 = 0;
    const y0 = 0;
    const x1 = width;
    const y1 = height;
    const g = new SweepGradient(ctx, x0, y0, x1, y1);

    g.addColorStop(0.0, "#ffd222");
    g.addColorStop(0.125, "#ff601f");
    g.addColorStop(0.25, "#fe1f87");
    g.addColorStop(0.375, "#a01ffe");
    g.addColorStop(0.5, "#21a6fc");
    g.addColorStop(0.625, "#1edffe");
    g.addColorStop(0.75, "#20ffd2");
    g.addColorStop(0.875, "#6cff20");
    g.addColorStop(1.0, "#ffd222");

    g.draw();
</script>

标签： androidchartsbitmapandroid-webview