Drawing a squircle shape on canvas (Android)

2019-05-10 04:50发布

问题:

Here is what I'm using to draw a circle shape on to the canvas (and then an icon bitmap on it):

private static Bitmap makeIcon(int radius, int color, Bitmap icon) {
    final Bitmap output = Bitmap.createBitmap(radius, radius, Bitmap.Config.ARGB_8888);
    final Canvas canvas = new Canvas(output);
    final Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setColor(color);
    canvas.drawARGB(0, 0, 0, 0);
    if (Build.VERSION.SDK_INT > Build.VERSION_CODES.KITKAT)
        canvas.drawCircle(radius / 2, radius / 2, radius / 2, paint);
    else
        canvas.drawRect(0, 0, radius, radius, paint);
    int cx = (radius - icon.getWidth()) >> 1; // same as (...) / 2
    int cy = (radius - icon.getHeight()) >> 1;
    canvas.drawBitmap(icon, cx, cy, paint);
    icon.recycle();
    return output;
}

But I have no idea on how to draw a squircle shape instead of the circle shape. FYI, here are some examples of icons using the squircle shape:

回答1:

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Path squirclePath = getSquirclePaath(150, 250, 400);
        canvas.drawPath(squirclePath, mPaint);
    }

    private static Path getSquirclePaath(int left, int top, int radius){
        //Formula: (|x|)^3 + (|y|)^3 = radius^3
        final double radiusToPow = radius * radius * radius;

        Path path = new Path();
        path.moveTo(-radius, 0);
        for (int x = -radius ; x <= radius ; x++)
            path.lineTo(x, ((float) Math.cbrt(radiusToPow - Math.abs(x * x * x))));
        for (int x = radius ; x >= -radius ; x--)
            path.lineTo(x, ((float) -Math.cbrt(radiusToPow - Math.abs(x * x * x))));
        path.close();

        Matrix matrix = new Matrix();
        matrix.postTranslate(left + radius, top + radius);
        path.transform(matrix);

        return path;
    }

Hope this helps, here is a preview: