Android Canvas和Paint基本使用

    这篇文章主要介绍下画笔Paint和画布Canvas的基本使用

    1.Paint

   创建对象Paint mPaint = new Paint();

   常用的基本方法有 :

                    mPaint.setAntiAlias(true); (抗锯齿)

          mPaint.setColor(Color.WHITE);(画笔颜色)

          mPaint.setARGB(int a, int r, int g, int b);取值都是0~255 

          mPaint.setAlpha (int a);设置画笔透明度,取值0~255

          mPaint.setDither(boolean dither):防抖动,这个属性的需求场景主要出现在绘制渐变色彩或含渐变的图片时,Android对不含alpha通道的图片会进行一个转化

          mPaint.setStyle(画笔样式)

          mPaint.setStyle(Paint.Style style):设置画笔的样式,为FILL,FILL_OR_STROKE,或STROKE

          mPaint.setStrokeCap(设置画笔帽)

          mPaint.setStrokeCap(Paint.Cap cap):当画笔样式为STROKE或FILL_OR_STROKE时,设置笔刷的图形样式,如圆形样式;Cap.ROUND,或方形样式Cap.SQUARE

          mPaint.setStrokeWidth(float width):当画笔样式为STROKE或FILL_OR_STROKE时,设置笔刷的粗细度

          mPaint.setXfermode(Xfermode xfermode):设置图形重叠时的处理方式,如合并,取交集或并集

             mPaint.setShadowLayer(float radius ,float dx,float dy,int color):在图形下面设置阴影层,产生阴影效果,radius为阴影的角度,dx和dy为阴影在x轴和y轴上的距离,color为阴影                                                                                                        的颜色

   2. Canvas基本用法

    2.1 基本方法有

      canvas.drawArc ();画扇形

      canvas.drawCircle();画圆

      canvas.drawOval();画椭圆

      canvas.drawLine();画线

      canvas.drawPoint();画点

      canvas.drawRect();画矩形

         canvas.drawRoundRect();画圆角矩形

      canvas.drawVertices();画顶点

           canvas.drawPath();画路径

                      canvas.drawBitmap();画位图

         canvas.drawText() ;画文字

    2.2

      2.2.1 画扇形

           private void drawArc(Canvas canvas) {

              RectF rectF = new RectF(0, 0, 100, 100);
              paint.setColor(Color.parseColor("#33333333"));
              //oval :指定圆弧的外轮廓矩形区域。
              //startAngle: 圆弧起始角度,单位为度。从180°为起始点
              //sweepAngle: 圆弧扫过的角度,顺时针方向,单位为度。
              //useCenter: 如果为True时,在绘制圆弧时将圆心包括在内,通常用来绘制扇形。如果false会将圆弧的两端用直线连接
              //paint: 绘制圆弧的画板属性,如颜色,是否填充等
              canvas.drawRect(rectF,paint);
              paint.setColor(Color.parseColor("#ff0000"));
              canvas.drawArc(rectF,0,90,true,paint);
        }
       运行效果如下:
        

      
2.2.2 画圆
         代码如下
        
private void drawCircle(Canvas canvas) {
                 paint.setColor(Color.GREEN);
                 //cx : 圆心在x轴上的坐标
                 //cy :  圆心的y轴上的坐标
                 //radius:  半径
                 canvas.drawCircle(50,50,50,paint);
          }
        效果如下:
        

      2.2.3 画椭圆
         代码如下:
         
