绘制Rectagle与填充外部边界 [英] Draw Rectagle with fill outside bounds

问题描述

我在矩形填充外绘制一个矩形。我尝试了一些。但不能得到我所期望的完美的。

I am drawing an Rectangle with outside of rectangle fill. I tried some of this. But cant get the perfect one what i expected.

这是我的期望。

我尝试了

    Point pTopLeft = new Point();
    Point pBotRight = new Point();
    pTopLeft.x = 100;
    pTopLeft.y = 100;
    pBotRight.x = canvas.getWidth() - 100;
    pBotRight.y = canvas.getHeight() - 100;
    Rect above = new Rect(0, 0, canvas.getWidth(), pTopLeft.y);
    paint.setColor(Color.parseColor("#77000000"));
    canvas.drawRect(above, paint);
    Rect left = new Rect(0, pTopLeft.y, pTopLeft.x, pBotRight.y);
    paint.setColor(Color.parseColor("#77000000"));

    canvas.drawRect(left, paint);
    Rect right = new Rect(pBotRight.x, pTopLeft.y, canvas.getWidth(),
            pBotRight.y);
    paint.setColor(Color.parseColor("#77000000"));
    canvas.drawRect(right, paint);
    Rect bottom = new Rect(0, pBotRight.y, canvas.getWidth(),
            canvas.getHeight());

    paint.setColor(Color.parseColor("#77000000"));
    Paint paint_text = new Paint();
    paint_text.setColor(Color.WHITE);
    paint_text.setTextSize(50);
    paint_text.setTextAlign(Align.CENTER);

    canvas.drawText("Position Card in this Frame", canvas.getWidth() / 2,
            canvas.getHeight() - 30, paint_text);
    canvas.drawRect(bottom, paint);

。

但我想画矩形并填充边界以实现圆形边框。我如何做呢？

But i want to draw the rectangle and fill outside the bounds to achieve the rounded border. How can i do it?

编辑
当我试图画一个矩形。布局如下所示。

EDIT When i tries to draw the rectangle one over one. The layout is like this..

对于完全透明第二个矩形的中心矩形，我不能给 Color.TRANSPARENT / p>

That i cant give Color.TRANSPARENT for the center rectangle which fully tranparents the second rectangle..

推荐答案

我还是不确定你想要完成什么。您显示的形状可以如下绘制：

I'm still not entirely sure what you're trying to accomplish. The shape you show can be drawn as follows:

// set up some constants
int w = canvas.getWidth();
int h = canvas.getHeight();
RectF rect = new RectF(100, 100, w - 100, h - 100);
float radius = 10.0f; // should be retrieved from resources and defined as dp
float borderWidth = 2.0f; // ditto
int innerRectFillColor = 0x33000000; // or whatever shade it should be

// first fill the interior
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(innerRectFillColor);
paint.setStyle(Paint.Style.FILL);
canvas.drawRoundRect(rect, radius, radius, paint);
// then draw the border
paint.setColor(Color.WHITE);
paint.setStrokeWidth(borderWidth);
paint.setStyle(Paint.Style.STROKE);
canvas.drawRoundRect(rect, radius, radius, paint);

如果你想画一个洞（所以背景通过）周围的矩形将不工作，因为圆角（边框也使它更复杂）。相反，您可以创建一个具有透明孔的单独的位图，然后绘制它。您需要使用 CLEAR 的Porter-Duff传输模式在位图中打孔：

If instead you want to draw around a hole (so the background shows through), the trick of drawing the surrounding rectangles won't work because of the rounded corners (the border also makes it more complicated). Instead, you can create a separate Bitmap that has a transparent hole and then draw that. You'll need to use a Porter-Duff transfer mode of CLEAR to punch the hole in the bitmap:

// same constants as above except innerREctFillColor is not used. Instead:
int outerFillColor = 0x77000000;

// first create an off-screen bitmap and its canvas
Bitmap bitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas auxCanvas = new Canvas(bitmap);

// then fill the bitmap with the desired outside color
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(outerFillColor);
paint.setStyle(Paint.Style.FILL);
auxCanvas.drawPaint(paint);

// then punch a transparent hole in the shape of the rect
paint.setXferMode(new PorterDuffXferMode(PorterDuff.Mode.CLEAR));
auxCanvas.drawRoundRect(rect, radius, radius, paint);

// then draw the white rect border (being sure to get rid of the xfer mode!)
paint.setXferMode(null);
paint.setColor(Color.WHITE);
paint.setStyle(Paint.Style.STROKE);
auxCanvas.drawRoundRect(rect, radius, radius, paint);

// finally, draw the whole thing to the original canvas
canvas.drawBitmap(bitmap, 0, 0, paint);

这篇关于绘制Rectagle与填充外部边界的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！