我们要花的为一个黄色的五角星并且其中的填充黄色能够任意调整,比如只填满半个五角星,或者只填满一个角等等。

首先要重写DrawRect 方法,然后在这里实现我们的画图代码。

- (void)drawRect:(CGRect)rect
{ CGFloat centerX = rect.size.width / 2;
CGFloat centerY = rect.size.height / 2; CGFloat r0 = self.radius * sin(18 * th)/cos(36 * th); /*计算小圆半径r0 */
CGFloat x1[5]={0},y1[5]={0},x2[5]={0},y2[5]={0}; for (int i = 0; i < 5; i ++)
{
x1[i] = centerX + self.radius * cos((90 + i * 72) * th); /* 计算出大圆上的五个平均分布点的坐标*/
y1[i]=centerY - self.radius * sin((90 + i * 72) * th);
x2[i]=centerX + r0 * cos((54 + i * 72) * th); /* 计算出小圆上的五个平均分布点的坐标*/
y2[i]=centerY - r0 * sin((54 + i * 72) * th);
} CGContextRef context = UIGraphicsGetCurrentContext();
CGMutablePathRef startPath = CGPathCreateMutable();
CGPathMoveToPoint(startPath, NULL, x1[0], y1[0]); for (int i = 1; i < 5; i ++) { CGPathAddLineToPoint(startPath, NULL, x2[i], y2[i]);
CGPathAddLineToPoint(startPath, NULL, x1[i], y1[i]);
} CGPathAddLineToPoint(startPath, NULL, x2[0], y2[0]);
CGPathCloseSubpath(startPath); CGContextAddPath(context, startPath); CGContextSetFillColorWithColor(context, self.startColor.CGColor); CGContextSetStrokeColorWithColor(context, self.boundsColor.CGColor);
CGContextStrokePath(context); CGRect range = CGRectMake(x1[1], 0, (x1[4] - x1[1]) * self.value , y1[2]); CGContextAddPath(context, startPath);
CGContextClip(context);
CGContextFillRect(context, range); CFRelease(startPath); }

  

由于这样的五角星是中空的,所以我们选取十个点,首先五角星五个尖在一个大圆上,且在大圆上平均分布,内角的五个点在一个小圆上,也是平均分布。

最后创建路径。创建好路径后要进行色彩填充,分为描边以及内容。

描边为黑色,内容为黄色

这里的self.value是一个0-1的值,用来表示星星填充的范围,为1代表整个星星全部填充为黄色。

这里设置一个变量range 描绘了这个星星需要填充的范围

最后利用CGContextFillRect  这个方法  将range范围进行黄色填充

利用IOS画图功能画出五角星,并且可以调整五角星的填充范围的更多相关文章

  1. IOS上怎样画出1像素的线

    #define SINGLE_LINE_WIDTH (/[UIScreen mainScreen].scale) #define SINGLE_LINE_ADJUST_OFFSET ((/[UIScr ...

  2. Android中利用画图类和线程画出闪烁的心形

                                                        本文讲解主要涉及的知识点: 1.线程控制 2.画图类 3.心形函数 大家先看图片: <ig ...

  3. 利用ggplot2画出各种漂亮图片详细教程

    1.Why use ggplot2 ggplot2是我见过最human friendly的画图软件,这得益于Leland Wilkinson在他的著作<The Grammar of Graphi ...

  4. 利用LineRenderer画出一个圆,类似于lol中的攻击范围

    http://www.unity蛮牛.com/blog-5945-1409.html 本人大四狗,学unity半年有余,写此文章纯粹记录自己的心得. 废话不多说,进入主题.... 效果如图: 首先要理 ...

  5. 利用python画出动态高优先权优先调度

    之前写过一个文章. 利用python画出SJF调度图 动态高度优先权优先调度 动态优先权调度算法,以就绪队列中各个进程的优先权作为进程调度的依据.各个进程的优先权在创建进程时所赋予,随着进程的推进或其 ...

  6. CSS画出三角形(利用Border)

    画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及颜色. 如果你将宽度调的足够大,改变不同方向的颜色,你就可以发现盒模型的border是四个梯形一样的线条. div{ width ...

  7. IOS 封装功能和逻辑思想

    在ios开发中,难免会用到helper的思想.这篇就简单讲解下关于helper的简单实用方法. 假设我们要做一个这样的界面: 会议分为四种情况: 未召开 正在召开 已结束 已取消 再看看逻辑关系: 编 ...

  8. iOS开发之画图板(贝塞尔曲线)

    贝塞尔曲线,听着挺牛气一词,不过下面我们在做画图板的时候就用到贝塞尔绘直线,没用到绘制曲线的功能.如果会点PS的小伙伴会对贝塞尔曲线有更直观的理解.这篇博文的重点不在于如何用使用贝塞尔曲线,而是利用贝 ...

  9. 由两点坐标如何画出直线 matlab

    由两点坐标如何画出直线  方法1:利用直线方程 斜率加截距 方法2:数据拟合 %由两点坐标得数据拟合直线与画线 x = [,]; y = [,]; k = ((-)/(-));% 由两点坐标得到直线斜 ...

随机推荐

  1. codeforces 256 div2 C. Painting Fence 分治

    C. Painting Fence time limit per test 1 second memory limit per test 512 megabytes input standard in ...

  2. Angular i18n

    Angular2中使用ngx-translate进行国际化http://blog.csdn.net/u014291497/article/details/61233033 在 Angular 项目中添 ...

  3. [java]String和Date、Timestamp之间的转换

    一.String与Date(java.util.Date)互转  1.1 String -> Date Date date = DateFormat.parse(String  str); St ...

  4. Web开发中常用的定位布局position

    定位布局就是为开发提供了更好的布局方式,可以根据需求给相应的模块设定相应位置,从而使界面更佳丰富,代码更佳完美. position是CSS中非常重要的一个属性,通过position属性,我们可以让元素 ...

  5. hybird app项目实例:安卓webview中HTML5拍照图片上传

    应用的平台环境:安卓webview: 涉及的技术点: (1) <input type="file" > :在开发中,安卓webview默认点击无法调用文件选择与相机拍照 ...

  6. ExtJS 6 如何引入Dashboard模版

    最近很多人问我在ext js 6+的版本中怎么引入官方的dashboard模版,正好我好久没写博客了,这里我写一篇博客来说明一下. 在这里以ext js 6.2.1版本为例(注:需要安装Sencha ...

  7. Jenkins的2个问题

    最近CI服务器从老版本的hudson升级为jenkins,遇到了2个问题,记录一下: 1.升级为jenkins后,junit report里面显示的test case数量为原来的两倍,每个test c ...

  8. 【LeetCode 144_二叉树_遍历】Binary Tree Preorder Traversal

    解法一:非递归 vector<int> preorderTraversal(TreeNode* root) { vector<int> res; if (root == NUL ...

  9. jQuery判断checkbox是否选

    方法一: if ($("#checkbox-id").get(0).checked) { // do something } 方法二: if($('#checkbox-id').i ...

  10. L200

    Last week, I read a story about a 34-year-old British woman who is extremely afraid of metal forks.S ...