【问题标题】:Android Fill Partial ArcAndroid 填充部分圆弧
【发布时间】:2013-07-11 12:42:18
【问题描述】:

如何使用paint 和canvas 方法填充下面显示的两条弧线之间的绿色部分?

这是我绘制两条弧线的方法,我也可以弄清楚如何用线将它们连接起来,但我不知道如何填充内部区域。

    // set to stroke black
    paint.setColor(Color.BLACK);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth((float) STROKE_WIDTH);

    // outside arc
    RectF arc_oval_outside = new RectF((float) (getX()), (float) (getY()),
            (float) (getX() + getWidth()), (float) (getY() + getHeight()));
    canvas.drawArc(arc_oval_outside, (float) (0.0), (45.0) (ARC_SWEEP), false, paint);

    // inside arc
    RectF arc_oval_inside = new RectF((float) (getX() + ARC_WIDTH), (float) (getY() + ARC_WIDTH),
            (float) (getX() + getWidth() - ARC_WIDTH), (float) (getY() + getHeight() - ARC_WIDTH));
    canvas.drawArc(arc_oval_inside, (float) (0.0), (float) (ARC_SWEEP), false, paint);

【问题讨论】:

    标签: java android android-canvas geometric-arc


    【解决方案1】:

    我知道这可能有点晚了,但我从一个 iOS 项目中采用了这种方法,首先绘制轮廓,然后绘制填充 弧

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
    
        float width = (float)getWidth();
        float height = (float)getHeight();
        float radius;
    
        //Get radius from the bigger size
        if (width > height){
            radius = height/2;
        }else{
            radius = width/2;
        }
    
        //Create Paint Object
        Paint paint = new Paint();
    
        paint.setColor(Color.RED);
        paint.setFilterBitmap(true);
        paint.setAntiAlias(true);
        paint.setStrokeWidth(5);
        paint.setStyle(Paint.Style.STROKE);
    
    
        //Create Contour Object
        Path path = new Path();
    
        float center_x, center_y;
        center_x = width/2;
        center_y = height/2;
    
        //Configure rect for the outer ring
        final RectF oval = new RectF();
        oval.set(center_x - radius + 5,
                center_y - radius + 5,
                center_x + radius - 5,
                center_y + radius - 5);
        //Add outer arc
        path.addArc(oval, 0, 90);
    
        //Configure rect for the inner ring
        oval.set(center_x - radius + 30,
                center_y - radius + 30,
                center_x + radius - 30,
                center_y + radius - 30);
    
        //Add inner arc to the path but draw counterclockwise
        path.arcTo(oval, -270, -90);
    
        //close path
        path.close();
    
        //Create Paint Object
        Paint fillPaint = new Paint();
    
        fillPaint.setColor(Color.YELLOW);
        fillPaint.setFilterBitmap(true);
        fillPaint.setAntiAlias(true);
        fillPaint.setStrokeWidth(21);
        fillPaint.setStyle(Paint.Style.STROKE);
    
        //Create Contour Object
        Path fillPath = new Path();
    
        //Configure rect for the fill ring
        oval.set(center_x - radius + 17,
                center_y - radius + 17,
                center_x + radius - 17,
                center_y + radius - 17);
    
        //Add fill arc
        fillPath.addArc(oval, 0, 90);
    
    
        //draw fill path
        canvas.drawPath(fillPath,fillPaint);
        //draw outer path
        canvas.drawPath(path, paint);
    }
    

    一个有用的链接:http://www.programering.com/a/MDO1czNwATE.html addarc 数学解释得很好

    【讨论】:

      【解决方案2】:

      以下是绘制带边框的实心圆弧的简单方法:

      Point center = new Point(canvas.getWidth()/2, canvas.getHeight()/2);
      int inner_radius = 100;
      int outer_radius = 150;
      int arc_sweep = 90;
      int arc_ofset = 30;
      
      RectF outer_rect = new RectF(center.x-outer_radius, center.y-outer_radius, center.x+outer_radius, center.y+outer_radius);
      RectF inner_rect = new RectF(center.x-inner_radius, center.y-inner_radius, center.x+inner_radius, center.y+inner_radius);
      
      Path path = new Path();
      path.arcTo(outer_rect, arc_ofset, arc_sweep);
      path.arcTo(inner_rect, arc_ofset + arc_sweep, -arc_sweep);
      path.close();
      
      Paint fill = new Paint();
      fill.setColor(Color.GREEN);
      canvas.drawPath(path, fill);
      
      Paint border = new Paint();
      border.setStyle(Paint.Style.STROKE);
      border.setStrokeWidth(2);
      canvas.drawPath(path, border);
      

      PathPaint 的分配很明显不是最优的)

      【讨论】:

        【解决方案3】:

        仅使用 drawArc 发布另一个选项。基本上我们首先绘制外圆弧,然后我们使用 PorterDuff.Mode.CLEAR 绘制较小的内圆弧来擦除并实现上述要求。

        Bitmap b = Bitmap.createBitmap(1200, 1200, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(b);
        int radius = 40;
        float startAngle = 45f;   // your start angle
        float sweepAngle = 90f;   // your sweep angle
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        paint.setColor(Color.rgb(37, 181, 215));
        paint.setStyle(Paint.Style.FILL);
        // draw outer arc
        RectF oval = new RectF(0, 0, canvas.getWidth(), canvas.getHeight());
        canvas.drawArc(oval, startAngle, sweepAngle, true, paint);
        // draw inner arc
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
        oval = new RectF((canvas.getWidth() / 2) - radius, (canvas.getHeight() / 2) - radius, (canvas.getWidth() / 2) + radius, (canvas.getHeight() / 2) + radius);
        canvas.drawArc(oval, startAngle, sweepAngle, true, paint);
        
        ImageView.setImageBitmap(b);
        

        希望对某人有所帮助。

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2012-02-14
          • 1970-01-01
          • 2016-01-26
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多