Question

我正在尝试在视图中水平绘制4个圆圈。但问题是我只看到了3个半圈。圈子没有被正确绘制。以下代码有什么问题？

CircleView.java

public class CircleView extends View
{
    private int radius;
    private Paint blackPaint = new Paint();

    float eachDotWidth;
    float x = 0;
    float circleRadius;

    float width, height;

    public CircleView(Context context)
    {
        this(context, null);
    }

    public CircleView(Context context, AttributeSet attrs)
    {
        super(context, attrs);
        blackPaint.setStyle(Paint.Style.STROKE);
        blackPaint.setColor(Color.BLACK);
        blackPaint.setStrokeWidth(5f);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh)
    {
        super.onSizeChanged(w, h, oldw, oldh);
        calculateDimensions();
    }

    private void calculateDimensions()
    {

        width = getWidth() ;
        height = getHeight();

        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas)
    {
        super.onDraw(canvas);

        width = getWidth();
        height = getHeight();

        eachDotWidth = getWidth()/5;
        circleRadius = getHeight()/2;

        canvas.drawColor(Color.WHITE);
        for(int i=0; i < 4; i++) {
            x=(i*eachDotWidth)-circleRadius;
            canvas.drawCircle(x, 2*circleRadius, circleRadius/2, blackPaint);
        }
    }
}

MainActivity.java

public class MainActivity extends AppCompatActivity {

FrameLayout circleLayout;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    circleLayout = (FrameLayout) findViewById(R.id.circle_layout);

    CircleView circleView = new CircleView(this);

    circleLayout.addView(circleView, ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
}

}

请帮我查找并解决问题。感谢。

Answer 1

您可以创建垂直圆圈：

    @Override
protected void onDraw(Canvas canvas)
{
    super.onDraw(canvas);

    width = getWidth();
    height = getHeight();

    eachDotWidth = getWidth()/8;
    circleRadius = getHeight()/2;

    canvas.drawColor(Color.WHITE);
    for(int i=0; i < 4; i++) {
        x=(2*i*eachDotWidth)+eachDotWidth;
        canvas.drawCircle(x, eachDotWidth, eachDotWidth, blackPaint);
    }
}

您还可以创建水平圆圈：

   @Override
protected void onDraw(Canvas canvas)
{
    super.onDraw(canvas);

    width = getWidth();
    height = getHeight();

    eachDotWidth = getWidth()/8;
    circleRadius = getHeight()/8;

    canvas.drawColor(Color.WHITE);
    for(int i=0; i < 4; i++) {
        x=(2*i*circleRadius)+circleRadius;
        canvas.drawCircle(circleRadius, x, circleRadius, blackPaint);
    }
}

你也可以创建对角圆（创建y变量）：

 @Override
protected void onDraw(Canvas canvas)
{
    super.onDraw(canvas);

    width = getWidth();
    height = getHeight();

    eachDotWidth = getWidth()/8;
    circleRadius = getHeight()/8;

    canvas.drawColor(Color.WHITE);
    for(int i=0; i < 4; i++) {
        y=(2*i*circleRadius)+circleRadius;
        x=(2*i*eachDotWidth)+eachDotWidth;

        canvas.drawCircle(x, y, circleRadius, blackPaint);
    }
}

Answer 2

我认为您需要修改绘制圆圈的代码。例如，我不知道为什么你有一个圆的半径和一个＆＃34;点的宽度＆＃34;的单独值。我建议您只计算每个圆圈的半径，并在它们之间添加一些间距以合并宽度以满足您的需要。

尝试这样的事情（它在画布上的零坐标处绘制四个相等的圆圈宽度，但它并不能解释笔划的厚度）：

    // we want four equal circles across the whole width, so each circle's radius will be equal to 'width/(2*4)'
    circleRadius = width/8;
    // zero spacing for this example, but it can be defined
    int spacingPx = 0;

    canvas.drawColor(Color.WHITE);
    for(int i=0; i < 4; i++) {
        // the x-coordinate of each circle's middle will be a circle's radius offset by the width of the circles previously drawn plus a single spacing width multiplied by the number of the circles already drawn 
        x=(i*2*circleRadius) + circleRadius + i*spacingPx;
        // we just simply pass the values – calculated x coordinate, y coordinate (here we want to have the circle's top at 0, so we need to set its middle y-coordinate to the value of its radius), the circle's radius and the Paint object that you already defined
        canvas.drawCircle(x, circleRadius, circleRadius, blackPaint);
    }

Here's how it looks like

如果您想根据自己的需要进行自定义，请详细说明您希望如何绘制圆圈。

Answer 3

如果要绘制形状，使用Path和RectF会更灵活，您可以查看本教程： http://raphaelfavero.github.io/Creating_Animated_Custom_View/

画布在android视图中水平绘制圆圈

3 个答案: