专栏首页Android小知识一个蛋搞懂canvas.drawArc()

一个蛋搞懂canvas.drawArc()

Android 中的canvas有很多方法,画圆,画长方形,画椭圆型,那么如果让你画个蛋,你会怎么做呢。
  • 可能你会说drawOval,但是你看这个蛋它明显一头尖一头圆嘛,所以我的思路就是使用drawArc

思路如下:

  • 把圆看成两半
    • 一半用drawArc画半圆,画笔设置为填充
    • 另一半drawArc画椭圆,画笔设置为填充
    • 两个半圆拼在一起,当当当当鸡蛋的形状出现了!

啰嗦这么多,进入正题看一下drawArc方法

public void drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter,Paint paint) {
        super.drawArc(oval, startAngle, sweepAngle, useCenter, paint);
}
  • 分别需要5个参数,那它们分别代表什么意思呢?
    • oval:为确定圆弧区域的矩形,圆弧的中心点为矩形的中心点
    • startAngle:为圆弧的开始角度(时钟3点的方向为0度,顺时钟方向为正)
    • sweepAngle:为圆弧的扫过角度(正数为顺时钟方向,负数为逆时钟方向)
    • useCenter:表示绘制的圆弧是否与中心点连接成闭合区域
    • paint:paint为绘制圆弧的画笔

撸码环节

  • ①初始化画笔
    /**
     * 画笔颜色值
     */
    public static final int COLOR_STOCK = Color.parseColor("#F5DEB3");
    //抗锯齿
   mEggPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    //画笔样式填充        
  mEggPaint.setStyle(Paint.Style.FILL);
  mEggPaint.setColor(COLOR_STOCK);
  //开启抗锯齿
  mEggPaint.setAntiAlias(true);
  //开启防抖动
  mEggPaint.setDither(true);
  • ②获取中心点
    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        //获取画布的宽度
        float canvasWidth = right - left;
        //获取画布的高度
        float canvasHeight = bottom - top;
        //除以二得到中间值
        float x = canvasWidth / 2;
        float y = canvasHeight / 2;
        float r = canvasWidth / 2;
        mX = x;
        mY = y;
        mR = r;
    }
  • 画蛋
  @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //上半圆长方形Y方向设置比下半圆长凸显椭圆弧
        RectF ovalTop = new RectF(mX-mR, mY-mR-100, mX+mR, mY+mR+100);
        //从9点钟方向顺时针画弧线180度未与中心点闭合,画笔模式为填充
        canvas.drawArc(ovalTop, 180, 180, false, mEggPaint);

       //下半圆长方形半圆弧
        RectF oval3 = new RectF(mX-mR, mY-mR, mX+mR, mY+mR);
     //从3点钟方向顺时针画弧线180度未与中心点闭合,画笔模式为填充
        canvas.drawArc(oval3, 0, 180, false, mEggPaint);
    }
  • 效果图
    • 我这里布局写的宽高为100dp200dp毕竟是长方形嘛。

    效果图

注意如果是四个半圆画蛋的话第四个参数要设置为true,否则你画蛋中间将是空心的

好了,到这里蛋画好了drawArc你会了吗,当然我只是简单的举一个例子,建议分成四个半弧去画蛋,五个参数你需要自己去尝试一下,才能更充分地理解他们的作用,篇幅有限就不啰嗦了!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 利用Android画圆弧canvas.drawArc()实例详解

    在学习android中图形图像处理技术这部分内容时,对绘制圆弧函数canvas.drawArc()的用法、参数含义及画图原理很是不理解,在网上搜索了一些,加上自...

    砸漏
  • 利用kotlin实现一个饼图实例代码

    饼图是许多人最熟悉的图表类型,也是使用频率最高的图表类型之一,本文主要给大家介绍了关于利用kotlin实现饼图的相关内容,分享出来供大家参考学习,代码不难,所以...

    砸漏
  • 用kotlin来实现一个饼图

    Anonymous_95975_565
  • Android查缺补漏(View篇)--自定义View利器Canvas和Paint详解

    上篇文章介绍了自定义View的创建流程,从宏观上给出了一个自定义View的创建步骤,本篇是上一篇文章的延续,介绍了自定义View中两个必不可少的工具Canvas...

    codingblock
  • 组合与自绘,我该选用何种方式自定义Widget?

    在实际开发中,我们经常会遇到一些复杂的UI需求,往往无法通过使用Flutter的基本Widget,设置其属性参数来满足。这个时候,我们就需要针对特定的场景自定义...

    拉维
  • Android Canvas 绘制小黄人

    自定义MinionView extends View,定义以下成员变量,备用(可以先不看,后面的代码看到莫名其妙出来的变量再上来看下)

    glumes
  • Android自定义View验证码输入框

    本文实例为大家分享了Android自定义View验证码输入框的具体代码,供大家参考,具体内容如下

    砸漏
  • 一个小彩蛋

    今天要介绍的就是大神的 Scalpel,可以实现在手机上 3D 展示届满布局,而且用起来超级简单!

    蜻蜓队长
  • 12 个问题搞懂 Redis

    都说学习需要带着问题,带着思考进行学习,下面就以问题的形式来学习下 Redis 。

    oec2003
  • 一次搞懂Event loop

    MrTreasure
  • [图解Spark] 一张图搞懂DAGScheduler

    以下为我调试spark1.3.1源码对整个DAGScheduler工作流程画的详细流程图,以做备忘也希望对你有所帮助

    codingforfun
  • 一文搞懂Spring-AMQP

    12//设置消息发送ack,默认noneconnectionFactory.setPublisherConfirmType(CachingConnection...

    爱撒谎的男孩
  • 一文搞懂 Flink Timer

    顾名思义就是 Flink 内部的定时器,与 key 和 timestamp 相关,相同的 key 和 timestamp 只有一个与之对应的 timer。tim...

    shengjk1
  • 搞懂线程池(一)

    创建线程是一个很代价很高的操作,每个异步操作创建线程都会对 CPU 产生显著的性能影响。为了解决这个问题我们引入了线程池的概念,所谓的线程池就是我们提前分配一定...

    喵叔
  • 搞懂这几个锁用法,多线程就懂一半了

    synchronized机制是给共享资源上锁,只有拿到锁的线程才可以访问共享资源,这样就可以强制使得对共享资源的访问都是顺序的。

    java乐园
  • 我是这样搞懂一个神奇的BUG

    409 ?Conflict ? 平时很少遇到这样的错误,貌似很严重的样子,吓得我赶紧查看到底发生了什么。

    Fundebug
  • Android自定义View【实战教程】5⃣️---Canvas详解及代码绘制安卓机器人

    Android自定义View【实战教程】3⃣️—-Paint类、Path类以及PathEffect类详解

    先知先觉
  • 自定义控件之带渐变色的圆形进度条

    七夕到了,祝大家七夕节快乐! 今天给大家讲解一个简单的进度条的自定义。首页呢,我们看下效果图:

    吴延宝
  • Android 自定义球型水波纹带圆弧进度效果(实例代码)

    外围圆弧进度:可以通过canvas.drawArc()实现。由于圆弧需要实现渐变,可以通过给画笔设置shader(SweepGradient)渲染,为了保证圆弧...

    砸漏

扫码关注云+社区

领取腾讯云代金券