canvas.drawRect如何绘制矩形 [英] How canvas.drawRect draws a rectangle

问题描述

我必须创建一个自定义视图，在其中必须绘制一个矩形.我正在尝试使用canvas.drawRect方法.我想创建像这样的矩形

I have to create a custom view where I have to draw a rectangle. I'm trying to use the canvas.drawRect method. I wanted to create rectangles somethig like this

灰色是我的自定义视图，它扩展了View类. 在onDraw方法内部，我试图绘制矩形.

the gray colored one is my custom view which is extending the View class. Inside the onDraw method I'm trying to draw the rectangle.

但是实际上我对drawRect方法的参数感到困惑.

But actually I'm confused with the parameters of the drawRect method.

根据文档

/**
 * Draw the specified Rect using the specified paint. The rectangle will
 * be filled or framed based on the Style in the paint.
 *
 * @param left   The left side of the rectangle to be drawn
 * @param top    The top side of the rectangle to be drawn
 * @param right  The right side of the rectangle to be drawn
 * @param bottom The bottom side of the rectangle to be drawn
 * @param paint  The paint used to draw the rect
 */

我假设左侧和顶部形成起点的x，y坐标，右侧是宽度，而底部是高度.但这似乎不起作用.

What I assume is that left and top forms the x,y coordinates of the starting point, and right is the width and bottom is the height. But it doesn't seem to work that way.

我尝试过类似的操作来绘制一个矩形，但它没有绘制任何内容

I tried something like this to draw one rectangle but it does not draw anything

       paint.setColor(Color.BLUE);
       canvas.drawRect(5, canvas.getHeight()/2, 30, 30, paint );

任何人都可以说出使用这些值绘制矩形的精确度吗?

Can anyone please tell how exactly a rectangle is drawn using these values?

如果有人可以显示代码以至少绘制第一个矩形，这将非常有帮助.

It would be very helpful if someone could show the code to draw at least the first rectangle.

我的要求是，内部矩形的数量是动态的，因此如果我将4个传递给此View，则它应水平创建4个等宽的矩形.类似于

My requirement is like, the number of inner rectangles are dynamic, so if I pass some 4 to this View, it should create 4 equal width rectangles horizontally. something like

提前谢谢！

推荐答案

但是实际上我对drawRect方法的参数感到困惑.

But actually I'm confused with the parameters of the drawRect method.

drawRect方法仅需要两个坐标即可绘制一个矩形. 左上角和右下角.所以这4个点构成了这2个坐标 在你的画布上.希望从下面的图片中清楚

The drawRect method requires only two coordinates to draw a rectangle. The top left corner and the bottom right corner. So the 4 points form these 2 coordinates in your canvas. Hope it is clear from the below images

P1和P2是(left，top)和(right，bottom)形成的点，所以绘制的矩形将像这样.

P1 and P2 are points formed by (left,top) and (right,bottom), So the drawn rectangle would be like this.

要动态绘制矩形(如图像中所示)，请尝试类似的操作

To draw rectangles dynamically like you have shown in you image , try something like this

int[] colors = new int[]{Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW}; // given some fixed colors

您的onDraw方法

@Override
    protected void onDraw(Canvas canvas) {
    int padding = 5;
    float rectangleWidth = (getMeasuredWidth() - padding * 2) / colors.length;
    for (int i = 0; i < colors.length; i++) {
        paint.setColor(colors[i]);
        canvas.drawRect(padding + (rectangleWidth * i), getMeasuredHeight() / 2, padding + rectangleWidth * (i + 1), getMeasuredHeight() - padding, paint); // 5 px is the padding given to the canvas
    }
  }

这篇关于canvas.drawRect如何绘制矩形的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！