private void drawOval(Canvas canvas) {
                paint.setColor(Color.BLACK);
                RectF rectF = new RectF(0, 0, 150, 100);
                //oval : 外接矩形
                canvas.drawOval(rectF,paint);
          }
        效果如下:

        

        2.2.4   画线

          代码如下:

          private void drawLine(Canvas canvas) {

                canvas.drawLine(0,0,100,100,paint);
                canvas.translate(0,110);

                //画一组线
                float[] pts={0,0,100,0,
                   100,0,100,100,
                    100,100,0,100,
                     1,100,1,0};
                //线宽
                paint.setStrokeWidth((float) 2.0);
                //pts : 绘制直线的端点数组,每条直线占用4个数据。
                //canvas.drawLines(pts, paint);
                //offset : 指定跳过的数据个数
                //count : 指定取出数据的个数
                canvas.drawLines(pts,4,12,paint);
          }
          效果如下:
          

 

     2.2.5 画点

          代码如下:

           private void drawPoint(Canvas canvas) {

                paint.setStrokeWidth((float) 5.0);
                canvas.drawPoint(50,50,paint);
                canvas.translate(0,100);

                float[] pst = {20,20,40,40,60,60};
                paint.setColor(Color.RED);
                canvas.drawPoints(pst,paint);
                canvas.translate(0,100);
                //跳过前两个元素
                canvas.drawPoints(pst,2,4,paint);
          }
          效果如下: 
          

      2.2.6  画矩形

         代码如下:

        private void drawRect(Canvas canvas) {
                canvas.drawRect(0,0,100,100,paint);
                canvas.translate(0,110);

                canvas.drawRect(new RectF(0,0,100,100),paint);
                canvas.translate(0,110);

                canvas.drawRect(new Rect(0,0,100,100),paint);
          }
        效果如下:
        

      2.2.7 画圆角矩形

        代码如下:

        private void drawRoundRect(Canvas canvas) {

                paint.setColor(Color.BLUE);
                //rect : 要绘制的矩形
                //rx : x轴方向的弧度
                //ry : y轴方向上的弧度
                canvas.drawRoundRect(new RectF(0,0,100,100),10,10,paint);
           }
        效果如下:
        

    2.2.8 画路径
        代码如下:
        
private void drawPath(Canvas canvas) {
                Path path = new Path();         //Path对象
                path.moveTo(10, 50);   //起始点
                path.lineTo(50, 50);    //连线到下一点
                path.lineTo(10, 150);   //连线到下一点
                path.lineTo(50, 100);    //连线到下一点
                path.lineTo(50, 100);   //连线到下一点
                paint.setColor(Color.RED);//红色
                canvas.drawPath(path, paint);   //绘制任意多边形
          }
        效果如下:
        

    2.2.9 画图片
        代码如下:
        
private void drawBitmap(Canvas canvas) {
                Bitmap bitmap=((BitmapDrawable)getResources().getDrawable(R.mipmap.ic_launcher)).getBitmap();
                //left : 位图距左边的偏移量
                //top : 位图距顶部的偏移量
                Rect rect = new Rect(0, 0, 100, 100);
                RectF rectf = new RectF(0, 0, 50, 50);

                //src : 是对图片进行裁截,若是空null则显示整个图片
                //dst :是图片在Canvas画布中显示的区域,大于src则把src的裁截区放大, 小于src则把src的裁截区缩小。
                canvas.drawBitmap(bitmap,rect,rectf,paint);
          }
         效果如下:
         

     2.2.10 画文字
         代码如下
        
 private void drawText(Canvas canvas) {
                paint.setTextSize(30);
                Paint.FontMetrics fm = paint.getFontMetrics();
                //x : 绘制时x轴偏移量
                //y :绘制时y轴偏移量
                canvas.drawText("Android",0,(fm.bottom - fm.top) / 2,paint);//这里要计算文字绘制的起点,因为文字是按baseLine来绘制的。
          }
        效果如下:
        

 

        最后我们看一个例子 实现下面这种效果:
        
        首先我们定义一个view 实现onDraw()方法 代码如下:
        

          我们通过不断改变mCurPercent之后调用postInvalidate()方法进行实时绘制,就能看到进度动画了。其实Canvas功能还能很强大的,大家可以不断的学习。

          这篇文章不错 推荐下 http://blog.csdn.net/wangrain1/article/details/73287908

 

 

 

 

 
 

 

 
 

 

 
 
 

 

 

 


      

 

 

    

 

 

 

posted @ 2017-06-29 17:28  帅气的码农  阅读(3496)  评论(0编辑  收藏  举报