参考:

Egret教程Arc是使用示例:http://edn.egret.com/cn/article/index/id/673

我封装的工具类:

/**
* 圆形进度
* @author chenkai 2018/8/10
*/
class CircleProgress{
private target:egret.DisplayObject; //遮罩的目标
private shape:egret.Shape; //遮罩
private anticlockwise:boolean; //true逆时针 false顺时针
private dic:number; //角度增加方向 /**
* (anticlockwise, dic) (false,1)顺时针显示对象 (true,1)顺时针隐藏对象 (true,-1)逆时针显示对象 (false,-1)逆时针隐藏对象
* @param target 遮罩的对象
* @param anticlockwise
* @param dic
*/
public constructor(target:egret.DisplayObject, anticlockwise:boolean, dic:number){
this.target = target; this.shape = new egret.Shape();
this.shape.x = this.target.x + this.target.width/2;
this.shape.y = this.target.y + this.target.height/2;
target.parent && target.parent.addChild(this.shape); this.target.mask = this.shape; this.anticlockwise = anticlockwise;
this.dic = dic;
} /**
* 绘制进度
* @param value 0-1 进度
* @param offerAngle 角度偏移值,默认从0度开始画
*/
public drawProgress(value:number, offerAngle:number = 0){
if(value > 1){
value = 1;
}
var r = Math.max(this.target.width/2, this.target.height/2) / 2 * 1.5;
let startAngle = offerAngle;
let endAngle = (360*value + offerAngle)*this.dic;
this.shape.graphics.clear();
this.shape.graphics.beginFill(0x00ffff, 1);
this.shape.graphics.lineTo(r, 0);
this.shape.graphics.drawArc(0, 0, r, startAngle*Math.PI/180, endAngle * Math.PI / 180, this.anticlockwise);
this.shape.graphics.lineTo(0, 0);
this.shape.graphics.endFill();
} //销毁
public destroyMe(){
this.target = null;
}
}

  

使用方法:

let progress = new CircleProgress(this.clock,false,1);
progress.drawProgress(1/10);

  

圆形CD绘制 (扇形)的更多相关文章

  1. IOS-使用CAShapLayer绘制扇形

    IOS-使用CAShapLayer绘制扇形 为了增加应用体验感,我们动态绘制扇形或者饼状图效果. 这里我们使用CAShapeLayer,这样就不必再-(void)draw函数内绘制图形 参考代码 -( ...

  2. Unity3D之Mesh(六)绘制扇形、扇面、环形

    前言: 绘制了圆,就想到绘制与之相关的几何图形,以便更灵活的掌握Mesh动态创建模型的机制与方法. 一.分析: 首先,结合绘制圆的过程绘制环形: 圆形是由segments个等腰三角形组成的(上一篇中, ...

  3. html5--5-9 绘制扇形

    html5--5-9 绘制扇形 学习要点 综合运用已经学过的知识绘制一个扇形 矩形的绘制方法 rect(x,y,w,h)创建一个矩形 strokeRect(x,y,w,hx,y,w,h) 绘制矩形(无 ...

  4. 绘制扇形效果线条小Bug解决

    绘制线条基本代码: 变量: CPoint m_ptOrigin;//起点坐标 bool m_bTrue;//检查鼠标左键是否按下 CPoint m_ptOldOrigin;//记录上一次绘制终点坐标, ...

  5. canvas自适应圆形时钟绘制

    前面的话 前面介绍过canvas粒子时钟的绘制,本文将详细介绍canvas自适应圆形时钟绘制 效果演示 最终自适应圆形时钟的效果如下所示 功能分析 下面来分析一下该圆形时钟的功能 [1]静态背景 对于 ...

  6. [ActionScript 3.0] 动态绘制扇形实例(拖拽绘制)

    package { import flash.display.Shape; import flash.display.Sprite; import flash.events.MouseEvent; / ...

  7. [ActionScript 3.0] 绘制扇形方法

    /** * 绘制扇形 * @param mc 承载扇形的对象 * @param x 圆心角x * @param y 圆心角y * @param r 半径 * @param angle 绘制角度 * @ ...

  8. AS3绘制扇形算法解析

    网上有很多使用AS3画一个扇形的方法,但是却一个都没有解释这个函数是如何运作来画出扇形的,下面浅谈下我对这个函数的理解. 首先上代码,代码来自http://blog.csdn.net/weiming8 ...

  9. 在 Canvas 中绘制扇形

    在 HTML5 Canvas 中,我们可以通过 arc 方法来绘制圆形: // context.arc(x, y, r, sAngle, eAngle, counterclockwise); var ...

随机推荐

  1. PHP获取当前url路径的函数及服务器变量:$_SERVER["QUERY_STRING"],$_SERVER["REQUEST_URI"],$_SERVER["SCRIPT_NAME"],$_SER

    1,$_SERVER["QUERY_STRING"] 说明:查询(query)的字符串 2,$_SERVER["REQUEST_URI"] 说明:访问此页面所需 ...

  2. Android OpenGL ES 离屏渲染(offscreen render)

    通常在Android上使用OpenGL ES,都是希望把渲染后的结果显示在屏幕上,例如图片处理.模型显示等.这种情况下,只需要使用Android API中提供的GLSurfaceView类和Rende ...

  3. java Enum 类型互转

    refer:enum与int.String之间的转换http://www.blogjava.net/wangxinsh55/archive/2012/11/07/390958.html enum< ...

  4. 使用a标签制作tooltips

    摘要: 前面已经分享了三种方法制作tooltips,今天再来分享一个借助a标签来实现tooltips的方法. 效果如下:

  5. apache 配置会话保持

    1.修改apache_home/conf/httpd.conf,增加以下模块(取消注释,如有其他依赖, 则相应取消注释) LoadModule proxy_module modules/mod_pro ...

  6. NPOI把Excel导入到数据库

    二,把Excel中的数据导入到数据库的具体步骤: protected void Button1_Click(object sender, EventArgs e)        {           ...

  7. MAC下Android的Eclipse开发环境的搭建 转自MacroCheng

    原文地址:  http://www.cnblogs.com/macro-cheng/archive/2011/09/30/android-001.html 一.Eclipse的下载 到网站:http: ...

  8. MongoDB入门知识

    基本概念 MongoDB是一个面向文档的数据库,不是关系型数据库.MongoDB是无模式的,也就是说文档的键不需要事先定义,也不会是一成不变. 跟关系数据库相比,MongoDB中出现了一些新的定义: ...

  9. vuejs使用FormData对象,ajax上传图片文件

    我相信很多使用vuejs的朋友,都有采用ajax上传图片的需求,因为前后端分离后,我们希望都能用ajax来解决数据问题,传统的表单提交会导致提交成功后页面跳转,而使用ajax能够无刷新上传图片等文件. ...

  10. HttpClinet学习笔记

    本文为学习httpClient学习过程中转载的文章,若涉及版权请留言. ----------------------------- 前言 超文本传输协议(HTTP)也许是当今互联网上使用的最重要的协议 ...