Canvas 的drawRect 几个参数理解

    xiaoxiao2021-03-25  60

    摘自博客地址:http://blog.csdn.NET/show214/article/details/8922597

    昨天写了一个View视图,在上面画了一个矩形,这个视图的最后效果如图:

    主要代码如下:

    package com.view; import com.example.testsql.R; import Android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Paint.Style; import android.view.View; public class MyView extends View { MyView(Context context) { super(context); } @Override protected void onDraw(Canvas canvas) { // TODO Auto-generated method stub super.onDraw(canvas); // 首先定义一个paint Paint paint = new Paint(); paint.setColor(Color.RED); // 设置样式-空心矩形 paint.setStyle(Style.STROKE); // 绘制一个矩形 canvas.drawRect(150, 75, 250, 120, paint); paint.setColor(Color.YELLOW); canvas.drawRect(250, 75, 350, 120, paint); paint.setColor(Color.GREEN); canvas.drawRect(150, 120, 250, 170, paint); paint.setColor(Color.CYAN); canvas.drawRect(250, 120, 350, 170, paint); // 绘文字 // 设置颜色 paint.setColor(Color.BLACK); // 绘文字 canvas.drawText("Hello1", 200, 90, paint); canvas.drawText("Hello2", 300, 100, paint); canvas.drawText("Hello3", 200, 150, paint); canvas.drawText("Hello4", 300, 170, paint); // 绘图 // 从资源文件中生成位图 Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.back); // 绘图 canvas.drawBitmap(bitmap, 270, 140, paint); } }

    其中关于canvas.drawRect(150, 75, 250, 120, paint); 的这个方法,我想说一下关于Canvas 的 drawRect 几个参数理解,

    其实网上大部分的解释是

    left:矩形的左边位置。

    top:矩形的上边位置。

    right:矩形的右边位置。

    bottom:矩形的下边位置。

    但是我个人怎么看都不是很懂,于是我就开始问自己一个问题,如果要两个点来确定一个矩形,那这两个点应该怎样放呢?不用多想,一定是对角!那确定了对角关系后,我就开始尝试画四方格,实际上也就是四个矩形拼凑而成。 于是我自己在纸上画了一下,如下图:

    canvas.drawRect(150, 75, 250, 120, paint);  A1     A2 canvas.drawRect(250, 75, 350, 120, paint);        B1    B2 canvas.drawRect(150, 120, 250, 170, paint);     C1    C2 canvas.drawRect(250, 120, 350, 170, paint);     D1    D2

    只要先确认第一个矩形,那么B1的坐标就是于A1同Y轴与A2同x轴。以此类推。

    canvas.drawText("Hello1", 200, 90, paint);

    canvas.drawText("Hello2", 300, 100, paint);

    canvas.drawText("Hello3", 200, 150, paint);

    canvas.drawText("Hello4", 300, 170, paint);

    而文字hello1,只要x轴只要在A1和B1的x轴之间,Y轴在B1和A2的Y轴之间,文字就不会出边框,其它以此类推。

     

    而这个类的调用方法也很简单:

    package com.view;      import android.annotation.SuppressLint;   import android.app.Activity;   import android.os.Bundle;      @SuppressLint("WrongCall")   public class DisplayView extends Activity{          @Override       protected void onCreate(Bundle savedInstanceState) {                      super.onCreate(savedInstanceState);                   setContentView(new MyView(this));              }             }   [java]  view plain  copy   package com.view;      import android.annotation.SuppressLint;   import android.app.Activity;   import android.os.Bundle;      @SuppressLint("WrongCall")   public class DisplayView extends Activity{          @Override       protected void onCreate(Bundle savedInstanceState) {                      super.onCreate(savedInstanceState);                   setContentView(new MyView(this));              }             }  

    最后,加上一点个人理解。drawrect()中的四个参数分别代表距离左边,上边,右边和下边的位置距离坐标。

    在绘制矩形时我们一般都会这样写:

    startX 起始X坐标

    stopX 结束X坐标

    startY起始Y坐标

    stopY 结束Y坐标

    然后直接调用canvas.drawRect(startX, startY, stopX, stopY, paint);进行绘制一般情况下绘制时没有问题的。因此不会发现存在的一个问题,即当所给的终点坐标有值为负数时将绘制不出矩形了。同理椭圆 绘制时也会存在这个问题,因为你看椭圆绘制canvas.drawOval(new RectF(startX, startY, stopX, stopY), paint);就可以知道了。

    对于矩形我们改进的方法有两个,如果找不到原因的话,可以直接将矩形拆分为画线的方式来绘制。画四条线, 但是椭圆就难了,我暂时没找到方法。

    上面的只是权宜之计,我们忘了一个规则才导致出现上面的这个情况。

    既是在绘制矩形时必须这样规定起始点和终点,起始点与你坐标定义的(0,0)位置保持一致,终点在其的对角线上。比如你定义的其实点在左上角,那么你绘制图形时必须保证你的绘制起点在左上角。

    下边是改进后的代码,

     if(startX > stopX && startY > stopY){ // 往左上 canvas.drawRect(new RectF(stopX, stopY, startX, startY), paint); }else if(startX < stopX && startY > stopY){// 往右上 canvas.drawRect(new RectF(startX, stopY, stopX, startY), paint); }else if(startX > stopX && startY < stopY){// 往左下 canvas.drawRect(new RectF(stopX, startY, startX, stopY), paint); }else if(startX < stopX && startY < stopY){// 往右下 canvas.drawRect(new RectF(startX, startY, stopX, stopY), paint); }

    转载请注明原文地址: https://ju.6miu.com/read-37499.html

    最新回复(0)